grommet-site icon indicating copy to clipboard operation
grommet-site copied to clipboard

Add control to switch between dark, light, or system default theme

Open jcfilben opened this issue 2 years ago • 2 comments

The site now displays in light/dark based on the users browsers preferences. We should have a way for them to toggle the site between light/dark or revert back to the browser preference.

jcfilben avatar Nov 02 '22 20:11 jcfilben

Hi ! I would like use this toggle button : https://design-system.hpe.design/components/button#toggle-buttons for this issue. But I'm not sure to understand, how to use it. In my mind toggle button seems like this : https://www.google.com/search?sca_esv=570620249&rlz=1C1CHBF_frFR1073FR1073&q=toggle+button&tbm=isch&source=lnms&sa=X&sqi=2&ved=2ahUKEwiM3oqzj9yBAxWjSfEDHUeOA_cQ0pQJegQIChAB&biw=1920&bih=931&dpr=1

So if someone can help me, it would be nice :)

ho823 avatar Oct 04 '23 09:10 ho823

Hi @ho823 great to hear you are interested in working on this! I think the tricky part of this issue is that we need to support 3 states (light, dark, or system default). So a toggle button might not be the best choice since it only supports 2 states. I realize the language used in the issue title and descriptions may be a bit confusing since it uses the word 'toggle'. Hopefully this clarifies the issue though and I will go back and edit the issue title and description to make this more clear.

jcfilben avatar Oct 04 '23 15:10 jcfilben