From 2bb8afa51e808bbedb265523b59156391f15f4b3 Mon Sep 17 00:00:00 2001
From: behnamrhp <behnamrahimpour74@gmail.com>
Date: Sat, 23 Nov 2024 16:05:07 +0300
Subject: [PATCH] Fix dark mode storybook css problem

---
 .../button/stories/Button.stories.tsx         | 32 +++++++++----------
 src/app/globals.css                           |  2 +-
 tailwind.config.ts                            |  4 +--
 3 files changed, 18 insertions(+), 20 deletions(-)

diff --git a/src/app/components/button/stories/Button.stories.tsx b/src/app/components/button/stories/Button.stories.tsx
index ef10dd0..a786fdd 100644
--- a/src/app/components/button/stories/Button.stories.tsx
+++ b/src/app/components/button/stories/Button.stories.tsx
@@ -8,14 +8,12 @@ import createInvoiceUsecase from "@/feature/core/invoice/domain/usecase/create-i
 import type { Meta } from "@storybook/react";
 import { useRef } from "react";
 
-// More on how to set up stories at: https://storybook.js.org/docs/writing-stories#default-export
 const meta: Meta = {
   title: "general/Button",
 };
 
 export default meta;
 
-// More on writing stories with args: https://storybook.js.org/docs/writing-stories/args
 export const Primary: Story = {
   argTypes: {
     "vm.props.isDisable": {
@@ -35,18 +33,18 @@ export const Primary: Story = {
   }
 };
 
-export const WithVM: Story = {
-  decorators: [
-    (Story) => {
-      return <Story />
-    }
-  ],
-  render: () => {
-    const Child = () => {
-      const di = useDI();
-      const vm = useRef(di.resolve(CreateRandomInvoiceButtonVM));
-      return <Button vm={vm.current} memoizedByVM={false} />
-    }
-    return (<DiContext.Provider value={dashboardAppModule()}> <Child /> </ DiContext.Provider>)
-  }
-}
\ No newline at end of file
+// export const WithVM: Story = {
+//   decorators: [
+//     (Story) => {
+//       return <Story />
+//     }
+//   ],
+//   render: () => {
+//     const Child = () => {
+//       const di = useDI();
+//       const vm = useRef(di.resolve(CreateRandomInvoiceButtonVM));
+//       return <Button vm={vm.current} memoizedByVM={false} />
+//     }
+//     return (<DiContext.Provider value={dashboardAppModule()}> <Child /> </ DiContext.Provider>)
+//   }
+// }
\ No newline at end of file
diff --git a/src/app/globals.css b/src/app/globals.css
index 942f871..be56f49 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -34,7 +34,7 @@ body {
     --chart-5: 27 87% 67%;
     --radius: 0.5rem;
   }
-  .dark {
+  :root[class~="dark"] {
     --background: 240 10% 3.9%;
     --foreground: 0 0% 98%;
     --card: 240 10% 3.9%;
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 1f7474c..2229c33 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -2,8 +2,8 @@
 import type { Config } from "tailwindcss";
 
 const config: Config = {
-    darkMode: ["class"],
-    content: [
+	darkMode: ["class"],
+	content: [
     "./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
     "./src/components/**/*.{js,ts,jsx,tsx,mdx}",
     "./src/app/**/*.{js,ts,jsx,tsx,mdx}",