polish(booking): date/time picker sizing, brand-aware colors, dark mode#166
Open
Cookie-Cat21 wants to merge 3 commits into
Open
polish(booking): date/time picker sizing, brand-aware colors, dark mode#166Cookie-Cat21 wants to merge 3 commits into
Cookie-Cat21 wants to merge 3 commits into
Conversation
Enlarge the calendar and time-slot pills for better tap targets, flush the calendar nav/grid to its container edges, switch slot indicators to the brand green (#00D492), and simplify the loading skeleton to plain pulsing blocks (matching cal.com's minimal approach) instead of mimicking full pill anatomy. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Slot pills used hardcoded neutral slate tokens regardless of the business's accent color, so they visually clashed with branded pages (e.g. dark-accent businesses). Rest/hover states now derive from --booking-accent-muted/-soft like the rest of the booking surface. Also center the dot+time label as a group instead of left-aligning. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Dark mode always mixed the tenant accent toward pure black for --booking-accent-muted/-soft. For businesses with an already dark or near-black brand color, the result was indistinguishable from the black page background (e.g. slot pills disappearing into the canvas). Mix toward an elevated gray instead, so tinted surfaces stay visible regardless of how light or dark the chosen accent is. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Tick the box to add this pull request to the merge queue (same as
|
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.
Summary
--booking-accentinstead of hardcoded neutral slate, so they match whatever brand color each business sets--booking-accent-muted/-softalways mixed toward pure black, so businesses with an already-dark brand color (e.g. near-black) had slot pills invisible against the black canvas — now mixes toward an elevated gray insteadTest plan
npm run lint.dark [data-booking-theme]block only)Co-Authored-By: Claude Sonnet 5 noreply@anthropic.com