Skip to content

fix(ui): theme icon color not matching hover/active foreground#78

Merged
takitsu21 merged 1 commit intotakitsu21:mainfrom
theguy000:fix/theme-icon-hover-color
Mar 14, 2026
Merged

fix(ui): theme icon color not matching hover/active foreground#78
takitsu21 merged 1 commit intotakitsu21:mainfrom
theguy000:fix/theme-icon-hover-color

Conversation

@theguy000
Copy link
Copy Markdown
Contributor

Theme icons using Catppuccin flavor colors were not updating their color on hover/active states because the color prop set an inline attribute that couldn't be overridden by CSS.

  • Switch ThemeIcon from color prop to style="color: ..."
  • Add hover:[&_svg]:!text-current to theme toggle button
  • Add [&_svg]:!text-current to active theme list item
  • Apply changes to both App.svelte and AuthPage.svelte

Before:
image

After:
image

Theme icons using Catppuccin flavor colors were not updating
their color on hover/active states because the `color` prop
set an inline attribute that couldn't be overridden by CSS.

- Switch ThemeIcon from `color` prop to `style="color: ..."`
- Add `hover:[&_svg]:!text-current` to theme toggle button
- Add `[&_svg]:!text-current` to active theme list item
- Apply changes to both App.svelte and AuthPage.svelte
@takitsu21 takitsu21 enabled auto-merge (squash) March 14, 2026 09:47
@takitsu21 takitsu21 merged commit a3176c2 into takitsu21:main Mar 14, 2026
2 checks passed
@theguy000 theguy000 deleted the fix/theme-icon-hover-color branch March 14, 2026 13:05
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants