Fixed issue with dark mode icons, fixed dark mode loading animation

This commit is contained in:
Tracker-Friendly 2024-06-15 20:02:33 +01:00
parent ef65931cda
commit ae03eaf8c1
1 changed files with 13 additions and 13 deletions

View File

@ -16,17 +16,15 @@
--note-button-text-color: #ffffff; --note-button-text-color: #ffffff;
--unselected-note-button-text-color: #000000; --unselected-note-button-text-color: #000000;
--option-background: #ffffff; --option-background: #ffffff;
--invert: 100%; --invertdm: 0%;
--sessioninvert: 100%;
--bottomBarHover: #e4e4e4;
} }
/* dark mode */ /* dark mode */
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
:root { :root {
--contrast: #2d2f21; --contrast: #323436;
--contrast2: #2d2f21; --contrast2: #202124;
--bar: #2d2f31; --bar: #2d2f31;
--editor: #202124; --editor: #202124;
--text-color: #ffffff; --text-color: #ffffff;
@ -39,9 +37,7 @@
--note-button-text-color: #ffffff; --note-button-text-color: #ffffff;
--unselected-note-button-text-color: #ffffff; --unselected-note-button-text-color: #ffffff;
--option-background: #202124; --option-background: #202124;
--invert: 100%; --invertdm: 100%;
--sessioninvert: 0%;
--bottomBarHover: #e4e4e4;
} }
.startDiv p { .startDiv p {
@ -180,8 +176,9 @@ body {
} }
.bottomBar button { .bottomBar button {
filter: invert(var(--invertdm));
background-color: rgba(0, 0, 0, 0); background-color: rgba(0, 0, 0, 0);
color: var(--text-color); color: #000000;
height: 100%; height: 100%;
border: none; border: none;
font-size: 14px; font-size: 14px;
@ -212,7 +209,7 @@ body {
} }
.bottomBar button:hover { .bottomBar button:hover {
background-color: var(--bottomBarHover); background-color: var(--note-button);
} }
.bottomBar .right { .bottomBar .right {
@ -268,6 +265,7 @@ body {
text-align: right; text-align: right;
margin-left: auto; margin-left: auto;
cursor: pointer; cursor: pointer;
filter: invert(var(--invertdm));
} }
.topBar img { .topBar img {
@ -358,6 +356,7 @@ body {
.notesBar .newNote img { .notesBar .newNote img {
height: 32px; height: 32px;
padding-right: 5px; padding-right: 5px;
filter: invert(var(--invertdm));
} }
.noteBox { .noteBox {
@ -497,7 +496,7 @@ iframe#markdown {
background: var(--theme-color); background: var(--theme-color);
} }
.optionsDiv progresss::-webkit-progress-value { .optionsDiv progress::-webkit-progress-value {
background: var(--theme-color); background: var(--theme-color);
} }
@ -519,7 +518,7 @@ iframe#markdown {
left: 20px; left: 20px;
scale: 1.3; scale: 1.3;
transform: translateY(1px); transform: translateY(1px);
filter: invert(var(--sessioninvert)) !important; filter: invert(100%);
} }
.optionsDiv .section { .optionsDiv .section {
@ -563,7 +562,7 @@ iframe#markdown {
.sessionDiv img { .sessionDiv img {
display: inline; display: inline;
filter: none !important; filter: invert(var(--invertdm));
height: 35px; height: 35px;
position: static; position: static;
margin-right: 5px; margin-right: 5px;
@ -813,6 +812,7 @@ iframe#markdown {
.links a img { .links a img {
transform: translateY(5px); transform: translateY(5px);
padding-right: 10px; padding-right: 10px;
filter: invert(var(--invertdm));
} }
.links a:hover { .links a:hover {