standardebooks/web
1
0
Fork 0
mirror of https://github.com/standardebooks/web.git synced 2025-07-09 16:20:27 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Move dark mode CSS to bottom to override other styles if necessary

Browse source
This commit is contained in:
Alex Cabal 2019-10-25 17:17:27 -05:00
parent df9ccb9947
commit 4b5ffced51
1 changed files with 45 additions and 43 deletions
Download patch file Download diff file Expand all files Collapse all files

88
www/css/core.css
View file

@ -100,7 +100,7 @@
--body-bg: var(--light-body-bg);
}
@media (prefers-color-scheme: dark){
@media(prefers-color-scheme: dark){
:root{
--body-text: var(--dark-body-text);
--highlight: var(--dark-highlight);
@ -110,48 +110,6 @@
--sub-text: var(--dark-sub-text);
--body-bg: var(--dark-body-bg);
}
main.front-page > section > section figure img{
box-shadow: 3px 3px 1px rgba(0, 0, 0, .5);
}
article.ebook section#download ul li a[class]::before,
article.ebook section#details ul li a[class]::before,
footer p:last-child a::before,
main.front-page > section > section figure.oss img + img,
main.front-page > section > h2::before,
main.front-page > section > h2::after{
filter: invert() grayscale(100%) brightness(120%); /* grayscale and brightness makes it hit about #eeeeee */
}
label.search{
box-shadow: 1px 1px 0 rgba(0, 0, 0, .5) inset;
}
input::placeholder{
color: rgba(255, 255, 255, .75);
}
blockquote,
figure.text{
background: rgba(0,0,0,.25);
}
code.terminal{
background-color: var(--light-body-text);
}
main.ebooks > ol img:hover{
box-shadow: 3px 3px 1px rgba(0, 0, 0, .5);
}
article.ebook #more-ebooks img:hover{
box-shadow: 3px 3px 1px rgba(0, 0, 0, .5);
}
label.search::before{
text-shadow: 1px 1px 0 #000;
}
}
html{
@ -1952,3 +1910,47 @@ main.ebooks nav ol li.highlighted:nth-last-child(2)::after{
text-align: left;
}
}
@media(prefers-color-scheme: dark){
main.front-page > section > section figure img{
box-shadow: 3px 3px 1px rgba(0, 0, 0, .5);
}
article.ebook section#download ul li a[class]::before,
article.ebook section#details ul li a[class]::before,
footer p:last-child a::before,
main.front-page > section > section figure.oss img + img,
main.front-page > section > h2::before,
main.front-page > section > h2::after{
filter: invert() grayscale(100%) brightness(120%); /* grayscale and brightness makes it hit about #eeeeee */
}
label.search{
box-shadow: 1px 1px 0 rgba(0, 0, 0, .5) inset;
}
input::placeholder{
color: rgba(255, 255, 255, .75);
}
blockquote,
figure.text{
background: rgba(0,0,0,.25);
}
code.terminal{
background-color: var(--light-body-text);
}
main.ebooks > ol img:hover{
box-shadow: 3px 3px 1px rgba(0, 0, 0, .5);
}
article.ebook #more-ebooks img:hover{
box-shadow: 3px 3px 1px rgba(0, 0, 0, .5);
}
label.search::before{
text-shadow: 1px 1px 0 #000;
}
}