Skip to content

Refine the visual design#25

Merged
chizmeeple merged 7 commits intomainfrom
refine-the-visual-design
Feb 3, 2026
Merged

Refine the visual design#25
chizmeeple merged 7 commits intomainfrom
refine-the-visual-design

Conversation

@chizmeeple
Copy link
Owner

Also resolve numerous Sonarqube linter warnings

- Added DM Sans from Google Fonts
- Applied it to body text and the timer display

- Introduced CSS custom properties (:root) for colours and spacing
- Primary accent gold: #d4af37 (replacing #ffd700)
- Slightly muted accent green for buttons and highlights

- Light border (rgba(255,255,255,0.08))
- Stronger backdrop blur (12px)
- Softer box-shadow

- Gold colour variable
- Subtle inner glow on timer digits
- sans-serif fallback added for the font stack

- Background: rgba(0,0,0,0.4) with blur
- Top border and shadow to separate it from content

- Thin bottom border on the wrapper
- Border and light inset shadow on character-type tiles

- Focus states for keyboard/D-pad: :focus-visible with green ring
- Size: min 48×48px for Settings, Info, Fullscreen (TV-friendly)
- Micro-interactions: Shorter transitions (~150–200ms) and scale(0.98) on active

- Softer transitions and focus rings
- Borders for clearer hierarchy

- Matching borders and stronger box-shadows
- Extra blur on settings and What's New dialogs

- Consistent border-radius via variables (--radius-sm, --radius-md, --radius-lg)
- Shared transition variables for timing
- Unified accent colour usage across components
- CSP update: style-src and font-src now allow Google Fonts (fonts.googleapis.com and fonts.gstatic.com).
@changeset-bot
Copy link

changeset-bot bot commented Feb 3, 2026

⚠️ No Changeset found

Latest commit: c55808e

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@chizmeeple chizmeeple merged commit a851999 into main Feb 3, 2026
3 checks passed
@chizmeeple chizmeeple deleted the refine-the-visual-design branch February 3, 2026 13:50
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant