Apply glassmorphism design system across all UI surfaces #23

Merged
nitrix merged 11 commits from glassmorphism-event-cards into master 2026-03-09 19:11:53 +01:00
11 Commits
Author SHA1 Message Date
nitrixandClaude Opus 4.6 32f96e4c6f Replace hardcoded color values with glass design tokens
CI / backend-test (push) Successful in 1m0s
CI / frontend-test (push) Successful in 25s
CI / frontend-e2e (push) Successful in 1m13s
CI / build-and-publish (push) Has been skipped
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-09 19:07:43 +01:00
nitrixandClaude Opus 4.6 e6c4a21f65 Apply glassmorphism to ConfirmDialog overlay and surface
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-09 19:00:39 +01:00
nitrixandClaude Opus 4.6 831ffc071a Apply glassmorphism to BottomSheet and RSVP bar status
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-09 18:57:30 +01:00
nitrixandClaude Opus 4.6 5dd7cb3fb8 Add animated glow border to RSVP CTA button
Wrap the "I'm attending" button with animated glow-border and
glass-inner styling. Update test selectors for new structure.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-09 18:51:21 +01:00
nitrixandClaude Opus 4.6 64816558c1 Apply glass utility class to form fields and buttons
Use .glass class on form fields and buttons on gradient backgrounds.
Buttons get gradient glow border via background-clip trick. Solid
white fallback preserved for BottomSheet context.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-09 18:47:57 +01:00
nitrixandClaude Opus 4.6 019ead7be3 Extract glass system into shared CSS utilities and design tokens
Centralize all hardcoded rgba color values into CSS custom properties
and extract glass/glow styles into reusable utility classes (.glass,
.glass-inner, .glow-border, .glow-border--animated) in main.css.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-09 18:35:36 +01:00
nitrixandClaude Opus 4.6 29974704d0 Apply glassmorphism to meta icon boxes on event detail view
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-09 18:22:39 +01:00
nitrixandClaude Opus 4.6 877c869a22 Restyle FAB with glass effect and static glow border
Replace solid orange FAB with glassmorphism inner and a conic
gradient border (pink-purple-indigo) with subtle glow halo.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-09 18:20:50 +01:00
nitrixandClaude Opus 4.6 a9743025a7 Fix hero image transition on event detail page
Replace hard-edged color overlay with CSS mask-image fade-out and
increase hero height to 420px for a seamless blend into the aurora
mesh background.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-09 18:13:57 +01:00
nitrixandClaude Opus 4.6 9f82275c63 Replace linear gradient background with aurora mesh gradient
Use layered radial gradients on a dark base (#1B1730) with
backdrop blur for an organic, aurora-like background effect
that better complements the glassmorphism event cards.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-09 18:01:46 +01:00
nitrixandClaude Opus 4.6 e203ecf687 Apply glassmorphism styling to event cards on list view
Replace solid white event cards with glass-effect cards featuring
backdrop blur, semi-transparent gradient backgrounds, and light
borders that blend with the Electric Dusk gradient background.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-09 17:50:20 +01:00