feat(dashboard): Reflow differently. This is probably just a stop-gap until we get fully resizing widgets implemented.

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}

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>
   );
 };