Make judging look like the hacker pages, and simpler to use - #44
Open
faizm10 wants to merge 3 commits into
Open
Conversation
The judging side had drifted into its own visual language: warm grey paper, 4px corners, hard hairline rules and full-bleed banners, while the hacker portal uses blue-tinted paper, 1.75rem cards, pills and soft borders. Both render under the same brand, so the desk now speaks the same way. Restyled, not restructured — the desk keeps its own signature (departure-board hero, flip-board digits, boarding lamps, review stamp) and every layout, scroll and keyboard behaviour is untouched. - design-tokens.css: --hc-* now mirrors the hacker palette from globals.css (--bg-light paper, --brand-secondary ink, --brand-primary accent), pairs Fredoka display with Figtree body, and adds pill/card radii plus the soft blue-tinted elevation the hacker cards use. - design-system Button/Card/AppHeader: pill CTAs with hover lift, 1.75rem cards carried by a hairline border rather than a drop shadow, white header. - judging.css: hero and the delay/break/live/completion banners become inset rounded cards; chips, badges, filters and inputs become pills; progress lamps, focus rings and hovers move to the brand blue; panels enter with the hacker cards' animation and stagger. Three bugs surfaced while checking the result, all pre-existing: - The schedule drawer is portaled to <body>, outside .judging-shell, so every --j-* lookup resolved empty and the drawer rendered with no borders, no pills and the wrong font. Tokens now live on :root. - The phone schedule rows declared three grid tracks for four children, which pushed the status chip onto a second row. - The phone header carried a duplicate schedule-delay badge — already shown in the banner directly below — which squeezed the title onto three lines. Verified in the browser at 375px and 1440px, including the schedule drawer. Build, 35 tests and the lint baseline (10 pre-existing errors) all unchanged. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
The desk was showing the schedule delay three times, "up next" twice and the winner picks twice, plus a pace stepper, keyboard hints and twelve track pills — all competing with the two things a judge actually does at a table: read who they're judging, and mark it. Nothing judge-facing is gone. Winner picks, ratings and note prompts all stay; the duplicated presentations of them do not. Removed as duplication: - DeskQueue (the "Up next" cards and picks strip). Both already live in the schedule rail, which has an Up next section and a Picks filter. - The schedule-delay banner. The header badge carries it, and now shows at every width (abbreviated on phones) since it is the only indicator left. - BoardingProgress, the header lamp strip, which restated the judged count sitting immediately beside it. - The footer keyboard-hint chips. The shortcuts themselves still work. - The scorecard's "Synced to the server when online" line, which is now shown only when sync is *not* the happy path — offline still says so where you type. Tucked away rather than removed: - The schedule pace stepper retimes every judge desk and has no admin UI, so it collapses to a one-line summary in the rail and opens on click. - Visible tracks drop from 12 to 3 behind the existing "+N more". - The approximate-times caveat reads as fine print instead of a filled callout. The desk now fits one screen at 1440x1000 and 375x812 without scrolling to reach the notes field or the action buttons. Build, 35 tests and the lint baseline (10 pre-existing errors) all unchanged. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What this does
Two things, in two commits.
1. The judging pages now look like the hacker pages.
They had drifted apart — judging used grey paper, sharp 4px corners and hard grey lines, while the hacker side uses light blue paper, big rounded cards and soft borders. Judging now uses the same colours, the same fonts (Fredoka for headings, Figtree for text), the same rounded cards and the same pill-shaped buttons.
2. The judge's screen got a lot simpler.
It was showing the schedule delay three times, "up next" twice and the winner picks twice, plus keyboard hints and twelve track labels. A judge at a table really only needs to know who they're judging, how long they have, and how to mark it.
Nothing a judge uses was taken away. Winner picks, star ratings and the quick note buttons all still work — only the repeated copies of them are gone.
The whole screen now fits without scrolling, on a laptop and on a phone.
Bugs found along the way
Three things were already broken before this branch. All fixed:
One thing worth a look
The "Schedule pace" control lets any judge shift the schedule for every other judge. That felt organizer-y, so I collapsed it into a single line that opens on click. I left it on the judge page because there's no admin screen for it yet — probably worth moving to
/adminlater.Checked
🤖 Generated with Claude Code