feat(webapp): dark responsive UI refresh + build version in the UI#25
Merged
Conversation
Restyle the web app dark-first while keeping the four signature colors as glowing accents, and make the layout consistent across desktop/laptop/mobile: - CSS-variable palette + dark base; card treatment (radius, neon glow, padding) - single max-width content column + breakpoints (fixes the desktop stretch and tightens phone margins); hover gated to hover-capable devices - PWA chrome: theme-color, apple-touch-icon, manifest (Add to Home Screen) - floating Scan action; capped result/QR images - vendor w3pro.css + w3-theme-orange.css locally (remove the w3schools hot-link single-point-of-failure) - scoreboard/fight results as tidy WON/LOST match cards; humanized display times (un-padded date + hour, drop :00 seconds) Surface the running build so "is the latest code live?" is answerable at a glance: CI stamps the short SHA as the APP_VERSION build-arg -> ENV VERSION in both images and the web UI shows it at the bottom of the slide-out menu. VERSION is defaulted to "dev" and removed from the env templates (a value in env_file would override the baked SHA); templates get it via a context processor. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
|
No blocking issues. |
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 & why
The web app worked but looked hand-built on desktop (every panel was
width:75%with no max-width, so rows stretched on big screens and wasted margin on phones), and there was no way to confirm which build was live. This refreshes the UI dark-first (same four signature colors — pumpkin/purple/toxic-green/magenta — kept as glowing accents), makes it consistent across desktop/laptop/mobile, and surfaces the build SHA in the UI.UI
max-widthcontent column + breakpoints (fixes the desktop stretch and tightens phone margins); hover gated to hover-capable devices so it doesn't stick on taptheme-color,apple-touch-icon,manifest.json(Add to Home Screen)w3pro.css+w3-theme-orange.csslocally — removes thewww.w3schools.comhot-link single-point-of-failure for all styling:00seconds)Build version
APP_VERSIONbuild-arg →ENV VERSIONin both images (kept as the last layer so it doesn't bust the pip/cert cache)build · <sha>); exposed to templates via a Blueprint context processorVERSIONdefaulted to"dev"and removed from the env templates — a value inenv_fileoverrides the bakedENV, so it stays out of the env files (also keeps old-image rollbacks booting)Verification
/testgreen (68 passed)docker inspect: defaultdev, and--build-arg APP_VERSION=…override flows intoENV VERSIONqa-halloween-eventsandbox, desktop + mobile: signup / feed / scan / qrcode / profile + the off-season end screenRemove the
VERSION=line from the realapi.envandapp.envin the repo dir on the Pi (gitignored, not visible from here), then redeploy. Until thenenv_fileoverrides the baked SHA and the menu keeps showing the old value (1.0).🤖 Generated with Claude Code