🌙 fix: Accessible Contrast for Theme Switcher Icons (#11795)

* fix: proper colors for contrast in theme switcher icons

* fix: use themed font colors
This commit is contained in:
Dustin Healy 2026-02-14 10:39:29 -08:00 committed by Danny Avila
parent b0a32b7d6d
commit a89945c24b
No known key found for this signature in database
GPG key ID: BF31EEB2C5CA0956

View file

@ -16,7 +16,7 @@ const Theme = ({ theme, onChange }: { theme: string; onChange: (value: string) =
const themeIcons: Record<ThemeType, JSX.Element> = {
system: <Monitor aria-hidden="true" />,
dark: <Moon color="white" aria-hidden="true" />,
dark: <Moon aria-hidden="true" />,
light: <Sun aria-hidden="true" />,
};
@ -35,7 +35,7 @@ const Theme = ({ theme, onChange }: { theme: string; onChange: (value: string) =
return (
<button
className="flex items-center gap-2 rounded-lg p-2 transition-colors hover:bg-surface-hover focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-600 focus-visible:ring-offset-2 dark:focus-visible:ring-0"
className="flex items-center gap-2 rounded-lg p-2 text-text-primary transition-colors hover:bg-surface-hover focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-600 focus-visible:ring-offset-2 dark:focus-visible:ring-0"
aria-label={localize('com_ui_toggle_theme')}
aria-keyshortcuts="Ctrl+Shift+T"
onClick={(e) => {