mirror of
https://github.com/MarginaliaSearch/MarginaliaSearch.git
synced 2025-02-24 05:18:58 +00:00
Handle themeing when javascript is disabled. Hide the theme select and fallback to dark media query instead of data-theme attribute
This commit is contained in:
parent
e2f68d9ccf
commit
fb2eef24d6
@ -29,8 +29,7 @@
|
||||
}
|
||||
|
||||
|
||||
:root[data-theme='dark'] {
|
||||
|
||||
@mixin dark-theme-mixin {
|
||||
color-scheme: dark;
|
||||
|
||||
--clr-bg-page: hsl(0, 0%, 6%);
|
||||
@ -56,6 +55,16 @@
|
||||
--clr-heading-link-visited: var(--clr-link-visited);
|
||||
}
|
||||
|
||||
:root[data-theme='dark'] {
|
||||
@include dark-theme-mixin;
|
||||
}
|
||||
|
||||
// Makes theme match the user's OS preference when JS is disabled
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root:not(:has([data-has-js="true"])) {
|
||||
@include dark-theme-mixin;
|
||||
}
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
@ -234,6 +243,11 @@ header {
|
||||
#theme {
|
||||
margin-left: auto;
|
||||
margin-right: .5ch;
|
||||
display: none;
|
||||
|
||||
[data-has-js='true'] & {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
#complaint {
|
||||
|
Loading…
Reference in New Issue
Block a user