You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
794 lines
22 KiB
SCSS
794 lines
22 KiB
SCSS
/* =============================================
|
|
学校管理员主题 - 统一文字层级系统
|
|
与学生实训页 (student-training.scss) 保持一致
|
|
============================================= */
|
|
|
|
/* 全局字体变量 */
|
|
:root {
|
|
/* 字体栈：中文优先苹方/思源黑体 */
|
|
--admin-font-base: "PingFang SC", "Source Han Sans SC", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
/* 数字/数据字体：等宽对齐，成绩/金额专用 */
|
|
--admin-font-data: "PingFang SC", "SF Mono", "JetBrains Mono", "Microsoft YaHei", monospace;
|
|
|
|
/* 字号层级（对齐 Word 标准） */
|
|
--admin-fs-display: 28px;
|
|
/* 大标题 - 页面主标题 */
|
|
--admin-fs-h1: 22px;
|
|
/* 一级标题 - 面板标题 */
|
|
--admin-fs-h2: 18px;
|
|
/* 二级标题 - 区块标题 */
|
|
--admin-fs-h3: 16px;
|
|
/* 三级标题 - 表格/卡片标题 */
|
|
--admin-fs-body: 14px;
|
|
/* 正文 - 表单/描述 */
|
|
--admin-fs-body-sm: 13px;
|
|
/* 次要文字 - 表格次要 */
|
|
--admin-fs-caption: 12px;
|
|
/* 辅助文字 - 标签/徽章 */
|
|
--admin-fs-button: 14px;
|
|
/* 按钮文字 */
|
|
--admin-fs-data: 16px;
|
|
/* 数字/金额 */
|
|
|
|
/* 字重 */
|
|
--admin-fw-normal: 400;
|
|
--admin-fw-medium: 600;
|
|
--admin-fw-bold: 700;
|
|
--admin-fw-bolder: 800;
|
|
|
|
/* 行高 */
|
|
--admin-lh-tight: 1.2;
|
|
--admin-lh-normal: 1.4;
|
|
--admin-lh-relaxed: 1.6;
|
|
--admin-lh-loose: 1.8;
|
|
}
|
|
|
|
.school-admin-workbench {
|
|
min-height: calc(100vh - 84px - 40px);
|
|
padding: 24px;
|
|
box-sizing: border-box;
|
|
color: #1f2937;
|
|
}
|
|
|
|
.admin-hero {
|
|
position: relative;
|
|
overflow: hidden;
|
|
margin-bottom: 18px;
|
|
padding: 22px 24px;
|
|
border: 1px solid rgba(0, 180, 255, 0.32);
|
|
border-radius: 24px;
|
|
background: #f9fafb;
|
|
box-shadow: 0 18px 44px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.04);
|
|
backdrop-filter: blur(14px);
|
|
}
|
|
|
|
.admin-hero::after {
|
|
content: "";
|
|
position: absolute;
|
|
inset: 0;
|
|
pointer-events: none;
|
|
background:
|
|
linear-gradient(90deg, #e5e7eb, transparent 38%),
|
|
repeating-linear-gradient(90deg, rgba(125, 211, 252, 0.08) 0 1px, transparent 1px 64px);
|
|
opacity: 0.42;
|
|
}
|
|
|
|
.admin-badge {
|
|
position: relative;
|
|
z-index: 1;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
margin-bottom: 10px;
|
|
padding: 5px 14px;
|
|
border: 1px solid #2563eb;
|
|
border-radius: 999px;
|
|
color: #4b5563;
|
|
background: rgba(0, 170, 255, 0.15);
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-caption);
|
|
font-weight: var(--admin-fw-medium);
|
|
}
|
|
|
|
.admin-title {
|
|
position: relative;
|
|
z-index: 1;
|
|
margin: 0;
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-display);
|
|
line-height: var(--admin-lh-tight);
|
|
font-weight: var(--admin-fw-bolder);
|
|
letter-spacing: 0;
|
|
color: transparent;
|
|
background: linear-gradient(135deg, #ffffff, #2563eb);
|
|
-webkit-background-clip: text;
|
|
background-clip: text;
|
|
}
|
|
|
|
.admin-subtitle {
|
|
position: relative;
|
|
z-index: 1;
|
|
margin-top: 8px;
|
|
color: #6b7280;
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body);
|
|
line-height: var(--admin-lh-relaxed);
|
|
}
|
|
|
|
.admin-panel {
|
|
padding: 18px;
|
|
border: 1px solid rgba(0, 180, 255, 0.26);
|
|
border-radius: 24px;
|
|
background: #f9fafb;
|
|
box-shadow: 0 12px 34px rgba(0, 0, 0, 0.24);
|
|
backdrop-filter: blur(12px);
|
|
}
|
|
|
|
/* 面板标题 */
|
|
.admin-panel-title {
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-h2);
|
|
font-weight: var(--admin-fw-bold);
|
|
line-height: var(--admin-lh-normal);
|
|
color: #1f2937;
|
|
}
|
|
|
|
/* 面板副标题 */
|
|
.admin-panel-subtitle {
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body);
|
|
font-weight: var(--admin-fw-normal);
|
|
line-height: var(--admin-lh-relaxed);
|
|
color: #6b7280;
|
|
}
|
|
|
|
.school-admin-workbench .toolbar {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 10px;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
margin-bottom: 14px;
|
|
padding: 14px 16px;
|
|
border: 1px solid #e5e7eb;
|
|
border-radius: 18px;
|
|
background: rgba(0, 35, 55, 0.44);
|
|
}
|
|
|
|
.school-admin-workbench .toolbar-left,
|
|
.school-admin-workbench .toolbar-right {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 10px;
|
|
align-items: center;
|
|
}
|
|
|
|
.school-admin-workbench .toolbar .el-button .el-icon {
|
|
margin-right: 4px;
|
|
}
|
|
|
|
/* =============================================
|
|
工具栏按钮样式 - 差异化设计
|
|
每个按钮有独特的视觉身份和动画
|
|
============================================= */
|
|
|
|
/* 工具栏通用基础样式 */
|
|
.school-admin-workbench .toolbar .el-button {
|
|
padding: 10px 18px;
|
|
border-radius: 12px;
|
|
font-family: var(--admin-font-base);
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
/* =============================================
|
|
查询按钮 - 战术扫描风格（蓝色）
|
|
模拟雷达/扫描仪的视觉效果
|
|
============================================= */
|
|
.school-admin-workbench .toolbar .el-button[type="primary"].toolbar-btn,
|
|
.school-admin-workbench .toolbar .el-button[type="primary"] {
|
|
background: linear-gradient(135deg, #ffffff 0%, #eff6ff 50%, #dbeafe 100%);
|
|
border: 1px solid rgba(0, 170, 255, 0.5);
|
|
color: #ffffff;
|
|
box-shadow:
|
|
0 0 20px rgba(37, 99, 235, 0.2),
|
|
inset 0 0 30px #f9fafb;
|
|
}
|
|
|
|
.school-admin-workbench .toolbar .el-button[type="primary"].toolbar-btn::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
left: -100%;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: linear-gradient(90deg,
|
|
transparent 0%,
|
|
rgba(0, 200, 255, 0.3) 50%,
|
|
transparent 100%);
|
|
transition: left 0.5s ease;
|
|
}
|
|
|
|
.school-admin-workbench .toolbar .el-button[type="primary"].toolbar-btn:hover::before {
|
|
left: 100%;
|
|
}
|
|
|
|
.school-admin-workbench .toolbar .el-button[type="primary"].toolbar-btn::after {
|
|
content: '';
|
|
position: absolute;
|
|
inset: 0;
|
|
border-radius: 12px;
|
|
background: radial-gradient(circle at 30% 50%, rgba(0, 200, 255, 0.15) 0%, transparent 60%);
|
|
pointer-events: none;
|
|
}
|
|
|
|
.school-admin-workbench .toolbar .el-button[type="primary"].toolbar-btn:hover {
|
|
background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 50%, #bfdbfe 100%);
|
|
border-color: rgba(0, 200, 255, 0.7);
|
|
box-shadow:
|
|
0 0 30px rgba(0, 180, 255, 0.35),
|
|
0 0 60px rgba(37, 99, 235, 0.15),
|
|
inset 0 0 20px rgba(0, 200, 255, 0.1);
|
|
transform: translateY(-2px);
|
|
}
|
|
|
|
.school-admin-workbench .toolbar .el-button[type="primary"].toolbar-btn:hover svg {
|
|
filter: drop-shadow(0 0 6px rgba(0, 200, 255, 0.8));
|
|
animation: scanPulse 1s ease-in-out infinite;
|
|
}
|
|
|
|
@keyframes scanPulse {
|
|
0%, 100% { transform: scale(1); }
|
|
50% { transform: scale(1.15); }
|
|
}
|
|
|
|
/* =============================================
|
|
重置按钮 - 循环刷新风格（紫色）
|
|
模拟数据同步/刷新的视觉效果
|
|
============================================= */
|
|
.school-admin-workbench .toolbar .el-button:not([type="primary"]):not([type="success"]).toolbar-btn,
|
|
.school-admin-workbench .toolbar .el-button:not([type="primary"]):not([type="success"]) {
|
|
background: linear-gradient(135deg, #f9fafb 0%, #f9fafb 50%, #f9fafb 100%);
|
|
border: 1px solid rgba(150, 100, 255, 0.4);
|
|
color: #7c3aed;
|
|
backdrop-filter: blur(10px);
|
|
}
|
|
|
|
.school-admin-workbench .toolbar .el-button:not([type="primary"]):not([type="success"]).toolbar-btn::before {
|
|
content: '';
|
|
position: absolute;
|
|
inset: 0;
|
|
border-radius: 12px;
|
|
background:
|
|
linear-gradient(135deg, rgba(150, 100, 255, 0.1) 0%, transparent 50%),
|
|
linear-gradient(225deg, rgba(139, 92, 246, 0.08) 0%, transparent 50%);
|
|
pointer-events: none;
|
|
}
|
|
|
|
.school-admin-workbench .toolbar .el-button:not([type="primary"]):not([type="success"]).toolbar-btn:hover {
|
|
background: linear-gradient(135deg, #f5f3ff 0%, #f9fafb 50%, #f5f3ff 100%);
|
|
border-color: rgba(180, 130, 255, 0.6);
|
|
color: #7c3aed;
|
|
box-shadow:
|
|
0 0 20px rgba(150, 100, 255, 0.25),
|
|
0 4px 15px rgba(0, 0, 0, 0.3),
|
|
inset 0 0 15px rgba(139, 92, 246, 0.08);
|
|
transform: translateY(-2px);
|
|
}
|
|
|
|
.school-admin-workbench .toolbar .el-button:not([type="primary"]):not([type="success"]).toolbar-btn:hover svg {
|
|
animation: spinRefresh 0.8s ease-in-out;
|
|
filter: drop-shadow(0 0 6px rgba(180, 130, 255, 0.8));
|
|
}
|
|
|
|
@keyframes spinRefresh {
|
|
0% { transform: rotate(0deg) scale(1); }
|
|
50% { transform: rotate(180deg) scale(1.2); }
|
|
100% { transform: rotate(360deg) scale(1); }
|
|
}
|
|
|
|
/* =============================================
|
|
新增按钮 - 脉冲创建风格（绿色）
|
|
模拟能量聚集/爆发的视觉效果
|
|
============================================= */
|
|
.school-admin-workbench .toolbar .el-button[type="success"].toolbar-btn,
|
|
.school-admin-workbench .toolbar .el-button[type="success"] {
|
|
background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 50%, #bbf7d0 100%);
|
|
border: 1px solid rgba(0, 220, 130, 0.5);
|
|
color: #ffffff;
|
|
box-shadow:
|
|
0 0 20px rgba(43, 164, 113, 0.15),
|
|
inset 0 0 25px rgba(0, 220, 130, 0.05);
|
|
}
|
|
|
|
.school-admin-workbench .toolbar .el-button[type="success"].toolbar-btn::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
width: 0;
|
|
height: 0;
|
|
background: radial-gradient(circle, rgba(43, 164, 113, 0.4) 0%, transparent 70%);
|
|
border-radius: 50%;
|
|
transform: translate(-50%, -50%);
|
|
transition: width 0.4s ease, height 0.4s ease;
|
|
}
|
|
|
|
.school-admin-workbench .toolbar .el-button[type="success"].toolbar-btn:hover::before {
|
|
width: 200%;
|
|
height: 200%;
|
|
}
|
|
|
|
.school-admin-workbench .toolbar .el-button[type="success"].toolbar-btn::after {
|
|
content: '';
|
|
position: absolute;
|
|
inset: -2px;
|
|
border-radius: 14px;
|
|
background: linear-gradient(135deg, rgba(0, 220, 130, 0.3), transparent, rgba(43, 164, 113, 0.15));
|
|
z-index: -1;
|
|
opacity: 0;
|
|
transition: opacity 0.3s ease;
|
|
}
|
|
|
|
.school-admin-workbench .toolbar .el-button[type="success"].toolbar-btn:hover::after {
|
|
opacity: 1;
|
|
}
|
|
|
|
.school-admin-workbench .toolbar .el-button[type="success"].toolbar-btn:hover {
|
|
background: linear-gradient(135deg, #dcfce7 0%, #bbf7d0 50%, #2ba471 100%);
|
|
border-color: rgba(0, 240, 150, 0.7);
|
|
color: #ffffff;
|
|
box-shadow:
|
|
0 0 35px rgba(43, 164, 113, 0.4),
|
|
0 0 70px rgba(43, 164, 113, 0.15),
|
|
inset 0 0 25px rgba(0, 220, 130, 0.12);
|
|
transform: translateY(-2px);
|
|
}
|
|
|
|
.school-admin-workbench .toolbar .el-button[type="success"].toolbar-btn:hover svg {
|
|
animation: pulseCreate 0.6s ease-in-out infinite;
|
|
filter: drop-shadow(0 0 8px rgba(0, 240, 150, 0.9));
|
|
}
|
|
|
|
@keyframes pulseCreate {
|
|
0%, 100% { transform: scale(1) rotate(0deg); }
|
|
25% { transform: scale(1.1) rotate(-5deg); }
|
|
75% { transform: scale(1.1) rotate(5deg); }
|
|
}
|
|
|
|
/* =============================================
|
|
工具栏按钮通用样式
|
|
============================================= */
|
|
.school-admin-workbench .toolbar-btn {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
padding: 10px 18px;
|
|
border-radius: 12px;
|
|
font-family: var(--admin-font-base);
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.school-admin-workbench .toolbar-btn svg {
|
|
flex-shrink: 0;
|
|
transition: transform 0.3s ease, filter 0.3s ease;
|
|
}
|
|
|
|
.school-admin-workbench .toolbar .el-button svg {
|
|
flex-shrink: 0;
|
|
margin-right: 4px;
|
|
}
|
|
|
|
.school-admin-workbench .toolbar .el-button span {
|
|
vertical-align: middle;
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
/* 表格操作按钮样式（带图标） */
|
|
.school-admin-workbench .action-btn {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 4px;
|
|
padding: 2px 8px;
|
|
font-size: var(--admin-fs-body-sm);
|
|
color: #2563eb;
|
|
}
|
|
|
|
.school-admin-workbench .action-btn svg {
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.school-admin-workbench .action-btn.el-button--danger {
|
|
color: #ef4444;
|
|
}
|
|
|
|
/* link 按钮带图标样式 */
|
|
.school-admin-workbench .el-button--primary.is-link,
|
|
.school-admin-workbench .el-button--danger.is-link {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 4px;
|
|
}
|
|
|
|
.school-admin-workbench .el-button--primary.is-link .el-icon,
|
|
.school-admin-workbench .el-button--danger.is-link .el-icon {
|
|
margin-right: 0;
|
|
}
|
|
|
|
/* 文字按钮样式（无背景纯文字） */
|
|
.school-admin-workbench .el-button.is-text {
|
|
padding: 4px 8px;
|
|
border-radius: 4px;
|
|
border: none;
|
|
background: transparent !important;
|
|
box-shadow: none !important;
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body-sm);
|
|
font-weight: var(--admin-fw-medium);
|
|
}
|
|
|
|
.school-admin-workbench .el-button.is-text:hover {
|
|
background: #eff6ff !important;
|
|
}
|
|
|
|
.school-admin-workbench .el-button.is-text+.el-button.is-text {
|
|
margin-left: 8px;
|
|
}
|
|
|
|
/* text 按钮的文字颜色 */
|
|
.school-admin-workbench .el-button.is-text[type="primary"] {
|
|
color: #2563eb;
|
|
}
|
|
|
|
.school-admin-workbench .el-button.is-text[type="primary"]:hover {
|
|
color: #2563eb;
|
|
}
|
|
|
|
.school-admin-workbench .el-button.is-text[type="danger"] {
|
|
color: #ef4444;
|
|
}
|
|
|
|
.school-admin-workbench .el-button.is-text[type="danger"]:hover {
|
|
color: #fca5a5;
|
|
}
|
|
|
|
.school-admin-workbench .filter-input {
|
|
width: 220px;
|
|
}
|
|
|
|
.school-admin-workbench .el-input__wrapper,
|
|
.school-admin-workbench .el-select .el-input__wrapper {
|
|
background: #ffffff;
|
|
border: 1px solid #d1d5db;
|
|
box-shadow: none;
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body);
|
|
}
|
|
|
|
.school-admin-workbench .el-input__inner {
|
|
color: #1f2937;
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body);
|
|
}
|
|
|
|
.school-admin-workbench .el-input__inner::placeholder {
|
|
color: #9ca3af;
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body-sm);
|
|
}
|
|
|
|
.school-admin-workbench .el-button {
|
|
border-radius: 14px;
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-button);
|
|
font-weight: var(--admin-fw-medium);
|
|
}
|
|
|
|
.school-admin-workbench .el-button--primary,
|
|
.school-admin-workbench .el-button--success {
|
|
border-color: #2563eb;
|
|
background: linear-gradient(95deg, #2563eb, #1d4ed8);
|
|
box-shadow: 0 0 14px #e5e7eb;
|
|
}
|
|
|
|
.school-admin-workbench .el-table {
|
|
overflow: hidden;
|
|
border-radius: 18px;
|
|
border-color: #e5e7eb;
|
|
background: rgba(3, 24, 36, 0.72);
|
|
color: #374151;
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body);
|
|
--el-table-border-color: #e5e7eb;
|
|
--el-table-header-bg-color: #ffffff;
|
|
--el-table-header-text-color: #1f2937;
|
|
--el-table-row-hover-bg-color: #eff6ff;
|
|
}
|
|
|
|
.school-admin-workbench .el-table .el-table__header-wrapper th.el-table__cell,
|
|
.school-admin-workbench .el-table .el-table__fixed-header-wrapper th.el-table__cell {
|
|
background-color: #ffffff !important;
|
|
color: #1f2937 !important;
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body);
|
|
font-weight: var(--admin-fw-bold);
|
|
border-color: #e5e7eb;
|
|
}
|
|
|
|
.school-admin-workbench .el-table th.el-table__cell>.cell {
|
|
color: #1f2937;
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body);
|
|
font-weight: var(--admin-fw-bold);
|
|
}
|
|
|
|
.school-admin-workbench .el-table tr,
|
|
.school-admin-workbench .el-table td.el-table__cell {
|
|
background: rgba(3, 24, 36, 0.58);
|
|
border-color: #e5e7eb;
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body-sm);
|
|
}
|
|
|
|
.school-admin-workbench .el-table td.el-table__cell .cell {
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body-sm);
|
|
line-height: var(--admin-lh-relaxed);
|
|
}
|
|
|
|
.school-admin-workbench .el-table__body tr:hover>td.el-table__cell {
|
|
background: #eff6ff;
|
|
}
|
|
|
|
.school-admin-workbench .el-table .el-loading-mask {
|
|
background: rgba(4, 18, 29, 0.72) !important;
|
|
backdrop-filter: blur(1px);
|
|
}
|
|
|
|
.school-admin-workbench .el-table .el-loading-spinner .path {
|
|
stroke: #2563eb;
|
|
}
|
|
|
|
.school-admin-workbench .el-table .el-loading-text {
|
|
color: #374151;
|
|
}
|
|
|
|
.school-admin-workbench .pager {
|
|
margin-top: 14px;
|
|
justify-content: flex-end;
|
|
}
|
|
|
|
.school-admin-workbench .el-pagination {
|
|
--el-pagination-bg-color: transparent;
|
|
--el-pagination-button-bg-color: rgba(3, 24, 36, 0.85);
|
|
--el-pagination-hover-color: #2563eb;
|
|
color: #374151;
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body-sm);
|
|
}
|
|
|
|
.school-admin-workbench .el-pagination button,
|
|
.school-admin-workbench .el-pagination .el-pager li {
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body-sm);
|
|
}
|
|
|
|
.school-admin-workbench .el-pagination__total,
|
|
.school-admin-workbench .el-pagination__jump {
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body-sm);
|
|
color: #6b7280;
|
|
}
|
|
|
|
.school-admin-workbench .admin-form {
|
|
max-width: none;
|
|
padding: 18px;
|
|
border: 1px solid #e5e7eb;
|
|
border-radius: 22px;
|
|
background: rgba(0, 20, 35, 0.62);
|
|
}
|
|
|
|
.school-admin-workbench .el-form-item__label {
|
|
color: #4b5563;
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body);
|
|
font-weight: var(--admin-fw-medium);
|
|
line-height: var(--admin-lh-normal);
|
|
}
|
|
|
|
.school-admin-workbench .el-form-item__content {
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body);
|
|
line-height: var(--admin-lh-normal);
|
|
}
|
|
|
|
.school-admin-workbench .el-form-item__error {
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-caption);
|
|
}
|
|
|
|
.admin-edit-dialog,
|
|
.platform-admin-dialog {
|
|
border-radius: 22px;
|
|
background: #f9fafb;
|
|
border: 1px solid rgba(0, 180, 255, 0.28);
|
|
}
|
|
|
|
.admin-edit-dialog .el-dialog__title,
|
|
.admin-edit-dialog .el-form-item__label,
|
|
.platform-admin-dialog .el-dialog__title,
|
|
.platform-admin-dialog .el-form-item__label {
|
|
color: #1f2937;
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body);
|
|
font-weight: var(--admin-fw-medium);
|
|
}
|
|
|
|
.admin-edit-dialog .el-dialog__body,
|
|
.admin-edit-dialog .el-dialog__footer,
|
|
.platform-admin-dialog .el-dialog__body,
|
|
.platform-admin-dialog .el-dialog__footer {
|
|
background: transparent;
|
|
font-family: var(--admin-font-base);
|
|
}
|
|
|
|
.admin-edit-dialog,
|
|
.platform-admin-dialog {
|
|
display: flex;
|
|
max-width: calc(100vw - 32px);
|
|
max-height: calc(100vh - 48px);
|
|
flex-direction: column;
|
|
}
|
|
|
|
.admin-edit-dialog .el-dialog__body,
|
|
.platform-admin-dialog .el-dialog__body {
|
|
overflow-y: auto;
|
|
font-family: var(--admin-font-base);
|
|
/* 美化滚动条 */
|
|
scrollbar-width: thin;
|
|
scrollbar-color: rgba(37, 99, 235, 0.4) #f9fafb;
|
|
}
|
|
|
|
.admin-edit-dialog .el-dialog__body::-webkit-scrollbar,
|
|
.platform-admin-dialog .el-dialog__body::-webkit-scrollbar {
|
|
width: 6px;
|
|
height: 6px;
|
|
}
|
|
|
|
.admin-edit-dialog .el-dialog__body::-webkit-scrollbar-track,
|
|
.platform-admin-dialog .el-dialog__body::-webkit-scrollbar-track {
|
|
background: #f9fafb;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.admin-edit-dialog .el-dialog__body::-webkit-scrollbar-thumb,
|
|
.platform-admin-dialog .el-dialog__body::-webkit-scrollbar-thumb {
|
|
background: rgba(37, 99, 235, 0.4);
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.admin-edit-dialog .el-dialog__body::-webkit-scrollbar-thumb:hover,
|
|
.platform-admin-dialog .el-dialog__body::-webkit-scrollbar-thumb:hover {
|
|
background: rgba(0, 170, 255, 0.6);
|
|
}
|
|
|
|
.admin-edit-dialog .el-input__wrapper,
|
|
.admin-edit-dialog .el-select .el-input__wrapper {
|
|
background: #ffffff;
|
|
border: 1px solid #d1d5db;
|
|
box-shadow: none;
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body);
|
|
}
|
|
|
|
.admin-edit-dialog .el-input__inner {
|
|
color: #1f2937;
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body);
|
|
}
|
|
|
|
.admin-edit-dialog .el-input__inner::placeholder {
|
|
color: #9ca3af;
|
|
font-family: var(--admin-font-base);
|
|
font-size: var(--admin-fs-body-sm);
|
|
}
|
|
|
|
@media (max-width: 900px) {
|
|
.school-admin-workbench {
|
|
padding: 14px;
|
|
}
|
|
|
|
.admin-title {
|
|
font-size: calc(var(--admin-fs-display) * 0.85);
|
|
}
|
|
|
|
.school-admin-workbench .filter-input {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
/* =============================================
|
|
文字层级工具类
|
|
学校管理员页面统一使用以下类名
|
|
============================================= */
|
|
|
|
/* 大标题 - 页面主标题 */
|
|
.text-display {
|
|
font-family: var(--admin-font-base) !important;
|
|
font-size: var(--admin-fs-display) !important;
|
|
font-weight: var(--admin-fw-bolder) !important;
|
|
line-height: var(--admin-lh-tight) !important;
|
|
}
|
|
|
|
/* 一级标题 - 面板标题 */
|
|
.text-h1 {
|
|
font-family: var(--admin-font-base) !important;
|
|
font-size: var(--admin-fs-h1) !important;
|
|
font-weight: var(--admin-fw-bold) !important;
|
|
line-height: var(--admin-lh-normal) !important;
|
|
}
|
|
|
|
/* 二级标题 - 区块标题 */
|
|
.text-h2 {
|
|
font-family: var(--admin-font-base) !important;
|
|
font-size: var(--admin-fs-h2) !important;
|
|
font-weight: var(--admin-fw-bold) !important;
|
|
line-height: var(--admin-lh-normal) !important;
|
|
}
|
|
|
|
/* 三级标题 - 卡片/表格标题 */
|
|
.text-h3 {
|
|
font-family: var(--admin-font-base) !important;
|
|
font-size: var(--admin-fs-h3) !important;
|
|
font-weight: var(--admin-fw-medium) !important;
|
|
line-height: var(--admin-lh-normal) !important;
|
|
}
|
|
|
|
/* 正文 - 表单/描述 */
|
|
.text-body {
|
|
font-family: var(--admin-font-base) !important;
|
|
font-size: var(--admin-fs-body) !important;
|
|
font-weight: var(--admin-fw-normal) !important;
|
|
line-height: var(--admin-lh-relaxed) !important;
|
|
}
|
|
|
|
/* 次要文字 */
|
|
.text-body-sm {
|
|
font-family: var(--admin-font-base) !important;
|
|
font-size: var(--admin-fs-body-sm) !important;
|
|
font-weight: var(--admin-fw-normal) !important;
|
|
line-height: var(--admin-lh-relaxed) !important;
|
|
}
|
|
|
|
/* 辅助文字 - 标签/徽章 */
|
|
.text-caption {
|
|
font-family: var(--admin-font-base) !important;
|
|
font-size: var(--admin-fs-caption) !important;
|
|
font-weight: var(--admin-fw-medium) !important;
|
|
line-height: var(--admin-lh-tight) !important;
|
|
}
|
|
|
|
/* 数字/金额 - 等宽对齐 */
|
|
.text-data {
|
|
font-family: var(--admin-font-data) !important;
|
|
font-size: var(--admin-fs-data) !important;
|
|
font-weight: var(--admin-fw-bold) !important;
|
|
font-variant-numeric: tabular-nums !important;
|
|
line-height: var(--admin-lh-tight) !important;
|
|
}
|
|
|
|
/* 按钮文字 */
|
|
.text-button {
|
|
font-family: var(--admin-font-base) !important;
|
|
font-size: var(--admin-fs-button) !important;
|
|
font-weight: var(--admin-fw-medium) !important;
|
|
line-height: 1 !important;
|
|
}
|