From 479fe2344dfec3f7571ae81209fefa22758afa5c Mon Sep 17 00:00:00 2001
From: Jason Schrader <whoabuddy@users.noreply.github.com>
Date: Wed, 28 Jan 2026 11:44:49 -0700
Subject: [PATCH] fix(dashboard): improve feature cards layout for 3-card grid

Switch from flex to CSS grid for better responsive behavior
now that we have three feature cards.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 .../src/components/dashboard/FeaturesSpotlight/FeatureCard.tsx  | 2 +-
 .../src/components/dashboard/FeaturesSpotlight/index.tsx        | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/dashboard/src/components/dashboard/FeaturesSpotlight/FeatureCard.tsx b/apps/dashboard/src/components/dashboard/FeaturesSpotlight/FeatureCard.tsx
index 4ed0afe..18cb190 100644
--- a/apps/dashboard/src/components/dashboard/FeaturesSpotlight/FeatureCard.tsx
+++ b/apps/dashboard/src/components/dashboard/FeaturesSpotlight/FeatureCard.tsx
@@ -56,7 +56,7 @@ export function FeatureCard({
   const baseClasses = `
     relative
     border border-border rounded-xl p-6 bg-card
-    flex flex-col min-w-[280px] flex-1
+    flex flex-col
     cursor-pointer
     transition-all duration-150
     hover:border-primary/50 hover:bg-muted/30 hover:scale-[1.02]
diff --git a/apps/dashboard/src/components/dashboard/FeaturesSpotlight/index.tsx b/apps/dashboard/src/components/dashboard/FeaturesSpotlight/index.tsx
index 553f68e..c06b592 100644
--- a/apps/dashboard/src/components/dashboard/FeaturesSpotlight/index.tsx
+++ b/apps/dashboard/src/components/dashboard/FeaturesSpotlight/index.tsx
@@ -50,7 +50,7 @@ export function FeaturesSpotlight({
   return (
     <>
       <div className="my-8">
-        <div className="flex flex-col md:flex-row gap-4">
+        <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
           {cards.map((card) => (
             <FeatureCard
               key={card.id}