Storybook Dark Mode 项目推荐

Storybook Dark Mode 项目推荐

storybook-dark-mode A storybook addon that lets your users toggle between dark and light mode. 项目地址: https://gitcode.com/gh_mirrors/st/storybook-dark-mode

项目基础介绍和主要编程语言

Storybook Dark Mode 是一个开源项目，旨在为 Storybook 提供暗黑模式和亮模式的切换功能。该项目主要使用 JavaScript 和 TypeScript 进行开发，适用于前端开发者在使用 Storybook 进行组件开发时，提供更好的用户体验。

项目核心功能

1. 暗黑模式和亮模式切换：用户可以在 Storybook 中轻松切换暗黑模式和亮模式，以适应不同的视觉偏好。
2. 自定义主题：开发者可以自定义暗黑模式和亮模式的样式，包括背景颜色、字体颜色等。
3. 初始主题设置：项目支持根据用户的系统偏好或本地存储设置初始主题。
4. 类名控制：开发者可以通过配置类名，控制 Storybook UI 在切换模式时的样式变化。
5. React 集成：项目提供了与 React 主题提供器的集成，方便开发者将暗黑模式功能与自定义主题结合使用。

项目最近更新的功能

1. 事件监听：新增了对 DARK_MODE 事件的监听功能，开发者可以通过事件监听器动态调整主题。
2. 文档模式支持：在文档模式下，开发者可以通过触发 UPDATE_DARK_MODE 事件来控制暗黑模式的切换。
3. 预览类名控制：新增了 stylePreview 选项，允许开发者在预览模式下应用暗黑模式和亮模式的类名。
4. 类目标配置：开发者可以通过 classTarget 参数配置暗黑模式和亮模式类名应用的目标元素。
5. 多类名支持：现在支持在切换模式时应用多个类名，增强了样式的灵活性。

通过这些更新，Storybook Dark Mode 项目进一步提升了其灵活性和可定制性，使得开发者能够更方便地为 Storybook 添加暗黑模式功能。

storybook-dark-mode A storybook addon that lets your users toggle between dark and light mode. 项目地址: https://gitcode.com/gh_mirrors/st/storybook-dark-mode