diff options
| author | Henry Jameson <me@hjkos.com> | 2024-03-04 18:24:29 +0200 |
|---|---|---|
| committer | Henry Jameson <me@hjkos.com> | 2024-03-04 18:24:29 +0200 |
| commit | a190389f3c9f44072465560dce7203e9ce328f2c (patch) | |
| tree | 2518e48f79648cc9ef53bde0580f5a314a1feb86 /src/panel.scss | |
| parent | a2f2a0e4090e9fdc9d227fe8fa13fad9ac529887 (diff) | |
panels/statuses are looking really good now even with transparency
Diffstat (limited to 'src/panel.scss')
| -rw-r--r-- | src/panel.scss | 10 |
1 files changed, 10 insertions, 0 deletions
diff --git a/src/panel.scss b/src/panel.scss index 5df9fee4..08339765 100644 --- a/src/panel.scss +++ b/src/panel.scss @@ -1,5 +1,8 @@ /* stylelint-disable no-descending-specificity */ .panel { + --__panel-background: var(--background); + --__panel-backdrop-filter: var(--backdrop-filter); + position: relative; display: flex; flex-direction: column; @@ -28,6 +31,8 @@ .panel-body { padding: var(--panel-body-padding, 0); + background: var(--background); + backdrop-filter: var(--__panel-backdrop-filter); &:empty::before { content: "¯\\_(ツ)_/¯"; // Could use words but it'd require translations @@ -50,6 +55,7 @@ --__panel-heading-height: 3.2em; --__panel-heading-height-inner: calc(var(--__panel-heading-height) - 2 * var(--panel-heading-height-padding, 0)); + backdrop-filter: var(--__panel-backdrop-filter); position: relative; box-sizing: border-box; display: grid; @@ -131,6 +137,9 @@ border-radius: var(--roundness) var(--roundness) 0 0; border-width: 0 0 1px; align-items: start; + background-image: + linear-gradient(to bottom, var(--background), var(--background)), + linear-gradient(to bottom, var(--__panel-background), var(--__panel-background)); &::after { background-color: var(--background); @@ -186,5 +195,6 @@ border-width: 1px 0 0; border-style: solid; border-color: var(--border); + background-color: var(--__panel-background); } /* stylelint-enable no-descending-specificity */ |