Staging - #41
Merged
Merged
Conversation
Aligns the orgs create button/category filters with the forum-cerulean brand color instead of indigo, adds a cerulean-tinted thin scrollbar utility, softens the geometric background blur, and nudges spacing on the explore create-event button and map filter pills.
…anels The (app) routes had each hand-rolled their own layout primitives, so the same element looked different on every page: gutters ranged from px-[8px] to px-[40px], page headings spanned 20/25/36/40/42/48/52px, and roughly 90 buttons were raw <button> elements with bespoke height, radius and focus treatment. Orgs and the map had drifted off the palette entirely onto gray-*/indigo-*/sky-*. Introduce six shared primitives and move every (app) route onto them: - PageShell gutters (20/32/40px) + max width (narrow/content/wide/full) - PageHeading one h1 ramp, 34 -> 44 -> 52px, responsive - SectionHeading h2 with the cerulean dot - Panel content surface: radius, border, padding scale, elevation - FilterChip every filter pill - SearchInput every search field - Field label / hint / error stack Add forum variants to the shadcn Button (cerulean, solid, coral, soft, quiet) plus a cta size, so buttons stop being rebuilt per call site. Raw <button> count drops from ~90 to 25; the rest are structural (scrubber nodes, carousel dots, popover triggers) where the Button box model does not apply. Nav: the rail now collapses to icons and expands on hover. It overlays rather than pushes, and the shell reserves the expanded width so the panel never covers page content and nothing reflows on hover. Icons sit in a fixed 20px slot at the same x in both states, so labels grow beside a stationary icon. Map: drop the route's private floating nav and its separate log-out button, and render it inside the standard shell. It keeps a non-scrolling main (a map canvas must not live in a scroll container) but now shares one navigation with every other page. Fixes found along the way: - nested <button> inside <button> in the map event list (invalid HTML; the inner control was unreachable in some browsers) - missing accessible names on event-card and map icon buttons - Friends' remove control was opacity-0 until hover, invisible to keyboard users; it now reveals on focus too - hand-rolled tab bars replaced with the shadcn Tabs line variant, which brings real arrow-key navigation and aria-selected
ui: standardize page padding, headings, cards, buttons, filters and panels Tested locally and overall this looks good to me. The shared UI cleanup/standardization feels like a solid improvement and I didn’t run into any blocking functional issues. I do think there’s still some room for visual polish / closer alignment with the Figma direction on Explore, but I don’t think that needs to block this PR.
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
2 participants
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.
No description provided.