diff --git a/clientarea/home/hgcloud_home/css/home.css b/clientarea/home/hgcloud_home/css/home.css index dee0d69..3d8f917 100644 --- a/clientarea/home/hgcloud_home/css/home.css +++ b/clientarea/home/hgcloud_home/css/home.css @@ -45,11 +45,9 @@ /* ====== ROW 1 — 用户信息 + 统计卡片(并排) ====== */ .row-1 { - display: flex !important; - flex-direction: row !important; - flex-wrap: nowrap !important; + display: grid !important; + grid-template-columns: 3fr 2fr !important; gap: 16px !important; - align-items: stretch !important; } /* 用户卡片:占 60% */ .card-user { @@ -136,11 +134,9 @@ /* ====== ROW 2 — 余额 + 侧边 ====== */ .row-2 { - display: flex !important; - flex-direction: row !important; - flex-wrap: nowrap !important; + display: grid !important; + grid-template-columns: 3fr 2fr !important; gap: 16px !important; - align-items: stretch !important; } /* 余额卡 60% */ @@ -237,11 +233,9 @@ /* ====== ROW 3 — 产品列表 + 侧栏 ====== */ .row-3 { - display: flex !important; - flex-direction: row !important; - flex-wrap: nowrap !important; + display: grid !important; + grid-template-columns: 3fr 2fr !important; gap: 16px !important; - align-items: stretch !important; } /* 产品卡 65% */ @@ -318,9 +312,7 @@ /* Responsive */ @media (max-width: 1100px) { - .row-1, .row-2, .row-3 { flex-wrap: wrap !important; } - .card-user, .card-balance, .card-products { flex: 1 1 100% !important; } - .stats-group, .card-side, .card-sidebar { flex: 1 1 100% !important; } + .row-1, .row-2, .row-3 { grid-template-columns: 1fr !important; } } @media (prefers-reduced-motion: reduce) { * { transition-duration: 0.01ms !important; }