style: 全局 UI 主题皮肤重构与样式模块化
引入 Element Plus 主题定制和主题皮肤 composable,将全局 样式拆分为组件级独立 CSS 文件(侧边栏、顶栏、工作台等), 统一色彩变量和间距规范,重构所有视图和组件样式以适配新 主题系统,优化图表和知识图谱组件视觉表现,提取审计和差 旅报销相关子组件。
This commit is contained in:
@@ -56,8 +56,8 @@
|
||||
}
|
||||
|
||||
.compare-sheet-list b.success {
|
||||
background: #dcfce7;
|
||||
color: #059669;
|
||||
background: var(--success-soft);
|
||||
color: var(--success-hover);
|
||||
}
|
||||
|
||||
.compare-sheet-list b.danger {
|
||||
@@ -106,8 +106,8 @@
|
||||
}
|
||||
|
||||
.compare-table-wrap td b.success {
|
||||
background: #dcfce7;
|
||||
color: #059669;
|
||||
background: var(--success-soft);
|
||||
color: var(--success-hover);
|
||||
}
|
||||
|
||||
.compare-table-wrap td b.warning {
|
||||
@@ -151,8 +151,8 @@
|
||||
.review-submit-form input:focus,
|
||||
.review-submit-form select:focus {
|
||||
outline: 0;
|
||||
border-color: rgba(16, 185, 129, 0.5);
|
||||
box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.12);
|
||||
border-color: rgba(var(--theme-primary-rgb), 0.5);
|
||||
box-shadow: 0 0 0 3px var(--theme-focus-ring);
|
||||
}
|
||||
|
||||
.review-submit-test-state,
|
||||
@@ -182,7 +182,7 @@
|
||||
}
|
||||
|
||||
.review-submit-test-state strong.passed {
|
||||
color: #047857;
|
||||
color: var(--success-hover);
|
||||
}
|
||||
|
||||
.review-submit-test-state p {
|
||||
@@ -335,7 +335,7 @@
|
||||
gap: 8px;
|
||||
margin-top: 14px;
|
||||
padding: 10px 12px;
|
||||
border: 1px solid rgba(14, 165, 233, 0.22);
|
||||
border: 1px solid rgba(58, 124, 165, 0.22);
|
||||
border-radius: 12px;
|
||||
background: linear-gradient(180deg, rgba(240, 249, 255, 0.96), rgba(224, 242, 254, 0.9));
|
||||
color: #075985;
|
||||
@@ -417,10 +417,10 @@
|
||||
min-height: 38px;
|
||||
margin-bottom: 10px;
|
||||
padding: 0 12px;
|
||||
border: 1px solid #e0f2fe;
|
||||
border: 1px solid #eaf4fa;
|
||||
border-radius: 10px;
|
||||
background: #f0f9ff;
|
||||
color: #0369a1;
|
||||
color: #255b7d;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
}
|
||||
@@ -451,8 +451,8 @@
|
||||
}
|
||||
|
||||
.reviewer-card {
|
||||
border-color: rgba(16, 185, 129, 0.24);
|
||||
background: linear-gradient(180deg, #ffffff, #f8fffc);
|
||||
border-color: rgba(var(--theme-primary-rgb), 0.24);
|
||||
background: linear-gradient(180deg, #ffffff, var(--theme-primary-soft));
|
||||
}
|
||||
|
||||
.review-list {
|
||||
@@ -515,7 +515,7 @@
|
||||
|
||||
.version-row.active {
|
||||
border-radius: 10px;
|
||||
background: rgba(16, 185, 129, 0.08);
|
||||
background: var(--theme-primary-soft);
|
||||
}
|
||||
|
||||
.version-main {
|
||||
@@ -564,8 +564,8 @@
|
||||
justify-content: center;
|
||||
padding: 0 7px;
|
||||
border-radius: 999px;
|
||||
background: #dcfce7;
|
||||
color: #059669;
|
||||
background: var(--success-soft);
|
||||
color: var(--success-hover);
|
||||
font-size: 11px;
|
||||
font-weight: 850;
|
||||
}
|
||||
@@ -599,8 +599,8 @@
|
||||
}
|
||||
|
||||
.version-state.success {
|
||||
background: #dcfce7;
|
||||
color: #059669;
|
||||
background: var(--success-soft);
|
||||
color: var(--success-hover);
|
||||
}
|
||||
|
||||
.version-state.warning {
|
||||
@@ -814,8 +814,8 @@
|
||||
|
||||
.test-state.success,
|
||||
.tool-state.safe {
|
||||
background: #dcfce7;
|
||||
color: #059669;
|
||||
background: var(--success-soft);
|
||||
color: var(--success-hover);
|
||||
}
|
||||
|
||||
.test-state.warning,
|
||||
@@ -908,7 +908,7 @@
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-top: 3px;
|
||||
accent-color: #0f766e;
|
||||
accent-color: var(--theme-primary);
|
||||
}
|
||||
|
||||
.risk-rule-create-toggle span {
|
||||
@@ -963,8 +963,8 @@
|
||||
.risk-rule-create-form select:focus,
|
||||
.risk-rule-create-form textarea:focus {
|
||||
outline: 0;
|
||||
border-color: rgba(16, 185, 129, 0.5);
|
||||
box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.12);
|
||||
border-color: rgba(var(--theme-primary-rgb), 0.5);
|
||||
box-shadow: 0 0 0 3px var(--theme-focus-ring);
|
||||
}
|
||||
|
||||
.risk-rule-create-form input:not([type='checkbox'])::placeholder,
|
||||
@@ -984,7 +984,7 @@
|
||||
}
|
||||
|
||||
.publish-summary strong {
|
||||
color: #059669;
|
||||
color: var(--theme-primary-active);
|
||||
font-size: 14px;
|
||||
font-weight: 850;
|
||||
}
|
||||
@@ -1031,8 +1031,8 @@
|
||||
}
|
||||
|
||||
.minor-action.success-action {
|
||||
border-color: rgba(5, 150, 105, 0.26);
|
||||
color: #059669;
|
||||
border-color: rgba(var(--success-rgb), 0.26);
|
||||
color: var(--success-hover);
|
||||
}
|
||||
|
||||
.minor-action.enable-action {
|
||||
@@ -1041,8 +1041,8 @@
|
||||
}
|
||||
|
||||
.minor-action.enable-action.is-on {
|
||||
border-color: rgba(5, 150, 105, 0.26);
|
||||
color: #059669;
|
||||
border-color: rgba(var(--success-rgb), 0.26);
|
||||
color: var(--success-hover);
|
||||
}
|
||||
|
||||
.minor-action.enable-action i {
|
||||
@@ -1167,10 +1167,10 @@
|
||||
}
|
||||
|
||||
.major-action {
|
||||
border: 1px solid #059669;
|
||||
background: #059669;
|
||||
border: 1px solid var(--theme-primary);
|
||||
background: var(--theme-primary);
|
||||
color: #fff;
|
||||
box-shadow: 0 4px 12px rgba(5, 150, 105, .16);
|
||||
box-shadow: 0 4px 12px var(--theme-primary-shadow);
|
||||
}
|
||||
|
||||
.back-action:hover,
|
||||
@@ -1216,8 +1216,8 @@
|
||||
}
|
||||
|
||||
.mini-btn.primary {
|
||||
border-color: #059669;
|
||||
background: #059669;
|
||||
border-color: var(--theme-primary);
|
||||
background: var(--theme-primary);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
@@ -1584,8 +1584,8 @@
|
||||
}
|
||||
|
||||
.json-risk-mode-pill.low {
|
||||
background: #ecfdf5;
|
||||
color: #059669;
|
||||
background: var(--success-soft);
|
||||
color: var(--success-hover);
|
||||
}
|
||||
|
||||
.json-risk-editor-body {
|
||||
@@ -1760,8 +1760,8 @@
|
||||
}
|
||||
|
||||
.json-risk-meta-badge.test-passed {
|
||||
background: #ecfdf5;
|
||||
color: #047857;
|
||||
background: var(--success-soft);
|
||||
color: var(--success-hover);
|
||||
}
|
||||
|
||||
.json-risk-meta-badge.test-pending {
|
||||
@@ -1785,8 +1785,8 @@
|
||||
}
|
||||
|
||||
.meta-status-indicator.is-active .indicator-dot {
|
||||
background: #10b981;
|
||||
box-shadow: 0 0 4px rgba(16, 185, 129, 0.4);
|
||||
background: var(--success);
|
||||
box-shadow: 0 0 4px rgba(var(--success-rgb), 0.4);
|
||||
}
|
||||
|
||||
.json-risk-editor-toolbar {
|
||||
|
||||
Reference in New Issue
Block a user