From 3609501fea3d4146f730b6368febfa0e256ff345 Mon Sep 17 00:00:00 2001
From: adilallo <39313955+adilallo@users.noreply.github.com>
Date: Tue, 26 Aug 2025 10:45:20 -0600
Subject: [PATCH] Fix github pages storybook fonts

---
 .storybook/preview.github.js | 33 +++++++++++++++++++++++++++++++++
 1 file changed, 33 insertions(+)

diff --git a/.storybook/preview.github.js b/.storybook/preview.github.js
index 1fd25df..8b6689a 100644
--- a/.storybook/preview.github.js
+++ b/.storybook/preview.github.js
@@ -1,5 +1,29 @@
 import "../app/globals.css";
 
+// Import Google Fonts for Storybook
+import { Inter, Bricolage_Grotesque, Space_Grotesk } from "next/font/google";
+
+const inter = Inter({
+  subsets: ["latin"],
+  weight: ["400", "500", "600", "700"],
+  variable: "--font-inter",
+  display: "swap",
+});
+
+const bricolageGrotesque = Bricolage_Grotesque({
+  subsets: ["latin"],
+  weight: ["400", "500", "700", "800"],
+  variable: "--font-bricolage-grotesque",
+  display: "swap",
+});
+
+const spaceGrotesk = Space_Grotesk({
+  subsets: ["latin"],
+  weight: ["400", "500", "700"],
+  variable: "--font-space-grotesk",
+  display: "swap",
+});
+
 /** @type { import('@storybook/react').Preview } */
 const preview = {
   parameters: {
@@ -11,6 +35,15 @@ const preview = {
       },
     },
   },
+  decorators: [
+    (Story) => (
+      <div
+        className={`${inter.variable} ${bricolageGrotesque.variable} ${spaceGrotesk.variable} font-sans`}
+      >
+        <Story />
+      </div>
+    ),
+  ],
 };
 
 export default preview;