diff --git a/apps/taro/src/pages/platform-admin/platform.css b/apps/taro/src/pages/platform-admin/platform.css index eb16f400..2c3b5a64 100644 --- a/apps/taro/src/pages/platform-admin/platform.css +++ b/apps/taro/src/pages/platform-admin/platform.css @@ -68,6 +68,16 @@ padding-bottom: 6px; } +.platform-shell > .platform-actions, +.platform-shell > .platform-tabs, +.platform-section > .platform-actions:first-child { + padding: 14px; + border: 1px solid var(--tiku-border); + border-radius: 24px; + background: #fff; + box-shadow: var(--tiku-shadow); +} + .platform-button, .platform-mini-button { border: 1px solid var(--tiku-border); @@ -148,6 +158,11 @@ .platform-section { margin-top: 4px; + padding: 24px; + border: 1px solid var(--tiku-border); + border-radius: 28px; + background: rgba(255, 255, 255, 0.72); + box-shadow: 0 8px 22px rgba(15, 23, 42, 0.04); } .platform-section-title { @@ -172,6 +187,18 @@ box-shadow: 0 5px 16px rgba(15, 23, 42, 0.04); } +.platform-row:nth-child(4n + 1) { + border-color: #dbeafe; +} + +.platform-row:nth-child(4n + 2) { + border-color: #dcfce7; +} + +.platform-row:nth-child(4n + 3) { + border-color: #fae8ff; +} + .platform-module-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); @@ -270,6 +297,10 @@ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 14px; + padding: 16px; + border: 1px solid var(--tiku-border); + border-radius: 22px; + background: #f8fafc; } .platform-form.compact { @@ -296,7 +327,8 @@ display: flex; gap: 10px; margin-top: 14px; - overflow-x: auto; + flex-wrap: wrap; + overflow-x: visible; } .platform-permission-panel { @@ -369,7 +401,7 @@ @media (min-width: 980px) { .platform-page { - max-width: 1180px; + max-width: 1240px; margin: 0 auto; padding: 38px; } @@ -397,6 +429,14 @@ .platform-module-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } + + .platform-section .platform-grid { + grid-template-columns: repeat(4, minmax(0, 1fr)); + } + + .platform-permission-panel { + padding: 22px; + } } @media (max-width: 520px) { @@ -414,4 +454,23 @@ .platform-title { font-size: 34px; } + + .platform-section { + padding: 18px; + border-radius: 24px; + } + + .platform-actions, + .platform-tabs, + .platform-row-actions, + .platform-permission-header { + flex-wrap: wrap; + overflow-x: visible; + } + + .platform-button, + .platform-mini-button { + min-width: 0; + flex: 1 1 138px; + } } diff --git a/apps/taro/src/pages/student/student.css b/apps/taro/src/pages/student/student.css index f3c0ddea..4981780c 100644 --- a/apps/taro/src/pages/student/student.css +++ b/apps/taro/src/pages/student/student.css @@ -208,6 +208,11 @@ box-shadow: var(--tiku-shadow); } +.student-page > .quiet-panel:first-of-type:not(.login-card) { + border-color: #bfdbfe; + background: linear-gradient(135deg, #eff6ff 0%, #fff 72%); +} + .list-stack > .quiet-panel:first-child { border-radius: 28px; } @@ -231,6 +236,11 @@ box-shadow: var(--tiku-shadow); } +.report-panel .metric, +.quiet-panel .metric { + box-shadow: none; +} + .learning-report-panel { background: #f8fbff; } @@ -359,6 +369,18 @@ box-shadow: 0 4px 14px rgba(15, 23, 42, 0.04); } +.list-row:nth-child(3n + 1) { + border-color: #dbeafe; +} + +.list-row:nth-child(3n + 2) { + border-color: #dcfce7; +} + +.list-row:nth-child(3n) { + border-color: #fef3c7; +} + .list-row.active { border-color: var(--tiku-primary); background: var(--tiku-primary-soft); @@ -569,6 +591,12 @@ background: #0f172a; } +.student-page .toolbar + .quiet-panel, +.student-page .toolbar + .report-panel, +.student-page .section-block + .quiet-panel { + margin-top: 18px; +} + .checkout-toolbar { align-items: center; overflow-x: visible; @@ -857,6 +885,15 @@ gap: 12px; } +.student-page > .answer-sheet, +.quiet-panel + .answer-sheet { + padding: 18px; + border: 1px solid var(--tiku-border); + border-radius: 24px; + background: #fff; + box-shadow: var(--tiku-shadow); +} + .answer-card { min-width: 0; height: 58px; @@ -1055,6 +1092,11 @@ background: var(--tiku-card-soft); } +.asset-preview-panel .toolbar { + flex-wrap: wrap; + overflow-x: visible; +} + .asset-preview-iframe { width: 100%; height: 720px; @@ -1350,6 +1392,19 @@ .toolbar.wrap { gap: 14px; } + + .student-page .section-block.grid-two, + .student-page > .grid-two { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } + + .vocabulary-word-grid { + grid-template-columns: repeat(3, minmax(0, 1fr)); + } + + .asset-preview-panel { + padding: 30px; + } } @media (max-width: 420px) { @@ -1365,4 +1420,39 @@ .row-meta { font-size: 21px; } + + .student-topbar, + .amount-row, + .split-row { + flex-direction: column; + align-items: stretch; + } + + .toolbar, + .toolbar.wrap, + .checkout-toolbar, + .handbook-search-panel { + flex-wrap: wrap; + overflow-x: visible; + } + + .grid-two, + .vocabulary-word-grid, + .avatar-choice-grid { + grid-template-columns: minmax(0, 1fr); + } + + .primary-button, + .secondary-button, + .pill-button, + .danger-button { + min-width: 0; + flex: 1 1 150px; + } + + .asset-preview-frame, + .asset-preview-iframe { + min-height: 520px; + height: 520px; + } } diff --git a/apps/taro/src/pages/tenant-admin/admin.css b/apps/taro/src/pages/tenant-admin/admin.css index 7b37d8e8..e6f62c0a 100644 --- a/apps/taro/src/pages/tenant-admin/admin.css +++ b/apps/taro/src/pages/tenant-admin/admin.css @@ -73,6 +73,16 @@ overflow-x: visible; } +.admin-section > .admin-actions:first-child, +.admin-shell > .admin-actions, +.admin-shell > .admin-tabs { + padding: 14px; + border: 1px solid var(--tiku-border); + border-radius: 24px; + background: #fff; + box-shadow: var(--tiku-shadow); +} + .admin-button, .admin-mini-button { border: 1px solid var(--tiku-border); @@ -119,6 +129,11 @@ .admin-section { margin-top: 4px; + padding: 24px; + border: 1px solid var(--tiku-border); + border-radius: 28px; + background: rgba(255, 255, 255, 0.72); + box-shadow: 0 8px 22px rgba(15, 23, 42, 0.04); } .admin-section-title { @@ -206,6 +221,18 @@ box-shadow: 0 5px 16px rgba(15, 23, 42, 0.04); } +.admin-row:nth-child(4n + 1) { + border-color: #dbeafe; +} + +.admin-row:nth-child(4n + 2) { + border-color: #dcfce7; +} + +.admin-row:nth-child(4n + 3) { + border-color: #fae8ff; +} + .admin-row.active { border-color: var(--tiku-primary); background: var(--tiku-primary-soft); @@ -320,6 +347,10 @@ grid-template-columns: minmax(0, 1fr); gap: 12px; margin-top: 12px; + padding: 16px; + border: 1px solid var(--tiku-border); + border-radius: 22px; + background: #f8fafc; } .admin-textarea { @@ -335,7 +366,8 @@ display: flex; gap: 10px; margin-top: 14px; - overflow-x: auto; + flex-wrap: wrap; + overflow-x: visible; } .admin-sub-list { @@ -431,7 +463,7 @@ @media (min-width: 980px) { .admin-page { - max-width: 1180px; + max-width: 1240px; margin: 0 auto; padding: 38px; } @@ -464,6 +496,14 @@ .admin-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } + + .admin-section .admin-grid { + grid-template-columns: repeat(4, minmax(0, 1fr)); + } + + .admin-section .admin-list { + gap: 14px; + } } @media (max-width: 520px) { @@ -481,4 +521,22 @@ .admin-title { font-size: 34px; } + + .admin-section { + padding: 18px; + border-radius: 24px; + } + + .admin-actions, + .admin-tabs, + .admin-row-actions { + flex-wrap: wrap; + overflow-x: visible; + } + + .admin-button, + .admin-mini-button { + min-width: 0; + flex: 1 1 138px; + } }