diff options
| author | Fuwn <[email protected]> | 2024-01-05 18:38:16 -0800 |
|---|---|---|
| committer | Fuwn <[email protected]> | 2024-01-05 18:38:16 -0800 |
| commit | 86ae4869afaa561393c0b90aeb5825ca97dd149b (patch) | |
| tree | a054bf9822b770297545bfc63c5217c9ba1bca41 /src | |
| parent | refactor(html): remove old theme force (diff) | |
| download | due.moe-86ae4869afaa561393c0b90aeb5825ca97dd149b.tar.xz due.moe-86ae4869afaa561393c0b90aeb5825ca97dd149b.zip | |
feat(css): blurred shadows
Diffstat (limited to 'src')
| -rw-r--r-- | src/app.css | 18 | ||||
| -rw-r--r-- | src/lib/Tools/Schedule/Tool.svelte | 2 | ||||
| -rw-r--r-- | src/lib/Tools/Wrapped.svelte | 4 |
3 files changed, 17 insertions, 7 deletions
diff --git a/src/app.css b/src/app.css index 13972546..e4add81c 100644 --- a/src/app.css +++ b/src/app.css @@ -5,12 +5,13 @@ body { font-family: 'Ubuntu', sans-serif; font-size: 1rem; line-height: 1.5; + text-shadow: 0 0 0.25em var(--base01); } details { - background-color: var(--base001); + background-color: var(--base0011); padding: 1rem; - border-radius: 4px; + border-radius: 8px; box-shadow: 0 0 0 1px var(--base01), 0 2px 4px var(--base01); } @@ -166,10 +167,17 @@ button:disabled:active { } .card { - background-color: var(--base001); + background-color: var(--base0011); padding: 1rem; - border-radius: 4px; + border-radius: 8px; box-shadow: 0 0 0 1px var(--base01), 0 2px 4px var(--base01); + backdrop-filter: blur(4px); + -webkit-backdrop-filter: blur(4px); +} + +.card details, +.no-shadow { + box-shadow: none; } code { @@ -223,6 +231,7 @@ html { :root { --base00: #f8f8f8; --base001: #ffffff; + --base0011: #ffffff80; --base01: #e8e8e8; --base02: #d8d8d8; --base03: #b8b8b8; @@ -244,6 +253,7 @@ html { :root { --base00: #080808; --base001: #0c0c0c; + --base0011: #0c0c0c80; --base01: #181818; --base02: #282828; --base03: #484848; diff --git a/src/lib/Tools/Schedule/Tool.svelte b/src/lib/Tools/Schedule/Tool.svelte index cf859445..63817e3e 100644 --- a/src/lib/Tools/Schedule/Tool.svelte +++ b/src/lib/Tools/Schedule/Tool.svelte @@ -214,7 +214,7 @@ } .today { - border: 1px solid var(--base0E); + box-shadow: 0 0 0 1px var(--base0E), 0 2px 4px var(--base0E); } .list { diff --git a/src/lib/Tools/Wrapped.svelte b/src/lib/Tools/Wrapped.svelte index a01d9934..b84b9adf 100644 --- a/src/lib/Tools/Wrapped.svelte +++ b/src/lib/Tools/Wrapped.svelte @@ -575,7 +575,7 @@ <details open> <summary>Options</summary> <div id="options"> - <details open> + <details class="no-shadow" open> <summary>Display</summary> <input type="checkbox" bind:checked={watermark} /> Show watermark<br /> @@ -619,7 +619,7 @@ Width adjustment<br /> </details> - <details open> + <details class="no-shadow" open> <summary>Calculation</summary> <input type="checkbox" bind:checked={useFullActivityHistory} /> |