From 4a8aec83ffcabfa01b0ac35c29b5d9056476c252 Mon Sep 17 00:00:00 2001 From: Taylor Ho Date: Wed, 29 Jul 2026 22:58:23 -0700 Subject: [PATCH] fix(desktop): invert onboarding primary buttons - Give shared in-step primary actions a white background with dark labels. - Add coordinated hover colors that preserve contrast across onboarding surfaces. - Update the shared CTA documentation to describe the inverted treatment. Co-authored-by: Taylor Ho Signed-off-by: Taylor Ho --- desktop/src/features/onboarding/ui/OnboardingChrome.tsx | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/desktop/src/features/onboarding/ui/OnboardingChrome.tsx b/desktop/src/features/onboarding/ui/OnboardingChrome.tsx index d7811b0c5..8845033de 100644 --- a/desktop/src/features/onboarding/ui/OnboardingChrome.tsx +++ b/desktop/src/features/onboarding/ui/OnboardingChrome.tsx @@ -11,11 +11,10 @@ export const TOTAL_ONBOARDING_PAGES = 7; const ONBOARDING_CTA_SHAPE = "h-[2.375rem] rounded-full px-6"; /** - * Primary-CTA styling for the in-step onboarding pages: the shared pill with a - * light-blue label (`--buzz-onboarding-cta-label`, available on any - * `.buzz-onboarding-neutral-theme` subtree). + * Primary-CTA styling for the in-step onboarding pages: an inverted white pill + * with dark text that stays legible across every onboarding surface. */ -export const ONBOARDING_PRIMARY_CTA_CLASS = `${ONBOARDING_CTA_SHAPE} text-[var(--buzz-onboarding-cta-label)]`; +export const ONBOARDING_PRIMARY_CTA_CLASS = `${ONBOARDING_CTA_SHAPE} bg-white text-black/80 hover:bg-white/90 hover:text-black`; /** * Primary-CTA styling for the landing screen only: the shared pill with the