Fixed up dark mode, added placeholders for the dashboard inputs

Signed-off-by: arzumify <jliwin98@danwin1210.de>
This commit is contained in:
Tracker-Friendly 2024-10-27 15:29:21 +00:00
parent 88bde3f592
commit 28003d7093
2 changed files with 17 additions and 14 deletions

View File

@ -15,7 +15,7 @@ html {
:root { :root {
--invertdm: 0%; --invertdm: 0%;
--text-color: #000000; --text-color: #000000;
--editor: #ffffff; --background: #ffffff;
--border-color: #dadada; --border-color: #dadada;
--theme-color: #1c71d8; --theme-color: #1c71d8;
--hover-theme-color: #4990e7; --hover-theme-color: #4990e7;
@ -35,7 +35,7 @@ html {
--invertdm: 100%; --invertdm: 100%;
--inOutDiv: #2d2f31; --inOutDiv: #2d2f31;
--text-color: #ffffff; --text-color: #ffffff;
--editor: #1E1E1E; --background: #1E1E1E;
--nonimporant-theme-color: #8E8E8E; --nonimporant-theme-color: #8E8E8E;
--nonimportant-text-color: #fff; --nonimportant-text-color: #fff;
--border-color: #393b3d; --border-color: #393b3d;
@ -43,6 +43,10 @@ html {
--disabled-hover: #737373; --disabled-hover: #737373;
} }
html {
background: linear-gradient(to top left, rgb(0 17 35), rgb(7 36 45), rgb(28 45 36), rgb(49 49 49)) no-repeat center center fixed;
}
.inOutDiv p { .inOutDiv p {
color: white !important; color: white !important;
} }
@ -50,11 +54,6 @@ html {
.inOutDiv a { .inOutDiv a {
color: #969696 !important; color: #969696 !important;
} }
.inOutDiv input {
color: white;
background-color: var(--editor);
}
} }
p, p,
@ -101,6 +100,9 @@ input {
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;
background-color: var(--background);
color: var(--text-color);
border: solid; border: solid;
border-color: var(--border-color); border-color: var(--border-color);
border-width: 1px; border-width: 1px;
@ -109,7 +111,7 @@ input {
} }
.inputBox .captchaDiv { .inputBox .captchaDiv {
background-color: var(--editor); background-color: var(--background);
height: 32px; height: 32px;
width: calc(100% - 15px); width: calc(100% - 15px);
margin: 0 5px 0 5px; margin: 0 5px 0 5px;
@ -119,7 +121,7 @@ input {
} }
.inputBox .captchaDiv button { .inputBox .captchaDiv button {
background-color: var(--editor); background-color: var(--background);
color: var(--text-color); color: var(--text-color);
border-right: 1px solid var(--border-color); border-right: 1px solid var(--border-color);
border-radius: 0; border-radius: 0;
@ -241,6 +243,7 @@ input {
.oauthEntry img, .sessionEntry img { .oauthEntry img, .sessionEntry img {
max-height: 64px; max-height: 64px;
margin-top: 10px; margin-top: 10px;
filter: invert(var(--invertdm));
} }
button { button {
@ -355,7 +358,7 @@ h2 {
left: 0; left: 0;
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
background-color: #fff; background-color: var(--background);
animation: swipe 0.2s forwards; animation: swipe 0.2s forwards;
display: none; display: none;
} }
@ -373,7 +376,7 @@ h2 {
left: 0; left: 0;
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
background-color: #fff; background-color: var(--background);
} }
.swipe-out-animate { .swipe-out-animate {

View File

@ -20,13 +20,13 @@
<h2>Submit a new OAuth2 App</h2> <h2>Submit a new OAuth2 App</h2>
<p id="statusBox"></p> <p id="statusBox"></p>
<p>App Name:</p> <p>App Name:</p>
<input id="nameBox"> <input id="nameBox" placeholder="Example App">
<p>Redirect URI:</p> <p>Redirect URI:</p>
<input id="redirectUriBox"> <input id="redirectUriBox" placeholder="https://example.com/oauth2/callback">
<p>Enable OpenID:</p> <p>Enable OpenID:</p>
<input type="checkbox" id="openIdBox"> <input type="checkbox" id="openIdBox">
<p>Client key-share URI (optional, will add the clientKeyShare scope):</p> <p>Client key-share URI (optional, will add the clientKeyShare scope):</p>
<input id="clientKeyShareBox"> <input id="clientKeyShareBox" placeholder="https://example.com/clientKeyShare">
<br> <br>
<button style="margin-top: 10px;" id="submitButton">Submit</button> <button style="margin-top: 10px;" id="submitButton">Submit</button>
</div> </div>