diff options
author | tpart <tpart120@proton.me> | 2023-12-22 16:02:18 +0100 |
---|---|---|
committer | tpart <tpart120@proton.me> | 2023-12-22 16:02:32 +0100 |
commit | df008833d068152724f23282c1f305d0d1d4636b (patch) | |
tree | 51ea4cb8c548588047aa9adbb4030274e9f998e7 /web | |
parent | 208a845a28f47fb6aef56ba447cfc7c2e093ac20 (diff) | |
download | jellything-df008833d068152724f23282c1f305d0d1d4636b.tar jellything-df008833d068152724f23282c1f305d0d1d4636b.tar.bz2 jellything-df008833d068152724f23282c1f305d0d1d4636b.tar.zst |
Resize backdrop based on viewport height
Diffstat (limited to 'web')
-rw-r--r-- | web/style/nodepage.css | 13 |
1 files changed, 9 insertions, 4 deletions
diff --git a/web/style/nodepage.css b/web/style/nodepage.css index 91cdccc..121a397 100644 --- a/web/style/nodepage.css +++ b/web/style/nodepage.css @@ -6,18 +6,18 @@ */ .backdrop { width: calc(100% + 2 * var(--main-side-margin)); - height: calc(var(--backdrop-height) + 5em); + height: min(50vh, calc(var(--backdrop-height) + 5em)); margin-left: calc(-1 * var(--main-side-margin)); margin-right: calc(-1 * var(--main-side-margin)); margin-top: calc(-1 * var(--bar-height)); margin-bottom: -5em; -webkit-mask-image: linear-gradient( rgba(0, 0, 0, 1), - transparent calc(var(--backdrop-height) + 5em) + transparent min(50vh, calc(var(--backdrop-height) + 5em)) ); mask-image: linear-gradient( rgba(0, 0, 0, 1), - transparent calc(var(--backdrop-height) + 5em) + transparent min(50vh, calc(var(--backdrop-height) + 5em)) ); -webkit-mask-mode: alpha; mask-mode: alpha; @@ -43,7 +43,6 @@ } .page.node .title h1 { - display: inline; margin-right: 1em; } .page.node .title .play { @@ -84,4 +83,10 @@ } .dirup:hover { filter: brightness(120%); +} + +@media (max-width: 500px) { + .page.node .bigposter { + margin: 1.5em; + } }
\ No newline at end of file |