From 3d6aa983dc069b1421db79bbe631e179e908fec5 Mon Sep 17 00:00:00 2001
From: Willie Zutz <boarder2@bit-shift.com>
Date: Sat, 19 Jul 2025 17:41:58 -0600
Subject: [PATCH] feat(dashboard): Reflow differently. This is probably just a
 stop-gap until we get fully resizing widgets implemented.

---
 src/app/dashboard/page.tsx |  7 ++++++-
 src/components/Layout.tsx  | 11 ++++++++++-
 2 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx
index 657f059..9910292 100644
--- a/src/app/dashboard/page.tsx
+++ b/src/app/dashboard/page.tsx
@@ -224,7 +224,12 @@ const DashboardPage = () => {
         ) : widgets.length === 0 ? (
           <EmptyDashboard />
         ) : (
-          <div className="grid grid-cols-1 lg:grid-cols-2 gap-6 auto-rows-min">
+          <div
+            className="grid gap-6 auto-rows-min"
+            style={{
+              gridTemplateColumns: 'repeat(auto-fit, minmax(400px, 1fr))',
+            }}
+          >
             {widgets.map((widget) => (
               <WidgetDisplay
                 key={widget.id}
diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx
index 00f0fff..88fbd07 100644
--- a/src/components/Layout.tsx
+++ b/src/components/Layout.tsx
@@ -1,7 +1,16 @@
+'use client';
+
+import { useSelectedLayoutSegments } from 'next/navigation';
+
 const Layout = ({ children }: { children: React.ReactNode }) => {
+  const segments = useSelectedLayoutSegments();
+  const isDashboard = segments.includes('dashboard');
+
   return (
     <main className="lg:pl-20 bg-light-primary dark:bg-dark-primary min-h-screen">
-      <div className="max-w-screen-lg lg:mx-auto mx-4">{children}</div>
+      <div className={isDashboard ? "mx-4" : "max-w-screen-lg lg:mx-auto mx-4"}>
+        {children}
+      </div>
     </main>
   );
 };