Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Dark Mode: Storybook addon #2310

Merged
merged 2 commits into from
Oct 18, 2023

Conversation

julien-deramond
Copy link
Contributor

@julien-deramond julien-deramond commented Oct 13, 2023

Description

This PR adds a new dev dependency named @storybook/addon-themes which allows the addition of a theme switcher within the Storybook interface (see https://storybook.js.org/blog/introducing-theme-switcher-addon/).

Screenshot 2023-10-18 at 08 56 44

This is not directly useful for Boosted team, but could be through ZeroHeight one day.
However, it allows us to be sure that https://github.com/Orange-OpenSource/ods-storybook-theme is working correctly with Boosted components, and this, can be useful for the projects when they develop their components in isolation.

Technically it handles a switch with our data-bs-theme attribute.

Be careful, the other button in the toolbar handles the dark mode of the SB interface (so only the background behind the stories right now).

Screenshot 2023-10-18 at 08 56 37

  • Try to update ODS Storybook Theme for dark mode

Live preview

@julien-deramond julien-deramond added the color mode Temporary label to highlight color mode issues label Oct 13, 2023
@netlify
Copy link

netlify bot commented Oct 13, 2023

Deploy Preview for boosted ready!

Name Link
🔨 Latest commit 0f9723a
🔍 Latest deploy log https://app.netlify.com/sites/boosted/deploys/652f85aa4719970008c1ed83
😎 Deploy Preview https://deploy-preview-2310--boosted.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@julien-deramond julien-deramond force-pushed the main-jd-dark-mode-storybook branch from 2da1316 to cdd4828 Compare October 18, 2023 06:49
@julien-deramond julien-deramond marked this pull request as ready for review October 18, 2023 07:14
@julien-deramond julien-deramond merged commit 3cdfed2 into main-jd-dark-mode Oct 18, 2023
12 checks passed
@julien-deramond julien-deramond deleted the main-jd-dark-mode-storybook branch October 18, 2023 07:15
@julien-deramond julien-deramond mentioned this pull request Oct 18, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
color mode Temporary label to highlight color mode issues
Projects
Development

Successfully merging this pull request may close these issues.

1 participant