meta: storybook supports tailwind + theme

tloncorp · Jun 9, 2023 · cd2aac4 · cd2aac4
1 parent 96a5955
commit cd2aac4
Show file tree

Hide file tree

Showing 5 changed files with 1,945 additions and 0 deletions.
diff --git a/ui/.storybook/main.ts b/ui/.storybook/main.ts
@@ -5,6 +5,7 @@ const config: StorybookConfig = {
     '@storybook/addon-links',
     '@storybook/addon-essentials',
     '@storybook/addon-interactions',
+    '@storybook/addon-styling'
   ],
   framework: {
     name: '@storybook/react-vite',

diff --git a/ui/.storybook/preview.ts b/ui/.storybook/preview.ts
@@ -1,3 +1,5 @@
+import { withThemeByClassName } from "@storybook/addon-styling";
+import "../src/styles/index.css";
 import type { Preview } from '@storybook/react';
 
 const preview: Preview = {
@@ -12,4 +14,14 @@ const preview: Preview = {
   },
 };
 
+export const decorators = [
+  withThemeByClassName({
+    themes: {
+      light: "",
+      dark: "dark",
+    },
+    defaultTheme: "light",
+  }),
+];
+
 export default preview;