mirror of
https://github.com/Sendouc/sendou.ink.git
synced 2026-09-30 07:12:36 -05:00
Add background for Popover on Firefox
This commit is contained in:
@@ -5,6 +5,7 @@
|
||||
--bg-darker: hsl(237.3deg 42.3% 26.6%);
|
||||
--bg-lighter: hsl(237.3deg 42.3% 35.6%);
|
||||
--bg-lighter-transparent: hsla(237.3deg 42.3% 35.6% / 50%);
|
||||
--bg-darker-transparent: hsla(237.3deg 42.3% 26.6% / 90%);
|
||||
--bg-modal-backdrop: hsla(237deg 98% 1% / 70%);
|
||||
--border: hsl(237.3deg 42.3% 45.6%);
|
||||
--button-text: rgb(0 0 0 / 85%);
|
||||
@@ -444,13 +445,20 @@ hr {
|
||||
.popover-content {
|
||||
max-width: 20rem;
|
||||
padding: var(--s-2);
|
||||
backdrop-filter: blur(10px) brightness(75%);
|
||||
background-color: var(--bg-darker-transparent);
|
||||
border-radius: var(--rounded);
|
||||
font-size: var(--fonts-sm);
|
||||
font-weight: var(--semi-bold);
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) {
|
||||
.popover-content {
|
||||
backdrop-filter: blur(10px) brightness(75%);
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.combobox-input {
|
||||
width: 12rem;
|
||||
}
|
||||
|
||||
@@ -30,6 +30,8 @@
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: var(--s-2);
|
||||
|
||||
/* TODO: add fallback from Firefox */
|
||||
backdrop-filter: blur(5px);
|
||||
background: rgb(0 0 0 / 25%);
|
||||
border-start-end-radius: var(--rounded);
|
||||
|
||||
@@ -41,6 +41,8 @@
|
||||
position: absolute;
|
||||
display: flex;
|
||||
padding: var(--s-1-5);
|
||||
|
||||
/* TODO: add fallback from Firefox */
|
||||
backdrop-filter: blur(5px) grayscale(25%);
|
||||
border-end-end-radius: var(--rounded);
|
||||
border-start-start-radius: var(--rounded);
|
||||
|
||||
Reference in New Issue
Block a user