From 5f2fb4479ad6c1a581b1eb2ac2196f2b637204f2 Mon Sep 17 00:00:00 2001 From: khannurien Date: Fri, 9 Oct 2026 20:53:29 +0000 Subject: [PATCH] =?UTF-8?q?v4:=20the=20settings'=20controls=20line=20up=20?= =?UTF-8?q?down=20the=20page=20=E2=80=94=20each=20card=20of=20/settings=20?= =?UTF-8?q?was=20a=20grid=20of=20its=20own,=20its=20label=20column=20as=20?= =?UTF-8?q?wide=20as=20its=20longest=20label,=20so=20the=20controls=20bega?= =?UTF-8?q?n=20at=20a=20different=20place=20in=20every=20card,=20and=20the?= =?UTF-8?q?=20other=20instances,=20a=20grid=20inside=20their=20card,=20at?= =?UTF-8?q?=20yet=20another.=20Every=20card=20of=20settings=20now=20has=20?= =?UTF-8?q?a=20label=20column=20of=20one=20width,=2010rem,=20a=20longer=20?= =?UTF-8?q?label=20wrapping,=20and=20a=20list=20such=20as=20GrantList,=20t?= =?UTF-8?q?he=20card's=20one=20child,=20takes=20the=20card's=20rows:=20the?= =?UTF-8?q?ir=20padding,=20their=20rules,=20their=20columns.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-Authored-By: Claude Opus 5.5 --- src/App.css | 25 ++++++++++++++++++------- 1 file changed, 18 insertions(+), 7 deletions(-) diff --git a/src/App.css b/src/App.css index 30e204dd..8250a3df 100644 --- a/src/App.css +++ b/src/App.css @@ -2768,14 +2768,24 @@ body.has-player .chat-fab { max-width: none; } -/* A card of settings rules its rows apart; they keep the grid's columns, so - the labels still line up. */ -.page-card.profile-appearance-grid { - padding-block: 0; +/* A card of settings, its grid being the card or the card's one child (a list + such as GrantList), rules its rows apart; they keep the grid's columns, so + the labels still line up. Every such card's label column has one width, so + the controls line up down the page too, not only within a card; a longer + label wraps. */ +.page-card.profile-appearance-grid, +.page-card > .profile-appearance-grid { + grid-template-columns: 10rem minmax(0, 1fr); row-gap: 0; } -.page-card > .profile-appearance-row { +.page-card.profile-appearance-grid, +.page-card:has(> .profile-appearance-grid) { + padding-block: 0; +} + +.page-card > .profile-appearance-row, +.page-card > .profile-appearance-grid > .profile-appearance-row { display: grid; grid-column: 1 / -1; grid-template-columns: subgrid; @@ -2784,12 +2794,13 @@ body.has-player .chat-fab { padding-block: 0.75rem; } -.page-card > .profile-appearance-row + .profile-appearance-row { +.page-card .profile-appearance-row + .profile-appearance-row { border-top: 1px solid var(--color-border-subtle); } @media (max-width: 512px) { - .page-card > .profile-appearance-row { + .page-card > .profile-appearance-row, + .page-card > .profile-appearance-grid > .profile-appearance-row { display: flex; align-items: flex-start; }