Enhance icon visibility for light and dark modes with !important declarations
This commit is contained in:
parent
c952be061e
commit
2916d31d08
1 changed files with 9 additions and 4 deletions
13
dist/css/styles.css
vendored
13
dist/css/styles.css
vendored
|
|
@ -347,14 +347,19 @@ a:hover {
|
||||||
height: 20px;
|
height: 20px;
|
||||||
transition: opacity var(--transition-fast);
|
transition: opacity var(--transition-fast);
|
||||||
}
|
}
|
||||||
.moon-icon {
|
/* Light mode: show sun, hide moon */
|
||||||
display: none;
|
.sun-icon {
|
||||||
|
display: block !important;
|
||||||
}
|
}
|
||||||
|
.moon-icon {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
/* Dark mode: hide sun, show moon */
|
||||||
[data-theme="dark"] .sun-icon {
|
[data-theme="dark"] .sun-icon {
|
||||||
display: none;
|
display: none !important;
|
||||||
}
|
}
|
||||||
[data-theme="dark"] .moon-icon {
|
[data-theme="dark"] .moon-icon {
|
||||||
display: block;
|
display: block !important;
|
||||||
}
|
}
|
||||||
/* Mobile Navigation Toggle */
|
/* Mobile Navigation Toggle */
|
||||||
.nav-toggle {
|
.nav-toggle {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue