From 580bdc43f8001fdac0eea2b2229e1d13b02eaacc Mon Sep 17 00:00:00 2001 From: kerthcet Date: Sun, 6 Sep 2026 11:38:44 +0100 Subject: [PATCH] Add background for the card Signed-off-by: kerthcet --- assets/scss/common/_custom.scss | 21 +++++++++++++++++++-- 1 file changed, 19 insertions(+), 2 deletions(-) diff --git a/assets/scss/common/_custom.scss b/assets/scss/common/_custom.scss index 2021501..9d162eb 100644 --- a/assets/scss/common/_custom.scss +++ b/assets/scss/common/_custom.scss @@ -869,10 +869,27 @@ $map-pulse-offsets: // separates the head from the list, and with a line already doing that the bold was a // second, louder way of saying it — on a 144px card that made the place name the loudest // thing in a panel that exists to show the people. Its position and the rule are enough. +// A band, not a line of text with a rule under it: the tint runs out through the card's +// own padding to both edges and takes the card's top corners, so the name reads as the +// card's header. +// +// The map's own land, lightened — the card's header is the colour of the ground it sits +// on, and the hairline under it is that same land at full strength. It was the warm tint +// the project cards are filled with for a moment, and warm is what the marks are: a peach +// strip on a card full of faces put a second accent colour a few pixels from the dots. +// Grey leaves the dots and the row highlight as the only colour in the section. +// +// The negative margins are the card's padding exactly, and the band's own padding puts it +// straight back, so the name still starts on the same vertical as the handles below it. +// Radius is the card's less its 1px border, which is the inside of the corner the band +// has to sit in. Nothing is clipped to get there — `overflow: hidden` on the card would +// have taken the caret off with it. .worldmap-city-head { - margin: 0 0 0.4375rem; - padding-bottom: 0.4375rem; + margin: -0.625rem -0.6875rem 0.4375rem; + padding: 0.5rem 0.6875rem; + background: mix($map-land, #fff, 55%); border-bottom: 1px solid $map-land; + border-radius: calc(0.75rem - 1px) calc(0.75rem - 1px) 0 0; line-height: 1.3; // A hair of tracking on the one line that is a name rather than a handle, and the only // thing here that is read as words.