From 663ce6e64f1bfe25982a1722f01fb7d40ca88a54 Mon Sep 17 00:00:00 2001
From: Your Name <you@example.com>
Date: Wed, 1 Apr 2026 09:52:55 +0800
Subject: [PATCH] style: add responsive layout for mobile devices

Add media query to display cards in single column on mobile screens.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 src/pages/index.tsx | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 0c571d6..1c05678 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -85,6 +85,15 @@ export default function Index() {
             />
           ))}
         </div>
+
+        {/* 移动端响应式样式 */}
+        <style jsx>{`
+          @media (max-width: 768px) {
+            div[style*="gridTemplateColumns"] {
+              gridTemplateColumns: 1fr !important;
+            }
+          }
+        `}</style>
       </div>
     </div>
   );