Improve dark theme

This commit is contained in:
grandeljay 2022-10-12 19:44:26 +02:00
parent 10d98763bc
commit b35379b379
2 changed files with 27 additions and 6 deletions

View file

@ -15,6 +15,7 @@ body {
} }
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
body { body {
color: #fff;
background-color: #2c2c2c; background-color: #2c2c2c;
} }
} }
@ -140,7 +141,7 @@ figure {
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
.wishlist .ui.card > .image > img.preview { .wishlist .ui.card > .image > img.preview {
filter: brightness(80%); filter: brightness(80%);
background-color: #000; background-color: #111;
} }
} }

View file

@ -54,7 +54,7 @@
.ui.basic.active.button, .ui.basic.active.button,
.ui.basic.buttons .active.button { .ui.basic.buttons .active.button {
background-color: rgba(255, 255, 255, .08); background-color: rgba(255, 255, 255, .08);
color: #000 !important; color: #111 !important;
box-shadow: 0 0 0 2px rgba(255, 255, 255, .7) inset; box-shadow: 0 0 0 2px rgba(255, 255, 255, .7) inset;
} }
@ -103,7 +103,7 @@
/** Buttons */ /** Buttons */
.wishlist .ui.card > .extra.buttons { .wishlist .ui.card > .extra.buttons {
background-color: #000 !important; background-color: #111 !important;
} }
/** /**
@ -123,7 +123,7 @@
* Dimmer * Dimmer
*/ */
.ui.dimmer { .ui.dimmer {
background-color: rgba(255, 255, 255, .85); background-color: rgba(98, 98, 98, 0.85);
} }
/** /**
@ -283,6 +283,14 @@
border-color: #e0b4b4; border-color: #e0b4b4;
} }
/** Loading */
.ui.loading.form::before {
background-color: rgba(27, 28, 29, 0.85);
}
.ui.loading.form {
color: #fff;
}
/** /**
* Header * Header
*/ */
@ -351,16 +359,28 @@
border: none !important; border: none !important;
} }
/**
* Message
*/
.ui.message {
background-color: #1b1c1d !important;
color: rgba(255, 255, 255, .9);
}
.ui.error.message,
.ui.error.message .header {
color: #ecd1d1;
}
/** /**
* Modal * Modal
*/ */
.ui.modal { .ui.modal {
background-color: #000 !important; background-color: #111 !important;
} }
.ui.modal > .content, .ui.modal > .content,
.ui.modal > .header { .ui.modal > .header {
background-color: #000; background-color: #111;
color: #fff; color: #fff;
} }