From 7fa1c08ce8430ca5a49fecf97e883b35a691c899 Mon Sep 17 00:00:00 2001 From: LucaP Date: Sun, 11 Oct 2026 00:43:25 +0300 Subject: [PATCH] fix: file the end-of-route sign inside the destination panel --- src/styles/route.css | 25 +++++++++++++++++++++---- 1 file changed, 21 insertions(+), 4 deletions(-) diff --git a/src/styles/route.css b/src/styles/route.css index 3dfb0ed..c35ad06 100644 --- a/src/styles/route.css +++ b/src/styles/route.css @@ -154,13 +154,30 @@ @media screen and (min-width: 768px) { .reading-stage .portfolio-section[data-layout='destination'] { inline-size: min(900px, 64%); - /* The end-of-route sign hangs below the destination in its margin, so - the destination itself still fits one desktop viewport. */ + /* The destination is the last stop: it ends just above the lower + letterbox bar (and its credit), so the whole stack, heading included, + sits below the upper bar when the page is scrolled to the end. */ padding-block-end: 0; - margin-block-end: clamp(140px, 20vh, 200px); + margin-block-end: 0; } + /* Padding, not margin: a trailing margin collapses out of the column. */ + .reading-stage .portfolio-main:has(> [data-layout='destination']) { + padding-block-end: calc(min(8vh, 72px) + 28px); + } + /* The end-of-route sign is filed inside the panel's lower right, level + with the social links, instead of hanging over the credit below. It is + static: nothing about it depends on the arrived state. */ .reading-stage .portfolio-section[data-layout='destination']::after { - inset-block: calc(100% + 28px) auto; + inset-block: auto clamp(22px, 3.4vh, 40px); + inset-inline: auto clamp(24px, 3vw, 44px); + padding: 0; + border: 0; + background: none; + box-shadow: none; + color: rgb(255 226 196 / 82%); + font-size: 0.68rem; + line-height: 1.6; + text-align: end; } .reading-stage [data-layout='destination'] > h2 { font-size: clamp(64px, min(10vw, 15vh), 168px);