diff --git a/CHANGELOG.md b/CHANGELOG.md index e545953..5b38089 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -58,6 +58,13 @@ Format follows [Keep a Changelog](https://keepachangelog.com/en/1.1.0/); version flush against the field above, and Save limit and Remove limit — two posts, hence two forms — share one row, the first button bound to its form by the `form` attribute rather than by sitting inside it. +- The mark at the head of the navigation column takes the column's full width + instead of the 110px it kept from the bar. In a row that size was all there + was room for; in a column it left the mark ending halfway across, with no + edge shared with anything below it. At the column's width its edges line up + with the page entries under it, as the full mark already does with the card + beneath it on the signed-out pages. Where the column lies back down into a + bar it returns to the compact size, which is what fits beside the entries. ## [0.5.0] - 2026-08-06 diff --git a/internal/web/static/panel.css b/internal/web/static/panel.css index 4555de9..c5b0ff5 100644 --- a/internal/web/static/panel.css +++ b/internal/web/static/panel.css @@ -239,10 +239,13 @@ button.danger:hover, a.danger:hover { background: #912018; } padding and rounding the entry rule below applies, so its own edge lines up with the entries' icons rather than sitting half a step inside them. */ .nav .brand { padding: 0; } -/* width/height are on the element too, so the row reserves the space before the - SVG has loaded; these keep the ratio if the box is ever squeezed. The stamp's - proportions are part of the mark — it is never scaled unevenly. */ -.nav .brand img { display: block; width: 110px; height: auto; } +/* The mark takes the column's full width, so its edges line up with the entries + below it rather than ending halfway across — the same way .mark fills the + card column on the pages that carry no navigation. width/height are on the + element too, so the column reserves the right height before the SVG has + loaded; height stays automatic because the stamp's proportions are part of + the mark — it is never scaled unevenly. */ +.nav .brand img { display: block; width: 100%; height: auto; } /* Each entry pairs an icon with its label, so the entry itself is a flex row rather than a run of text — that is also why the entries centre their items instead of aligning them on the text baseline. In the column the entry fills @@ -309,6 +312,10 @@ button.danger:hover, a.danger:hover { background: #912018; } flex-direction: row; flex-wrap: wrap; align-items: center; gap: 0.4rem 1.2rem; padding-bottom: 0.6rem; border-bottom: 1px solid var(--border); } + /* Lying down there is no column for the mark to span, and at its full width + it would take a row to itself above the entries, so it goes back to the + compact size it had — enough to read beside them. */ + .nav .brand img { width: 110px; } /* Each block keeps its own group of entries together and wraps as one; the rules that separated the blocks vertically become the space between them. */ .nav .links, .nav .session, .nav .sections { diff --git a/internal/web/templates/layout.html b/internal/web/templates/layout.html index 915d349..fe04ed3 100644 --- a/internal/web/templates/layout.html +++ b/internal/web/templates/layout.html @@ -55,7 +55,7 @@ the column: the mark, the panel's pages, the current page's own sections, and the session last. The mark goes to /status, the page the panel opens on — named outright rather than as "/", which is only a redirect to it. */}} - SelfPost + SelfPost