Skip to content

Commit 48aa6bf

Browse files
Vansh5632kart1ka
andauthored
fix: Add missing CSS variable for switch component accent color in getting-started flow (calcom#23129)
- Fix switch component thumb appearing all white when ON - Add --cal-brand-accent CSS variable definitions for light and dark modes - Ensures proper contrast: white accent on dark bg, black accent on light bg - Resolves UI issue on /getting-started/connected-calendar and /getting-started/setup-availability pages Fixes switch components using bg-brand-accent class that maps to var(--cal-brand-accent,white) When CSS variable was undefined, it defaulted to white causing invisible thumbs. Co-authored-by: Kartik Saini <41051387+kart1ka@users.noreply.github.com>
1 parent 8ed2aac commit 48aa6bf

1 file changed

Lines changed: 2 additions & 1 deletion

File tree

apps/web/modules/getting-started/[[...step]]/onboarding-view.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -138,7 +138,8 @@ const OnboardingPage = (props: PageProps) => {
138138
"dark:bg-brand dark:text-brand-contrast text-emphasis min-h-screen [--cal-brand:#111827] dark:[--cal-brand:#FFFFFF]",
139139
"[--cal-brand-emphasis:#101010] dark:[--cal-brand-emphasis:#e1e1e1]",
140140
"[--cal-brand-subtle:#9CA3AF]",
141-
"[--cal-brand-text:#FFFFFF] dark:[--cal-brand-text:#000000]"
141+
"[--cal-brand-text:#FFFFFF] dark:[--cal-brand-text:#000000]",
142+
"[--cal-brand-accent:#FFFFFF] dark:[--cal-brand-accent:#000000]"
142143
)}
143144
data-testid="onboarding"
144145
key={pathname}>

0 commit comments

Comments
 (0)