tailwind-nextjs-starter-blog-i18n icon indicating copy to clipboard operation
tailwind-nextjs-starter-blog-i18n copied to clipboard

fix: Visual Bug Fixes for Theme Selection

Open MarlonPassos-git opened this issue 1 year ago • 3 comments

Problem

There were several visual bugs when no theme was selected:

  • If nothing was selected and the user's system was set to dark theme, a visual bug caused the page to start with a light theme.
  • On initial loading from the server, the theme switch button did not have a pre-reserved space, causing a layout shift.
  • The initial color of the button in the dark theme made the button invisible.

Video before corrections

After Corrections

Video after Corrections

MarlonPassos-git avatar Jul 28 '24 15:07 MarlonPassos-git

@MarlonPassos-git is attempting to deploy a commit to the sylartist's projects Team on Vercel.

A member of the Team first needs to authorize it.

vercel[bot] avatar Jul 28 '24 15:07 vercel[bot]

Hi! The problem is that I need the custom ThemeContext for managing theme with the icons, but also within the kbar menu. Tried before with the hook from next, but it was'nt working and bugs were even worse than now. So if you have another solution, why not, but for now I won't replace my custom implementation, unless your solution works for both kbar (settings) and icons . But thank you for all your improvements and suggestions!

PxlSyl avatar Jul 29 '24 13:07 PxlSyl

ok, i'll take a look tonight

MarlonPassos-git avatar Jul 29 '24 14:07 MarlonPassos-git