wuwi/splatter-tennis
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

The poster wall gets rooms, not labels: three real sections

Browse Source 
Oliver: the group headings were "sehr klein". Each group is a section now with
its posters inside it — the announcement face one size under the screen title,
a rule closing the header, and an inset band down the left. The canonical room
wears the primary's colour, because it is the one that moves your career.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
wuwiandClaude Fable 5 committed 2026-08-31 11:40:57 +02:00
1 parent 5c7521f867
commit 25c10b46d7
2 files changed
+28 -15
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

index.html
+19 -9
View File
@@ -455,15 +455,25 @@ if (location.hostname !== 'splatter-tennis.wuwi.one' && !window.Capacitor?.isNat
at cream-on-crowd was the report from the first live look */
#modeList i, #modeSub i { color: #fff; font-size: 10px; margin-bottom: 0;
text-shadow: 0 1px 0 #000, 1px 0 0 #000, -1px 0 0 #000, 0 -1px 0 #000, 0 0 7px #000; }
/* THE GROUP HEADINGS (THE SEASON): what the posters under them are FOR — one path up, a room to
practise in, a room where nothing counts. Deliberately quiet: the posters are the loud objects
on this screen, and a heading competing with them would just be a fourth poster. */
#modeList .mgroup { margin: 16px 0 7px; }
#modeList .mgroup:first-child { margin-top: 2px; }
#modeList .mgroup b { display: block; font: 400 12px Silkscreen, monospace; letter-spacing: 2px;
color: var(--acid); text-shadow: none; }
#modeList .mgroup i { display: block; margin: 3px 0 0; font: 400 9px Silkscreen, monospace;
font-style: normal; font-size: 9px; color: var(--dim); text-shadow: none; }
/* THE SECTIONS (THE SEASON): the wall is three rooms — one path up, a room to practise in, a
room where nothing counts — so each is a real section with its posters INSIDE it, not a label
floating over a stack. The heading takes the announcement face a size under the screen title,
so the hierarchy reads screen > section > poster; the rule under it closes the header and the
inset band down the left says where the section ends. */
#modeList .mgroup { margin: 0 0 22px; padding-left: 10px; border-left: 2px solid var(--line); }
/* text-align rides down from the card, which centres everything on these screens — the section
header is a header, and headers on this screen are left-aligned (the .hdr title, the posters'
own captions) */
#modeList .mgroup > header { margin: 0 0 10px; padding-bottom: 7px; text-align: left;
border-bottom: 1px solid var(--line); }
#modeList .mgroup b { display: block; font: 400 21px Bangers, cursive; letter-spacing: 1.5px;
color: var(--acid); text-shadow: none; line-height: 1.1; }
#modeList .mgroup i { display: block; margin: 2px 0 0; font: 400 9px Silkscreen, monospace;
font-style: normal; color: var(--dim); letter-spacing: 0.5px; text-shadow: none; }
/* the canonical room wears the primary's colour — the one section that moves your career */
#modeList .mgroup:first-child { border-left-color: var(--red); }
#modeList .mgroup:first-child b { color: #f0a08e; }
#modeList .mgroup button.mode:last-child { margin-bottom: 0; }
/* THE SECOND STEP (config.MENU) has its own SCREEN in the wizard: sub-mode cards are
full-height posters centred on their scene, and the difficulty chips are plain acid-outline
buttons stacked tall — art for EASY/MEDIUM/HARD would be forced, and the chip reads faster. */