From 4195b8a6e785dd15b01211f0bb6f906ac43a3fb0 Mon Sep 17 00:00:00 2001
From: Your Name <you@example.com>
Date: Wed, 1 Apr 2026 09:53:40 +0800
Subject: [PATCH] fix: use standard style tag for responsive layout

Replace styled-jsx with standard style tag to avoid TypeScript errors.

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

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 1c05678..4236a60 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -67,13 +67,16 @@ export default function Index() {
         </div>
 
         {/* 快捷操作卡片区域 */}
-        <div style={{
-          display: 'grid',
-          gridTemplateColumns: 'repeat(auto-fit, minmax(280px, 1fr))',
-          gap: 24,
-          maxWidth: 900,
-          margin: '0 auto',
-        }}>
+        <div
+          className="quick-actions-grid"
+          style={{
+            display: 'grid',
+            gridTemplateColumns: 'repeat(auto-fit, minmax(280px, 1fr))',
+            gap: 24,
+            maxWidth: 900,
+            margin: '0 auto',
+          }}
+        >
           {quickActions.map((action) => (
             <QuickActionCard
               key={action.path}
@@ -87,10 +90,10 @@ export default function Index() {
         </div>
 
         {/* 移动端响应式样式 */}
-        <style jsx>{`
+        <style>{`
           @media (max-width: 768px) {
-            div[style*="gridTemplateColumns"] {
-              gridTemplateColumns: 1fr !important;
+            .quick-actions-grid {
+              grid-template-columns: 1fr !important;
             }
           }
         `}</style>