backdrop-filter fallback

This commit is contained in:
Miroslav Šedivý 2020-02-08 17:23:55 +01:00
parent 610ff2ecad
commit f27d628524
2 changed files with 10 additions and 10 deletions

View file

@ -156,10 +156,6 @@ body {
background: white;
}
.b_post.is_hidden {
border-color: black;
}
.b_post.is_hidden .b_overlay {
display: flex;
}

View file

@ -28,6 +28,7 @@
--filter: none;
--filter-hover: invert(0.25);
--overlay-background: rgba(0, 0, 0, .25);
--overlay-fallback-background: #ccc;
}
@media (prefers-color-scheme: dark) {
@ -61,6 +62,7 @@
--filter: invert(0.62) sepia(0.98) saturate(0.12) hue-rotate(175deg) brightness(0.9) contrast(0.96);
--filter-hover: invert(1);
--overlay-background: rgba(255, 255, 255, .25);
--overlay-fallback-background: #555;
}
}
@ -212,18 +214,20 @@ body {
height: 100%;
border-radius: 8px;
z-index: 1;
backdrop-filter: blur(25px);
background: var(--overlay-background);
background: var(--overlay-fallback-background);
}
@supports (backdrop-filter: blur(25px)) {
.b_overlay {
backdrop-filter: blur(25px);
background: var(--overlay-background);
}
}
.b_overlay .button {
background: var(--primary-background);
}
.b_post.is_hidden {
box-shadow: inset 0px 0px 9px -1px var(--primary-text)
}
.b_post.is_hidden .b_overlay {
display: flex;
}