|
|
|
|
@ -21,19 +21,23 @@
|
|
|
|
|
.student-training-shell {
|
|
|
|
|
--student-step-height: 40px;
|
|
|
|
|
--student-step-font: 13px;
|
|
|
|
|
--student-action-height: 38px;
|
|
|
|
|
--student-action-font: 15px;
|
|
|
|
|
--student-action-height: 34px;
|
|
|
|
|
--student-action-font: 13px;
|
|
|
|
|
--student-upload-height: 36px;
|
|
|
|
|
--student-upload-font: 13px;
|
|
|
|
|
--student-aux-height: 38px;
|
|
|
|
|
--student-aux-font: 13px;
|
|
|
|
|
--student-radius-sm: 6px;
|
|
|
|
|
--student-radius-pill: 999px;
|
|
|
|
|
/* 墨黑极简主题令牌 */
|
|
|
|
|
--student-accent: #1f2937;
|
|
|
|
|
--student-accent-deep: #111827;
|
|
|
|
|
--student-accent-light: #4b5563;
|
|
|
|
|
--student-accent-soft: #f3f4f6;
|
|
|
|
|
/* 教育蓝主题令牌（复刻 foundation/new-product-survey.vue） */
|
|
|
|
|
--student-accent: #2563eb;
|
|
|
|
|
--student-accent-deep: #1d4ed8;
|
|
|
|
|
--student-accent-light: #3b82f6;
|
|
|
|
|
--student-accent-soft: #eff6ff;
|
|
|
|
|
/* 语义色 */
|
|
|
|
|
--student-danger: #ef4444;
|
|
|
|
|
--student-success: #2ba471;
|
|
|
|
|
/* 结构色 */
|
|
|
|
|
--student-panel-border: #e5e7eb;
|
|
|
|
|
--student-card-bg: #ffffff;
|
|
|
|
|
--student-panel-bg: #fafbfc;
|
|
|
|
|
@ -55,9 +59,9 @@
|
|
|
|
|
--el-input-bg-color: #ffffff;
|
|
|
|
|
--el-input-text-color: #1f2937;
|
|
|
|
|
--el-input-border-color: #e5e7eb;
|
|
|
|
|
--el-input-hover-border-color: #1f2937;
|
|
|
|
|
--el-input-focus-border-color: #1f2937;
|
|
|
|
|
--el-input-focus-ring-color: rgba(31, 41, 55, 0.15);
|
|
|
|
|
--el-input-hover-border-color: #3b82f6;
|
|
|
|
|
--el-input-focus-border-color: #2563eb;
|
|
|
|
|
--el-input-focus-ring-color: rgba(59, 130, 246, 0.15);
|
|
|
|
|
--el-input-disabled-bg-color: #f3f4f6;
|
|
|
|
|
--el-input-disabled-text-color: #9ca3af;
|
|
|
|
|
--el-input-disabled-border-color: #e5e7eb;
|
|
|
|
|
@ -65,20 +69,52 @@
|
|
|
|
|
--el-textarea-bg-color: #ffffff;
|
|
|
|
|
--el-textarea-text-color: #1f2937;
|
|
|
|
|
--el-textarea-border-color: #e5e7eb;
|
|
|
|
|
--el-textarea-hover-border-color: #1f2937;
|
|
|
|
|
--el-textarea-focus-border-color: #1f2937;
|
|
|
|
|
--el-textarea-focus-ring-color: rgba(31, 41, 55, 0.15);
|
|
|
|
|
--el-textarea-hover-border-color: #3b82f6;
|
|
|
|
|
--el-textarea-focus-border-color: #2563eb;
|
|
|
|
|
--el-textarea-focus-ring-color: rgba(59, 130, 246, 0.15);
|
|
|
|
|
|
|
|
|
|
--el-select-bg-color: #ffffff;
|
|
|
|
|
--el-select-text-color: #1f2937;
|
|
|
|
|
--el-select-border-color-hover: #1f2937;
|
|
|
|
|
--el-select-border-color-hover: #3b82f6;
|
|
|
|
|
|
|
|
|
|
/* Element Plus 主色：教育蓝（复刻源页，保证 checkbox/radio/switch/分页等激活色全站一致） */
|
|
|
|
|
--el-color-primary: #2563eb;
|
|
|
|
|
--el-color-primary-light-3: #60a5fa;
|
|
|
|
|
--el-color-primary-light-5: #93c5fd;
|
|
|
|
|
--el-color-primary-light-7: #bfdbfe;
|
|
|
|
|
--el-color-primary-light-8: #dbeafe;
|
|
|
|
|
--el-color-primary-light-9: #eff6ff;
|
|
|
|
|
--el-color-primary-dark-2: #1d4ed8;
|
|
|
|
|
|
|
|
|
|
--el-fill-color-blank: #ffffff;
|
|
|
|
|
--el-border-color: #e5e7eb;
|
|
|
|
|
--el-border-color-hover: #1f2937;
|
|
|
|
|
--el-border-color-hover: #3b82f6;
|
|
|
|
|
--el-border-radius-base: 6px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/*
|
|
|
|
|
* 考试考核 / 实训报告 / BI 可视化页不在 .student-training-shell 内，
|
|
|
|
|
* 单独接管 Element Plus 主色，保证勾选框、单选、分页等激活色同为教育蓝。
|
|
|
|
|
*/
|
|
|
|
|
.student-exams,
|
|
|
|
|
.take-page,
|
|
|
|
|
.result-page,
|
|
|
|
|
.test-report,
|
|
|
|
|
.visual-analysis {
|
|
|
|
|
--el-color-primary: #2563eb;
|
|
|
|
|
--el-color-primary-light-3: #60a5fa;
|
|
|
|
|
--el-color-primary-light-5: #93c5fd;
|
|
|
|
|
--el-color-primary-light-7: #bfdbfe;
|
|
|
|
|
--el-color-primary-light-8: #dbeafe;
|
|
|
|
|
--el-color-primary-light-9: #eff6ff;
|
|
|
|
|
--el-color-primary-dark-2: #1d4ed8;
|
|
|
|
|
--el-input-hover-border-color: #3b82f6;
|
|
|
|
|
--el-input-focus-border-color: #2563eb;
|
|
|
|
|
--el-input-focus-ring-color: rgba(59, 130, 246, 0.15);
|
|
|
|
|
--el-textarea-hover-border-color: #3b82f6;
|
|
|
|
|
--el-textarea-focus-border-color: #2563eb;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/*
|
|
|
|
|
* The app-main padding around a student training page is part of the page
|
|
|
|
|
* canvas. It must blend into the training canvas instead of exposing the
|
|
|
|
|
@ -86,13 +122,18 @@
|
|
|
|
|
*/
|
|
|
|
|
#app .studentLayout .app-main:has(.student-training-shell),
|
|
|
|
|
#app .teacherLayout .app-main:has(.student-training-shell),
|
|
|
|
|
#app .studentLayout .app-main:has(.student-home) {
|
|
|
|
|
background: linear-gradient(135deg, #f5f8fc 0%, #eaf2fb 52%, #f3f8ff 100%) !important;
|
|
|
|
|
#app .studentLayout .app-main:has(.student-home),
|
|
|
|
|
#app .studentLayout .app-main:has(.student-exams),
|
|
|
|
|
#app .studentLayout .app-main:has(.take-page),
|
|
|
|
|
#app .studentLayout .app-main:has(.result-page),
|
|
|
|
|
#app .studentLayout .app-main:has(.test-report),
|
|
|
|
|
#app .studentLayout .app-main:has(.visual-analysis) {
|
|
|
|
|
background: #ffffff !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* 教师端亮色主题：实训页背景改为浅色，与学生端统一浅色风格 */
|
|
|
|
|
/* 教师端亮色主题：实训页背景改为纯白，与学生端统一 */
|
|
|
|
|
#app .teacherLayout .app-main:has(.student-training-shell) {
|
|
|
|
|
background: linear-gradient(135deg, #f5f8fc 0%, #eaf2fb 52%, #f3f8ff 100%) !important;
|
|
|
|
|
background: #ffffff !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#app .studentLayout .app-main:has(.student-training-shell) .student-training-shell,
|
|
|
|
|
@ -108,8 +149,7 @@
|
|
|
|
|
min-height: calc(100vh - 90px) !important;
|
|
|
|
|
margin: 0 !important;
|
|
|
|
|
/* padding 由架构标签 .app-main 提供（sidebar.scss 中 28px 32px 40px 24px），子页面根标签不再叠加 */
|
|
|
|
|
// padding: 10px 10px 16px !important;
|
|
|
|
|
// padding: 10px 10px 16px !important;
|
|
|
|
|
padding: 0 !important;
|
|
|
|
|
background: #ffffff !important;
|
|
|
|
|
/* 应用实训页专用字体栈 + 数字等宽对齐 */
|
|
|
|
|
font-family: var(--student-font-base) !important;
|
|
|
|
|
@ -135,26 +175,39 @@
|
|
|
|
|
*/
|
|
|
|
|
.student-training-shell > main {
|
|
|
|
|
min-width: 0 !important;
|
|
|
|
|
/* 复刻 new-product-survey：core 为透明网格层，无独立卡片盒模型 */
|
|
|
|
|
padding: 14px !important;
|
|
|
|
|
border: 0 !important;
|
|
|
|
|
border-radius: 20px !important;
|
|
|
|
|
background: transparent !important;
|
|
|
|
|
box-shadow: none !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.student-training-shell > main > .task-card,
|
|
|
|
|
.student-training-shell > main > .process-workbench,
|
|
|
|
|
.student-training-shell > main > .factors-workbench,
|
|
|
|
|
.student-training-shell > main > .workbench {
|
|
|
|
|
/* 复刻 new-product-survey .task-card：透明工作区，仅内容内缩，不画卡片 */
|
|
|
|
|
margin: 0 !important;
|
|
|
|
|
padding: 10px 12px !important;
|
|
|
|
|
border: 0 !important;
|
|
|
|
|
border-radius: 16px !important;
|
|
|
|
|
background: transparent !important;
|
|
|
|
|
box-shadow: none !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#app .studentLayout .app-main:has(.student-training-shell) .student-training-shell.product-process .process-workbench {
|
|
|
|
|
margin: 0 !important;
|
|
|
|
|
padding: 10px 12px !important;
|
|
|
|
|
border: 0 !important;
|
|
|
|
|
border-radius: 16px !important;
|
|
|
|
|
background: transparent !important;
|
|
|
|
|
box-shadow: none !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#app .studentLayout .app-main:has(.student-training-shell) .student-training-shell.product-process .process-step-card {
|
|
|
|
|
padding: 12px !important;
|
|
|
|
|
border-radius: 16px !important;
|
|
|
|
|
border-radius: 12px !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#app .studentLayout .app-main:has(.student-training-shell) .student-training-shell.product-process .task-header {
|
|
|
|
|
@ -178,15 +231,45 @@
|
|
|
|
|
.student-training-shell .step-card,
|
|
|
|
|
.student-training-shell .process-step-card,
|
|
|
|
|
.student-training-shell .factor-step-card {
|
|
|
|
|
/* 复刻 new-product-survey .step-card：白卡 12px 内边距、12px 圆角 */
|
|
|
|
|
margin: 0 !important;
|
|
|
|
|
padding: 12px !important;
|
|
|
|
|
border-radius: 16px !important;
|
|
|
|
|
padding: 12px !important;
|
|
|
|
|
border-radius: 16px !important;
|
|
|
|
|
border: 1px solid var(--student-panel-border) !important;
|
|
|
|
|
border-radius: 12px !important;
|
|
|
|
|
background: var(--student-card-bg) !important;
|
|
|
|
|
box-shadow: none !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ============================================================
|
|
|
|
|
* task-header 统一（复刻 new-product-survey：
|
|
|
|
|
* padding 18px 20px 18px 24px、12px 圆角、白卡、左侧 4px 教育蓝竖条）
|
|
|
|
|
* ============================================================ */
|
|
|
|
|
.student-training-shell .task-header {
|
|
|
|
|
margin-bottom: 12px !important;
|
|
|
|
|
margin-bottom: 12px !important;
|
|
|
|
|
position: relative !important;
|
|
|
|
|
margin: 0 0 12px !important;
|
|
|
|
|
padding: 18px 20px 18px 24px !important;
|
|
|
|
|
border: 1px solid var(--student-panel-border) !important;
|
|
|
|
|
border-radius: 12px !important;
|
|
|
|
|
background: var(--student-card-bg) !important;
|
|
|
|
|
box-shadow: none !important;
|
|
|
|
|
overflow: hidden !important;
|
|
|
|
|
|
|
|
|
|
&::before {
|
|
|
|
|
content: "" !important;
|
|
|
|
|
position: absolute !important;
|
|
|
|
|
top: 0 !important;
|
|
|
|
|
bottom: 0 !important;
|
|
|
|
|
left: 0 !important;
|
|
|
|
|
width: 4px !important;
|
|
|
|
|
background: var(--student-accent) !important;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* 步骤眉标统一教育蓝（部分页面遗留灰色） */
|
|
|
|
|
.student-training-shell .section-eyebrow {
|
|
|
|
|
color: var(--student-accent) !important;
|
|
|
|
|
font-size: var(--student-fs-caption) !important;
|
|
|
|
|
font-weight: 700 !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.student-training-shell .task-header .task-title {
|
|
|
|
|
@ -242,8 +325,8 @@
|
|
|
|
|
display: flex !important;
|
|
|
|
|
flex-wrap: nowrap !important;
|
|
|
|
|
align-items: stretch !important;
|
|
|
|
|
justify-content: flex-start !important;
|
|
|
|
|
gap: 10px !important;
|
|
|
|
|
justify-content: center !important;
|
|
|
|
|
gap: 0 !important;
|
|
|
|
|
width: 100% !important;
|
|
|
|
|
max-width: 100% !important;
|
|
|
|
|
margin: 4px 0 20px !important;
|
|
|
|
|
@ -262,22 +345,28 @@
|
|
|
|
|
display: none !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* 胶囊分段不需要连接线 */
|
|
|
|
|
.student-training-shell .step-indicator .step-connector,
|
|
|
|
|
.student-training-shell .comprehensive-step-strip .step-connector {
|
|
|
|
|
display: none !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.student-training-shell .flow-pill,
|
|
|
|
|
.student-training-shell .step-tab {
|
|
|
|
|
flex: 0 0 auto !important;
|
|
|
|
|
min-width: auto !important;
|
|
|
|
|
max-width: none !important;
|
|
|
|
|
flex: 1 1 0 !important;
|
|
|
|
|
max-width: 240px !important;
|
|
|
|
|
display: flex !important;
|
|
|
|
|
flex-direction: row !important;
|
|
|
|
|
align-items: center !important;
|
|
|
|
|
justify-content: center !important;
|
|
|
|
|
gap: 8px !important;
|
|
|
|
|
height: auto !important;
|
|
|
|
|
min-height: 42px !important;
|
|
|
|
|
min-height: 40px !important;
|
|
|
|
|
margin: 0 !important;
|
|
|
|
|
padding: 8px 14px !important;
|
|
|
|
|
border: 1px solid #e5e7eb !important;
|
|
|
|
|
border-radius: 8px !important;
|
|
|
|
|
border-right: none !important;
|
|
|
|
|
border-radius: 0 !important;
|
|
|
|
|
background: #ffffff !important;
|
|
|
|
|
box-shadow: none !important;
|
|
|
|
|
color: #6b7280 !important;
|
|
|
|
|
@ -285,11 +374,19 @@
|
|
|
|
|
font-weight: 600 !important;
|
|
|
|
|
line-height: 1.3 !important;
|
|
|
|
|
letter-spacing: 0 !important;
|
|
|
|
|
white-space: nowrap !important;
|
|
|
|
|
white-space: normal !important;
|
|
|
|
|
text-align: center !important;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
transition: background-color .16s ease, color .16s ease, border-color .16s ease !important;
|
|
|
|
|
|
|
|
|
|
&:first-child {
|
|
|
|
|
border-radius: 8px 0 0 8px !important;
|
|
|
|
|
}
|
|
|
|
|
&:last-child {
|
|
|
|
|
border-radius: 0 8px 8px 0 !important;
|
|
|
|
|
border-right: 1px solid #e5e7eb !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.step-bar { display: none !important; }
|
|
|
|
|
|
|
|
|
|
.step-no,
|
|
|
|
|
@ -318,32 +415,33 @@
|
|
|
|
|
|
|
|
|
|
.student-training-shell .flow-pill:hover:not(.active):not(.complete),
|
|
|
|
|
.student-training-shell .step-tab:hover:not(.active):not(.complete) {
|
|
|
|
|
border-color: #1f2937 !important;
|
|
|
|
|
background: #f9fafb !important;
|
|
|
|
|
color: #1f2937 !important;
|
|
|
|
|
border-color: #2563eb !important;
|
|
|
|
|
background: #eff6ff !important;
|
|
|
|
|
color: #2563eb !important;
|
|
|
|
|
z-index: 1 !important;
|
|
|
|
|
.step-no,
|
|
|
|
|
&:has(.step-no) .step-no {
|
|
|
|
|
background: #1f2937 !important;
|
|
|
|
|
background: #2563eb !important;
|
|
|
|
|
color: #ffffff !important;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.student-training-shell .flow-pill.complete:not(.active),
|
|
|
|
|
.student-training-shell .step-tab.complete:not(.active) {
|
|
|
|
|
border-color: #dce9e2 !important;
|
|
|
|
|
border-color: #e5e7eb !important;
|
|
|
|
|
color: #374151 !important;
|
|
|
|
|
.step-no,
|
|
|
|
|
&:has(.step-no) .step-no {
|
|
|
|
|
background: rgba(74,157,110,.12) !important;
|
|
|
|
|
color: #3f8a5f !important;
|
|
|
|
|
background: rgba(43, 164, 113, 0.12) !important;
|
|
|
|
|
color: #16915f !important;
|
|
|
|
|
}
|
|
|
|
|
&:hover {
|
|
|
|
|
border-color: #4a9d6e !important;
|
|
|
|
|
background: #f9fafb !important;
|
|
|
|
|
color: #374151 !important;
|
|
|
|
|
border-color: #2ba471 !important;
|
|
|
|
|
background: #f0fdf6 !important;
|
|
|
|
|
z-index: 1 !important;
|
|
|
|
|
.step-no,
|
|
|
|
|
&:has(.step-no) .step-no {
|
|
|
|
|
background: #4a9d6e !important;
|
|
|
|
|
background: #2ba471 !important;
|
|
|
|
|
color: #ffffff !important;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
@ -351,22 +449,29 @@
|
|
|
|
|
|
|
|
|
|
.student-training-shell .flow-pill.active,
|
|
|
|
|
.student-training-shell .step-tab.active {
|
|
|
|
|
border-color: #1f2937 !important;
|
|
|
|
|
background: #1f2937 !important;
|
|
|
|
|
border-color: #2563eb !important;
|
|
|
|
|
background: #2563eb !important;
|
|
|
|
|
color: #ffffff !important;
|
|
|
|
|
font-weight: 700 !important;
|
|
|
|
|
box-shadow: 0 2px 6px rgba(31,41,55,.16) !important;
|
|
|
|
|
box-shadow: none !important;
|
|
|
|
|
z-index: 2 !important;
|
|
|
|
|
.step-no,
|
|
|
|
|
&:has(.step-no) .step-no {
|
|
|
|
|
background: #ffffff !important;
|
|
|
|
|
color: #1f2937 !important;
|
|
|
|
|
color: #2563eb !important;
|
|
|
|
|
}
|
|
|
|
|
&:hover {
|
|
|
|
|
background: #111827 !important;
|
|
|
|
|
border-color: #111827 !important;
|
|
|
|
|
background: #1d4ed8 !important;
|
|
|
|
|
border-color: #1d4ed8 !important;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* 综合实训导航（GenericTrainingPage）：步骤多、可拖动，tab 固定宽，视觉沿用胶囊 */
|
|
|
|
|
.student-training-shell .comprehensive-step-strip .step-tab {
|
|
|
|
|
flex: 0 0 190px !important;
|
|
|
|
|
max-width: 190px !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* 窄屏步骤导航横向滑动 */
|
|
|
|
|
@media (max-width: 900px) {
|
|
|
|
|
.student-training-shell .step-indicator {
|
|
|
|
|
@ -376,8 +481,9 @@
|
|
|
|
|
}
|
|
|
|
|
.student-training-shell .step-tab,
|
|
|
|
|
.student-training-shell .flow-pill {
|
|
|
|
|
flex: 0 0 auto !important;
|
|
|
|
|
min-width: 140px !important;
|
|
|
|
|
flex: 0 0 140px !important;
|
|
|
|
|
min-width: 0 !important;
|
|
|
|
|
max-width: none !important;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@ -526,10 +632,10 @@
|
|
|
|
|
height: 40px !important;
|
|
|
|
|
min-height: 40px !important;
|
|
|
|
|
padding: 0 18px !important;
|
|
|
|
|
border: 1px solid #1f2937 !important;
|
|
|
|
|
border: 1px solid var(--student-accent, #1f2937) !important;
|
|
|
|
|
border-radius: 10px !important;
|
|
|
|
|
color: #ffffff !important;
|
|
|
|
|
background: #1f2937 !important;
|
|
|
|
|
background: var(--student-accent, #1f2937) !important;
|
|
|
|
|
box-shadow: 0 2px 6px rgba(31,41,55,.16) !important;
|
|
|
|
|
font-size: var(--student-fs-body) !important;
|
|
|
|
|
font-weight: 700 !important;
|
|
|
|
|
@ -538,8 +644,8 @@
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.training-step-area .el-button:hover {
|
|
|
|
|
background: #111827 !important;
|
|
|
|
|
border-color: #111827 !important;
|
|
|
|
|
background: var(--student-accent-deep, #111827) !important;
|
|
|
|
|
border-color: var(--student-accent-deep, #111827) !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.training-step-area .el-button span {
|
|
|
|
|
@ -565,16 +671,16 @@
|
|
|
|
|
justify-content: center !important;
|
|
|
|
|
min-width: 112px !important;
|
|
|
|
|
width: auto !important;
|
|
|
|
|
height: 40px !important;
|
|
|
|
|
min-height: 40px !important;
|
|
|
|
|
padding: 0 18px !important;
|
|
|
|
|
border: 1px solid #e5e7eb !important;
|
|
|
|
|
border-radius: 10px !important;
|
|
|
|
|
color: #1f2937 !important;
|
|
|
|
|
height: 34px !important;
|
|
|
|
|
min-height: 34px !important;
|
|
|
|
|
padding: 0 14px !important;
|
|
|
|
|
border: 1px solid rgba(37, 99, 235, 0.35) !important;
|
|
|
|
|
border-radius: 8px !important;
|
|
|
|
|
color: #2563eb !important;
|
|
|
|
|
background: #ffffff !important;
|
|
|
|
|
box-shadow: none !important;
|
|
|
|
|
font-size: var(--student-fs-body) !important;
|
|
|
|
|
font-weight: 700 !important;
|
|
|
|
|
font-weight: 600 !important;
|
|
|
|
|
line-height: 1 !important;
|
|
|
|
|
letter-spacing: 0 !important;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
@ -589,26 +695,26 @@
|
|
|
|
|
|
|
|
|
|
.student-training-shell .training-actions .el-button.training-action:hover:not(.is-disabled),
|
|
|
|
|
.student-training-shell .training-actions button.training-action:hover:not(:disabled) {
|
|
|
|
|
border-color: #1f2937 !important;
|
|
|
|
|
color: #1f2937 !important;
|
|
|
|
|
background: #f9fafb !important;
|
|
|
|
|
border-color: #2563eb !important;
|
|
|
|
|
color: #2563eb !important;
|
|
|
|
|
background: #eff6ff !important;
|
|
|
|
|
transform: translateY(-1px) !important;
|
|
|
|
|
box-shadow: 0 3px 10px rgba(31,41,55,.14) !important;
|
|
|
|
|
box-shadow: 0 2px 6px rgba(37, 99, 235, .12) !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.student-training-shell .training-actions .el-button.training-action.primary,
|
|
|
|
|
.student-training-shell .training-actions button.training-action.primary {
|
|
|
|
|
border: 1px solid #1f2937 !important;
|
|
|
|
|
border: 1px solid #2563eb !important;
|
|
|
|
|
color: #ffffff !important;
|
|
|
|
|
background: #1f2937 !important;
|
|
|
|
|
box-shadow: 0 2px 6px rgba(31,41,55,.16) !important;
|
|
|
|
|
background: #2563eb !important;
|
|
|
|
|
box-shadow: 0 2px 6px rgba(37, 99, 235, .2) !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.student-training-shell .training-actions .el-button.training-action.primary:hover:not(.is-disabled),
|
|
|
|
|
.student-training-shell .training-actions button.training-action.primary:hover:not(:disabled) {
|
|
|
|
|
background: #111827 !important;
|
|
|
|
|
border-color: #111827 !important;
|
|
|
|
|
box-shadow: 0 4px 12px rgba(31,41,55,.24) !important;
|
|
|
|
|
background: #1d4ed8 !important;
|
|
|
|
|
border-color: #1d4ed8 !important;
|
|
|
|
|
box-shadow: 0 4px 12px rgba(29, 78, 216, .24) !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.student-training-shell .training-actions .el-button.training-action.is-disabled,
|
|
|
|
|
@ -638,7 +744,7 @@
|
|
|
|
|
min-height: var(--student-action-height) !important;
|
|
|
|
|
padding: 0 16px !important;
|
|
|
|
|
font-size: var(--student-action-font) !important;
|
|
|
|
|
font-weight: 800 !important;
|
|
|
|
|
font-weight: 600 !important;
|
|
|
|
|
line-height: 1 !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@ -658,7 +764,7 @@
|
|
|
|
|
min-height: var(--student-action-height) !important;
|
|
|
|
|
padding: 0 16px !important;
|
|
|
|
|
font-size: var(--student-action-font) !important;
|
|
|
|
|
font-weight: 800 !important;
|
|
|
|
|
font-weight: 600 !important;
|
|
|
|
|
line-height: 1 !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@ -674,42 +780,42 @@
|
|
|
|
|
.student-training-shell .training-actions button.training-action,
|
|
|
|
|
.student-training-shell .task-actions > button,
|
|
|
|
|
.student-training-shell .taskfooter .el-button {
|
|
|
|
|
border: 1px solid rgba(31, 41, 55, 0.4) !important;
|
|
|
|
|
border-radius: 10px !important;
|
|
|
|
|
color: var(--student-text, #1f2937) !important;
|
|
|
|
|
border: 1px solid rgba(37, 99, 235, 0.35) !important;
|
|
|
|
|
border-radius: 8px !important;
|
|
|
|
|
color: #2563eb !important;
|
|
|
|
|
background: #ffffff !important;
|
|
|
|
|
font-weight: 700 !important;
|
|
|
|
|
font-weight: 600 !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.student-training-shell .training-actions .training-action--submit,
|
|
|
|
|
.student-training-shell .task-actions > .btn-submit,
|
|
|
|
|
.student-training-shell .task-actions > .btn-primary,
|
|
|
|
|
.student-training-shell .taskfooter .el-button:first-child {
|
|
|
|
|
border-color: var(--student-accent, #1f2937) !important;
|
|
|
|
|
border-color: #2563eb !important;
|
|
|
|
|
color: #ffffff !important;
|
|
|
|
|
background: var(--student-accent, #1f2937) !important;
|
|
|
|
|
box-shadow: 0 3px 10px rgba(31, 41, 55, 0.28) !important;
|
|
|
|
|
background: #2563eb !important;
|
|
|
|
|
box-shadow: 0 3px 10px rgba(37, 99, 235, 0.28) !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.student-training-shell .training-actions button.training-action:hover:not(:disabled),
|
|
|
|
|
.student-training-shell .task-actions > button:hover:not(:disabled),
|
|
|
|
|
.student-training-shell .taskfooter .el-button:hover:not(.is-disabled) {
|
|
|
|
|
border-color: var(--student-accent, #1f2937) !important;
|
|
|
|
|
background: var(--student-accent-soft, #f3f4f6) !important;
|
|
|
|
|
color: var(--student-accent, #1f2937) !important;
|
|
|
|
|
border-color: #2563eb !important;
|
|
|
|
|
background: #eff6ff !important;
|
|
|
|
|
color: #2563eb !important;
|
|
|
|
|
transform: translateY(-1px) !important;
|
|
|
|
|
box-shadow: 0 3px 10px rgba(31, 41, 55, 0.12) !important;
|
|
|
|
|
box-shadow: 0 2px 6px rgba(37, 99, 235, 0.12) !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.student-training-shell .training-actions .training-action--submit:hover:not(:disabled),
|
|
|
|
|
.student-training-shell .task-actions > .btn-primary:hover:not(:disabled),
|
|
|
|
|
.student-training-shell .task-actions > .btn-submit:hover:not(:disabled),
|
|
|
|
|
.student-training-shell .taskfooter .el-button:first-child:hover:not(.is-disabled) {
|
|
|
|
|
border-color: var(--student-accent-deep, #111827) !important;
|
|
|
|
|
background: var(--student-accent-deep, #111827) !important;
|
|
|
|
|
border-color: #1d4ed8 !important;
|
|
|
|
|
background: #1d4ed8 !important;
|
|
|
|
|
color: #ffffff !important;
|
|
|
|
|
transform: translateY(-1px) !important;
|
|
|
|
|
box-shadow: 0 5px 14px rgba(17, 24, 39, 0.32) !important;
|
|
|
|
|
box-shadow: 0 5px 14px rgba(29, 78, 216, 0.32) !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.student-training-shell .task-actions > button .el-icon {
|
|
|
|
|
@ -728,16 +834,16 @@
|
|
|
|
|
gap: 8px !important;
|
|
|
|
|
min-width: 0 !important;
|
|
|
|
|
width: auto !important;
|
|
|
|
|
height: 36px !important;
|
|
|
|
|
min-height: 36px !important;
|
|
|
|
|
height: 34px !important;
|
|
|
|
|
min-height: 34px !important;
|
|
|
|
|
padding: 0 14px !important;
|
|
|
|
|
border: 1px solid rgba(31, 41, 55, 0.4) !important;
|
|
|
|
|
border: 1px solid rgba(37, 99, 235, 0.35) !important;
|
|
|
|
|
border-radius: 8px !important;
|
|
|
|
|
color: var(--student-accent, #1f2937) !important;
|
|
|
|
|
color: #2563eb !important;
|
|
|
|
|
background: #ffffff !important;
|
|
|
|
|
box-shadow: none !important;
|
|
|
|
|
font-size: 13px !important;
|
|
|
|
|
font-weight: 700 !important;
|
|
|
|
|
font-weight: 600 !important;
|
|
|
|
|
line-height: 1 !important;
|
|
|
|
|
letter-spacing: 0 !important;
|
|
|
|
|
transition: border-color 0.16s ease, background 0.16s ease, color 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease !important;
|
|
|
|
|
@ -750,10 +856,10 @@
|
|
|
|
|
.student-training-shell button.outline-action:hover:not(:disabled),
|
|
|
|
|
.student-training-shell .workbench-actions button.material-download:hover:not(:disabled) {
|
|
|
|
|
transform: translateY(-1px) !important;
|
|
|
|
|
border-color: var(--student-accent, #1f2937) !important;
|
|
|
|
|
color: var(--student-accent, #1f2937) !important;
|
|
|
|
|
background: var(--student-accent-soft, #f3f4f6) !important;
|
|
|
|
|
box-shadow: 0 3px 10px rgba(31, 41, 55, 0.12) !important;
|
|
|
|
|
border-color: #2563eb !important;
|
|
|
|
|
color: #2563eb !important;
|
|
|
|
|
background: #eff6ff !important;
|
|
|
|
|
box-shadow: 0 2px 6px rgba(37, 99, 235, 0.12) !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/*
|
|
|
|
|
@ -790,27 +896,27 @@
|
|
|
|
|
flex: 0 0 auto !important;
|
|
|
|
|
min-width: 0 !important;
|
|
|
|
|
width: auto !important;
|
|
|
|
|
height: 36px !important;
|
|
|
|
|
min-height: 36px !important;
|
|
|
|
|
max-height: 36px !important;
|
|
|
|
|
height: 34px !important;
|
|
|
|
|
min-height: 34px !important;
|
|
|
|
|
max-height: 34px !important;
|
|
|
|
|
margin: 0 !important;
|
|
|
|
|
padding: 0 14px !important;
|
|
|
|
|
border: 1px solid #e5e7eb !important;
|
|
|
|
|
border: 1px solid rgba(37, 99, 235, 0.35) !important;
|
|
|
|
|
border-radius: 8px !important;
|
|
|
|
|
color: #1f2937 !important;
|
|
|
|
|
color: #2563eb !important;
|
|
|
|
|
background: #ffffff !important;
|
|
|
|
|
font-size: 13px !important;
|
|
|
|
|
font-weight: 700 !important;
|
|
|
|
|
font-weight: 600 !important;
|
|
|
|
|
line-height: 1 !important;
|
|
|
|
|
white-space: nowrap !important;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
transition: background-color .16s ease, border-color .16s ease, transform .16s ease, box-shadow .16s ease !important;
|
|
|
|
|
&:hover {
|
|
|
|
|
border-color: #1f2937 !important;
|
|
|
|
|
background: #f9fafb !important;
|
|
|
|
|
color: #1f2937 !important;
|
|
|
|
|
border-color: #2563eb !important;
|
|
|
|
|
background: #eff6ff !important;
|
|
|
|
|
color: #2563eb !important;
|
|
|
|
|
transform: translateY(-1px) !important;
|
|
|
|
|
box-shadow: 0 3px 10px rgba(31,41,55,.14) !important;
|
|
|
|
|
box-shadow: 0 2px 6px rgba(37, 99, 235, .12) !important;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@ -825,22 +931,22 @@
|
|
|
|
|
gap: 8px !important;
|
|
|
|
|
min-width: 0 !important;
|
|
|
|
|
width: auto !important;
|
|
|
|
|
height: 40px !important;
|
|
|
|
|
min-height: 40px !important;
|
|
|
|
|
padding: 0 18px !important;
|
|
|
|
|
border: 1px solid #1f2937 !important;
|
|
|
|
|
border-radius: 10px !important;
|
|
|
|
|
height: 34px !important;
|
|
|
|
|
min-height: 34px !important;
|
|
|
|
|
padding: 0 14px !important;
|
|
|
|
|
border: 1px solid #2563eb !important;
|
|
|
|
|
border-radius: 8px !important;
|
|
|
|
|
color: #ffffff !important;
|
|
|
|
|
background: #1f2937 !important;
|
|
|
|
|
box-shadow: 0 2px 6px rgba(31,41,55,.16) !important;
|
|
|
|
|
background: #2563eb !important;
|
|
|
|
|
box-shadow: 0 2px 6px rgba(37, 99, 235, .2) !important;
|
|
|
|
|
font-size: var(--student-upload-font) !important;
|
|
|
|
|
font-weight: 700 !important;
|
|
|
|
|
font-weight: 600 !important;
|
|
|
|
|
line-height: 1 !important;
|
|
|
|
|
letter-spacing: 0 !important;
|
|
|
|
|
white-space: nowrap !important;
|
|
|
|
|
&:hover {
|
|
|
|
|
background: #111827 !important;
|
|
|
|
|
border-color: #111827 !important;
|
|
|
|
|
background: #1d4ed8 !important;
|
|
|
|
|
border-color: #1d4ed8 !important;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@ -909,9 +1015,9 @@
|
|
|
|
|
.legacy-training-page .top_item .el-button.active,
|
|
|
|
|
.legacy-training-page .top_item .active {
|
|
|
|
|
transform: none !important;
|
|
|
|
|
border-color: #1f2937 !important;
|
|
|
|
|
border-color: var(--student-accent, #1f2937) !important;
|
|
|
|
|
color: #ffffff !important;
|
|
|
|
|
background: #1f2937 !important;
|
|
|
|
|
background: var(--student-accent, #1f2937) !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// Keep long step names inside the navigation rail. Their complete name remains
|
|
|
|
|
@ -1242,3 +1348,138 @@ body.student-light-mode {
|
|
|
|
|
&:hover, &.is-focus { border-color: #1f2937 !important; box-shadow: 0 0 0 2px rgba(31, 41, 55, 0.1) !important; }
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* ============================================================
|
|
|
|
|
* Legacy 实训页 · 教育蓝主题
|
|
|
|
|
* 适用：根元素带 .legacy-training-page 的旧版式学生实训页
|
|
|
|
|
* （demand/user、test/channel、test/marketing、assessment/index）
|
|
|
|
|
* 令牌复刻 foundation/new-product-survey.vue 的教育蓝主题。
|
|
|
|
|
* 页面内写死墨黑的全局规则（training-step-area 按钮、top_item active、
|
|
|
|
|
* training-actions 提交按钮等）均已变量化，读取此处令牌自动转蓝。
|
|
|
|
|
* ============================================================ */
|
|
|
|
|
#app .studentLayout .app-main:has(.legacy-training-page) .legacy-training-page,
|
|
|
|
|
#app .teacherLayout .app-main:has(.legacy-training-page) .legacy-training-page {
|
|
|
|
|
/* 主色：教育蓝 */
|
|
|
|
|
--student-accent: #2563eb;
|
|
|
|
|
--student-accent-deep: #1d4ed8;
|
|
|
|
|
--student-accent-light: #3b82f6;
|
|
|
|
|
--student-accent-soft: #eff6ff;
|
|
|
|
|
--student-accent-border: #bfdbfe;
|
|
|
|
|
--student-shadow-color: rgba(15, 23, 42, 0.08);
|
|
|
|
|
/* 语义色 */
|
|
|
|
|
--student-danger: #ef4444;
|
|
|
|
|
--student-success: #2ba471;
|
|
|
|
|
/* 三层次标识色 */
|
|
|
|
|
--student-layer-1: #1d4ed8;
|
|
|
|
|
--student-layer-2: #3b82f6;
|
|
|
|
|
--student-layer-3: #93c5fd;
|
|
|
|
|
/* Element Plus 主色：教育蓝 */
|
|
|
|
|
--el-color-primary: #2563eb;
|
|
|
|
|
--el-color-primary-light-3: #60a5fa;
|
|
|
|
|
--el-color-primary-light-5: #93c5fd;
|
|
|
|
|
--el-color-primary-light-7: #bfdbfe;
|
|
|
|
|
--el-color-primary-light-8: #dbeafe;
|
|
|
|
|
--el-color-primary-light-9: #eff6ff;
|
|
|
|
|
--el-color-primary-dark-2: #1d4ed8;
|
|
|
|
|
--el-input-hover-border-color: #3b82f6;
|
|
|
|
|
--el-input-focus-border-color: #2563eb;
|
|
|
|
|
--el-input-focus-ring-color: rgba(59, 130, 246, 0.15);
|
|
|
|
|
--el-textarea-hover-border-color: #3b82f6;
|
|
|
|
|
--el-textarea-focus-border-color: #2563eb;
|
|
|
|
|
/* 紧凑字号梯度：与 new-product-survey 一致（11→17px） */
|
|
|
|
|
--student-fs-display: 17px;
|
|
|
|
|
--student-fs-h1: 15px;
|
|
|
|
|
--student-fs-h2: 14px;
|
|
|
|
|
--student-fs-h3: 13px;
|
|
|
|
|
--student-fs-body: 13px;
|
|
|
|
|
--student-fs-body-sm: 12px;
|
|
|
|
|
--student-fs-caption: 11px;
|
|
|
|
|
--student-fs-button: 13px;
|
|
|
|
|
--student-fs-button-lg: 13px;
|
|
|
|
|
--student-fs-data: 14px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* legacy 页顶部工具栏按钮（TrainingTaskToolbar）：教育蓝统一，
|
|
|
|
|
覆盖组件 scoped 的暗色默认样式 */
|
|
|
|
|
#app .studentLayout .app-main:has(.legacy-training-page) .legacy-training-page .task-toolbar-button.el-button,
|
|
|
|
|
#app .teacherLayout .app-main:has(.legacy-training-page) .legacy-training-page .task-toolbar-button.el-button {
|
|
|
|
|
display: inline-flex !important;
|
|
|
|
|
align-items: center !important;
|
|
|
|
|
justify-content: center !important;
|
|
|
|
|
gap: 6px !important;
|
|
|
|
|
min-height: 34px !important;
|
|
|
|
|
height: 34px !important;
|
|
|
|
|
padding: 0 12px !important;
|
|
|
|
|
border: 1px solid rgba(37, 99, 235, 0.35) !important;
|
|
|
|
|
border-radius: 8px !important;
|
|
|
|
|
color: #2563eb !important;
|
|
|
|
|
background: #ffffff !important;
|
|
|
|
|
box-shadow: none !important;
|
|
|
|
|
text-shadow: none !important;
|
|
|
|
|
font-size: 13px !important;
|
|
|
|
|
font-weight: 600 !important;
|
|
|
|
|
transition: all 0.16s ease !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#app .studentLayout .app-main:has(.legacy-training-page) .legacy-training-page .task-toolbar-button.el-button .el-icon,
|
|
|
|
|
#app .teacherLayout .app-main:has(.legacy-training-page) .legacy-training-page .task-toolbar-button.el-button .el-icon {
|
|
|
|
|
font-size: 14px !important;
|
|
|
|
|
color: inherit !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#app .studentLayout .app-main:has(.legacy-training-page) .legacy-training-page .task-toolbar-button.el-button:hover,
|
|
|
|
|
#app .studentLayout .app-main:has(.legacy-training-page) .legacy-training-page .task-toolbar-button.el-button:focus,
|
|
|
|
|
#app .teacherLayout .app-main:has(.legacy-training-page) .legacy-training-page .task-toolbar-button.el-button:hover,
|
|
|
|
|
#app .teacherLayout .app-main:has(.legacy-training-page) .legacy-training-page .task-toolbar-button.el-button:focus {
|
|
|
|
|
border-color: #2563eb !important;
|
|
|
|
|
color: #2563eb !important;
|
|
|
|
|
background: #eff6ff !important;
|
|
|
|
|
transform: translateY(-1px) !important;
|
|
|
|
|
box-shadow: 0 2px 6px rgba(37, 99, 235, 0.12) !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#app .studentLayout .app-main:has(.legacy-training-page) .legacy-training-page .task-toolbar-button--submit.el-button,
|
|
|
|
|
#app .teacherLayout .app-main:has(.legacy-training-page) .legacy-training-page .task-toolbar-button--submit.el-button {
|
|
|
|
|
border-color: #2563eb !important;
|
|
|
|
|
color: #ffffff !important;
|
|
|
|
|
background: #2563eb !important;
|
|
|
|
|
box-shadow: 0 1px 2px rgba(37, 99, 235, 0.2), 0 2px 8px rgba(37, 99, 235, 0.15) !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#app .studentLayout .app-main:has(.legacy-training-page) .legacy-training-page .task-toolbar-button--submit.el-button:hover,
|
|
|
|
|
#app .studentLayout .app-main:has(.legacy-training-page) .legacy-training-page .task-toolbar-button--submit.el-button:focus,
|
|
|
|
|
#app .teacherLayout .app-main:has(.legacy-training-page) .legacy-training-page .task-toolbar-button--submit.el-button:hover,
|
|
|
|
|
#app .teacherLayout .app-main:has(.legacy-training-page) .legacy-training-page .task-toolbar-button--submit.el-button:focus {
|
|
|
|
|
border-color: #1d4ed8 !important;
|
|
|
|
|
color: #ffffff !important;
|
|
|
|
|
background: #1d4ed8 !important;
|
|
|
|
|
box-shadow: 0 2px 6px rgba(29, 78, 216, 0.3), 0 4px 12px rgba(29, 78, 216, 0.22) !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#app .studentLayout .app-main:has(.legacy-training-page) .legacy-training-page .training-task-toolbar .material-button.el-button,
|
|
|
|
|
#app .teacherLayout .app-main:has(.legacy-training-page) .legacy-training-page .training-task-toolbar .material-button.el-button {
|
|
|
|
|
display: inline-flex !important;
|
|
|
|
|
align-items: center !important;
|
|
|
|
|
justify-content: center !important;
|
|
|
|
|
gap: 6px !important;
|
|
|
|
|
min-height: 34px !important;
|
|
|
|
|
height: 34px !important;
|
|
|
|
|
padding: 0 12px !important;
|
|
|
|
|
border: 1px solid rgba(37, 99, 235, 0.35) !important;
|
|
|
|
|
border-radius: 8px !important;
|
|
|
|
|
color: #2563eb !important;
|
|
|
|
|
background: #ffffff !important;
|
|
|
|
|
box-shadow: none !important;
|
|
|
|
|
font-size: 13px !important;
|
|
|
|
|
font-weight: 600 !important;
|
|
|
|
|
transition: all 0.16s ease !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#app .studentLayout .app-main:has(.legacy-training-page) .legacy-training-page .training-task-toolbar .material-button.el-button:hover,
|
|
|
|
|
#app .teacherLayout .app-main:has(.legacy-training-page) .legacy-training-page .training-task-toolbar .material-button.el-button:hover {
|
|
|
|
|
border-color: #2563eb !important;
|
|
|
|
|
color: #2563eb !important;
|
|
|
|
|
background: #eff6ff !important;
|
|
|
|
|
transform: translateY(-1px) !important;
|
|
|
|
|
box-shadow: 0 2px 6px rgba(37, 99, 235, 0.12) !important;
|
|
|
|
|
}
|
|
|
|
|
|
chenyuan
2 weeks ago