forked from wangziqi/gongxue-base
style: align Taro H5 with legacy question bank UI
This commit is contained in:
Codex
@@ -1,8 +1,8 @@
|
||||
.admin-page {
|
||||
min-height: 100vh;
|
||||
padding: 28px;
|
||||
background: #f8fafc;
|
||||
color: #172033;
|
||||
background: var(--tiku-page);
|
||||
color: var(--tiku-text);
|
||||
}
|
||||
|
||||
.admin-shell {
|
||||
@@ -12,30 +12,50 @@
|
||||
}
|
||||
|
||||
.admin-header {
|
||||
padding-bottom: 24px;
|
||||
border-bottom: 1px solid #dbe3ef;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
padding: 30px;
|
||||
border-radius: 30px;
|
||||
background: linear-gradient(135deg, #1152d4, #3b82f6);
|
||||
box-shadow: var(--tiku-shadow-blue);
|
||||
}
|
||||
|
||||
.admin-header::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
right: -64px;
|
||||
bottom: -84px;
|
||||
width: 240px;
|
||||
height: 240px;
|
||||
border-radius: 999px;
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
}
|
||||
|
||||
.admin-kicker,
|
||||
.admin-title,
|
||||
.admin-subtitle {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.admin-kicker {
|
||||
display: block;
|
||||
color: #64748b;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
font-size: 22px;
|
||||
font-weight: 700;
|
||||
font-weight: 850;
|
||||
}
|
||||
|
||||
.admin-title {
|
||||
display: block;
|
||||
margin-top: 8px;
|
||||
color: #111827;
|
||||
color: #fff;
|
||||
font-size: 38px;
|
||||
font-weight: 800;
|
||||
font-weight: 920;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.admin-subtitle {
|
||||
display: block;
|
||||
margin-top: 10px;
|
||||
color: #64748b;
|
||||
color: rgba(255, 255, 255, 0.82);
|
||||
font-size: 24px;
|
||||
line-height: 1.45;
|
||||
}
|
||||
@@ -53,28 +73,48 @@
|
||||
overflow-x: visible;
|
||||
}
|
||||
|
||||
.admin-button,
|
||||
.admin-mini-button {
|
||||
border: 1px solid var(--tiku-border);
|
||||
background: #fff;
|
||||
color: var(--tiku-primary);
|
||||
font-weight: 820;
|
||||
}
|
||||
|
||||
.admin-button {
|
||||
min-width: 132px;
|
||||
height: 62px;
|
||||
border: 1px solid #cbd5e1;
|
||||
border-radius: 8px;
|
||||
background: #fff;
|
||||
color: #1e3a8a;
|
||||
border-radius: 16px;
|
||||
font-size: 23px;
|
||||
font-weight: 700;
|
||||
line-height: 62px;
|
||||
}
|
||||
|
||||
.admin-button.primary {
|
||||
border-color: #2563eb;
|
||||
background: #2563eb;
|
||||
.admin-mini-button {
|
||||
min-width: 112px;
|
||||
height: 54px;
|
||||
border-radius: 14px;
|
||||
font-size: 21px;
|
||||
line-height: 54px;
|
||||
}
|
||||
|
||||
.admin-button.primary,
|
||||
.admin-mini-button.primary {
|
||||
border-color: var(--tiku-primary);
|
||||
background: linear-gradient(135deg, var(--tiku-primary), #2563eb);
|
||||
color: #fff;
|
||||
box-shadow: 0 10px 20px rgba(17, 82, 212, 0.16);
|
||||
}
|
||||
|
||||
.admin-button.active {
|
||||
border-color: #2563eb;
|
||||
background: #eff6ff;
|
||||
color: #1d4ed8;
|
||||
border-color: var(--tiku-primary);
|
||||
background: var(--tiku-primary-soft);
|
||||
color: var(--tiku-primary);
|
||||
}
|
||||
|
||||
.admin-mini-button.danger {
|
||||
border-color: #fecdd3;
|
||||
background: #fff1f2;
|
||||
color: #be123c;
|
||||
}
|
||||
|
||||
.admin-section {
|
||||
@@ -84,24 +124,27 @@
|
||||
.admin-section-title {
|
||||
display: block;
|
||||
margin-bottom: 14px;
|
||||
color: #0f172a;
|
||||
color: var(--tiku-text);
|
||||
font-size: 29px;
|
||||
font-weight: 800;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.admin-grid {
|
||||
.admin-grid,
|
||||
.admin-metric-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 14px;
|
||||
}
|
||||
|
||||
.admin-grid.three {
|
||||
.admin-grid {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.admin-grid.three,
|
||||
.admin-metric-grid {
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.admin-metric-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 12px;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
@@ -113,10 +156,11 @@
|
||||
|
||||
.admin-metric {
|
||||
min-height: 112px;
|
||||
padding: 18px;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 8px;
|
||||
padding: 20px;
|
||||
border: 1px solid var(--tiku-border);
|
||||
border-radius: 24px;
|
||||
background: #fff;
|
||||
box-shadow: var(--tiku-shadow);
|
||||
}
|
||||
|
||||
.admin-metric.theme-template {
|
||||
@@ -124,22 +168,27 @@
|
||||
}
|
||||
|
||||
.admin-metric.theme-template.selected {
|
||||
border-color: #2563eb;
|
||||
border-color: var(--tiku-primary);
|
||||
box-shadow: 0 0 0 2px #bfdbfe;
|
||||
}
|
||||
|
||||
.admin-metric-label {
|
||||
.admin-metric-label,
|
||||
.admin-row-meta,
|
||||
.admin-field-label {
|
||||
display: block;
|
||||
color: #64748b;
|
||||
color: var(--tiku-muted);
|
||||
}
|
||||
|
||||
.admin-metric-label {
|
||||
font-size: 21px;
|
||||
}
|
||||
|
||||
.admin-metric-value {
|
||||
display: block;
|
||||
margin-top: 12px;
|
||||
color: #0f172a;
|
||||
color: var(--tiku-text);
|
||||
font-size: 31px;
|
||||
font-weight: 800;
|
||||
font-weight: 900;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
@@ -151,50 +200,53 @@
|
||||
|
||||
.admin-row {
|
||||
padding: 20px;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 8px;
|
||||
border: 1px solid var(--tiku-border);
|
||||
border-radius: 22px;
|
||||
background: #fff;
|
||||
box-shadow: 0 5px 16px rgba(15, 23, 42, 0.04);
|
||||
}
|
||||
|
||||
.admin-row.active {
|
||||
border-color: #93c5fd;
|
||||
background: #eff6ff;
|
||||
border-color: var(--tiku-primary);
|
||||
background: var(--tiku-primary-soft);
|
||||
}
|
||||
|
||||
.admin-row-main {
|
||||
display: block;
|
||||
color: #111827;
|
||||
color: var(--tiku-text);
|
||||
font-size: 26px;
|
||||
font-weight: 760;
|
||||
font-weight: 820;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
.admin-row-meta {
|
||||
display: block;
|
||||
margin-top: 8px;
|
||||
color: #64748b;
|
||||
font-size: 21px;
|
||||
line-height: 1.45;
|
||||
}
|
||||
|
||||
.admin-empty {
|
||||
padding: 32px 22px;
|
||||
border: 1px dashed #cbd5e1;
|
||||
border-radius: 8px;
|
||||
border: 1px dashed var(--tiku-border-strong);
|
||||
border-radius: 22px;
|
||||
background: #fff;
|
||||
color: #64748b;
|
||||
color: var(--tiku-muted);
|
||||
font-size: 23px;
|
||||
line-height: 1.45;
|
||||
}
|
||||
|
||||
.admin-input {
|
||||
.admin-input,
|
||||
.admin-textarea {
|
||||
width: 100%;
|
||||
border: 1px solid var(--tiku-border);
|
||||
background: #fff;
|
||||
color: var(--tiku-text);
|
||||
}
|
||||
|
||||
.admin-input {
|
||||
height: 66px;
|
||||
padding: 0 18px;
|
||||
border: 1px solid #cbd5e1;
|
||||
border-radius: 8px;
|
||||
background: #fff;
|
||||
color: #111827;
|
||||
border-radius: 16px;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
@@ -212,14 +264,10 @@
|
||||
}
|
||||
|
||||
.admin-textarea {
|
||||
width: 100%;
|
||||
min-height: 220px;
|
||||
margin-top: 12px;
|
||||
padding: 18px;
|
||||
border: 1px solid #cbd5e1;
|
||||
border-radius: 8px;
|
||||
background: #fff;
|
||||
color: #111827;
|
||||
border-radius: 18px;
|
||||
font-size: 23px;
|
||||
line-height: 1.45;
|
||||
}
|
||||
@@ -231,44 +279,20 @@
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.admin-mini-button {
|
||||
min-width: 112px;
|
||||
height: 54px;
|
||||
border: 1px solid #cbd5e1;
|
||||
border-radius: 8px;
|
||||
background: #fff;
|
||||
color: #1e3a8a;
|
||||
font-size: 21px;
|
||||
font-weight: 700;
|
||||
line-height: 54px;
|
||||
}
|
||||
|
||||
.admin-mini-button.primary {
|
||||
border-color: #2563eb;
|
||||
background: #2563eb;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.admin-mini-button.danger {
|
||||
border-color: #dc2626;
|
||||
background: #fef2f2;
|
||||
color: #b91c1c;
|
||||
}
|
||||
|
||||
.admin-sub-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
margin-top: 12px;
|
||||
padding: 12px;
|
||||
border-radius: 8px;
|
||||
border-radius: 18px;
|
||||
background: #f8fafc;
|
||||
}
|
||||
|
||||
.admin-sub-row {
|
||||
padding: 10px 12px;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 8px;
|
||||
border: 1px solid var(--tiku-border);
|
||||
border-radius: 16px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
@@ -288,15 +312,15 @@
|
||||
.theme-swatch {
|
||||
width: 54px;
|
||||
height: 54px;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 8px;
|
||||
border: 1px solid var(--tiku-border);
|
||||
border-radius: 14px;
|
||||
}
|
||||
|
||||
.theme-preview-panel {
|
||||
margin-top: 14px;
|
||||
overflow: hidden;
|
||||
border: 1px solid #dbe3ef;
|
||||
border-radius: 8px;
|
||||
border: 1px solid var(--tiku-border);
|
||||
border-radius: 22px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
@@ -309,7 +333,7 @@
|
||||
display: block;
|
||||
color: #fff;
|
||||
font-size: 30px;
|
||||
font-weight: 800;
|
||||
font-weight: 850;
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
@@ -330,7 +354,7 @@
|
||||
.theme-preview-pill {
|
||||
width: 88px;
|
||||
height: 34px;
|
||||
border-radius: 8px;
|
||||
border-radius: 999px;
|
||||
}
|
||||
|
||||
.break-line {
|
||||
|
||||
Reference in New Issue
Block a user