fix: images in dark mode

This commit is contained in:
eggy 2022-08-07 21:45:53 -04:00
parent 04cc83b8da
commit 16f13263d6
2 changed files with 21 additions and 1 deletions

View File

@ -136,9 +136,24 @@ html.dark .drawer {
.drawer li a { .drawer li a {
/* overwrite tailwind */ /* overwrite tailwind */
text-decoration: none; text-decoration: none;
border-radius: 0.5rem;
width: 100%; width: 100%;
} }
.drawer li a:hover,
.drawer li a:active {
--drawer-active-color: lightgray;
background: var(--drawer-active-color);
}
html.dark .drawer li a {
--drawer-active-color: darkslategray;
}
html.dark .drawer img {
filter: invert(1); /* brightness didn't work */
}
/* hamburger animation */ /* hamburger animation */
.ham { .ham {

View File

@ -38,6 +38,10 @@ html.dark nav {
--nav-drop-color: black; --nav-drop-color: black;
} }
html.dark nav img {
filter: invert(1);
}
ul { ul {
display: flex; display: flex;
align-items: center; align-items: center;
@ -61,7 +65,8 @@ li.home-text {
--trans: 0.2s ease; --trans: 0.2s ease;
--box-trans-time: 0.4s; --box-trans-time: 0.4s;
transition: opacity var(--trans), transform var(--trans), gap var(--trans), transition: opacity var(--trans), transform var(--trans), gap var(--trans),
width var(--trans), box-shadow var(--box-trans-time) ease; width var(--trans), box-shadow var(--box-trans-time) ease,
filter var(--trans);
} }
@media screen and (max-width: 600px) { @media screen and (max-width: 600px) {