forked from SmartBench/CMVR-IOT-UI
301 lines
9.4 KiB
SCSS
301 lines
9.4 KiB
SCSS
|
// Scoped compatibility for business views that still contain light literals.
|
||
|
|
html.dark {
|
||
|
|
.tree-sidebar,
|
||
|
|
.tree-panel,
|
||
|
|
.tree-container,
|
||
|
|
.category-tree,
|
||
|
|
.corpus-list,
|
||
|
|
.task-list,
|
||
|
|
.right-panel,
|
||
|
|
.left-panel {
|
||
|
|
color: var(--el-text-color-regular);
|
||
|
|
background: var(--surface-0) !important;
|
||
|
|
border-color: var(--line-subtle) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tree-header,
|
||
|
|
.collapse-button-container,
|
||
|
|
.tree-sidebar.collapsed .collapse-button-container {
|
||
|
|
color: var(--el-text-color-regular) !important;
|
||
|
|
background: var(--surface-1) !important;
|
||
|
|
border-color: var(--line-subtle) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tree-title,
|
||
|
|
.tree-node,
|
||
|
|
.node-label { color: var(--el-text-color-primary) !important; }
|
||
|
|
|
||
|
|
.tree-action-icon:hover,
|
||
|
|
.collapse-button:hover,
|
||
|
|
.tree-wrap .el-tree-node__content:hover {
|
||
|
|
color: var(--el-color-primary) !important;
|
||
|
|
background: var(--surface-2) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tree-wrap .el-tree-node.is-current > .el-tree-node__content {
|
||
|
|
color: #67e8f9 !important;
|
||
|
|
background: rgba(6, 182, 212, 0.12) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
// Flow editor chrome, palette and nodes.
|
||
|
|
.page .page__container .vue-flow,
|
||
|
|
.lf-canvas-overlay { background: #090d16 !important; }
|
||
|
|
|
||
|
|
.page .page__container > .el-container > .el-header,
|
||
|
|
.page .page__container .el-header,
|
||
|
|
.page .page__container .el-aside,
|
||
|
|
.component-library,
|
||
|
|
.library-header,
|
||
|
|
.component-library .el-collapse-item__header,
|
||
|
|
.component-library .el-collapse-item__wrap,
|
||
|
|
.single-node-station-tools {
|
||
|
|
color: var(--el-text-color-regular) !important;
|
||
|
|
background: var(--surface-0) !important;
|
||
|
|
border-color: var(--line-subtle) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.page .page__container .canvas-toolbar,
|
||
|
|
.page .page__container .vue-flow__controls {
|
||
|
|
background: rgba(10, 14, 23, 0.9) !important;
|
||
|
|
border-color: var(--line-subtle) !important;
|
||
|
|
box-shadow: 0 10px 28px rgba(0, 0, 0, 0.3), 0 0 18px rgba(6, 182, 212, 0.08) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.page .page__container .canvas-toolbar .el-button,
|
||
|
|
.page .page__container .vue-flow__controls button {
|
||
|
|
color: var(--el-text-color-regular) !important;
|
||
|
|
background: transparent !important;
|
||
|
|
border-color: var(--line-subtle) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.component-library .node-item,
|
||
|
|
.flow-node-card,
|
||
|
|
.group__container,
|
||
|
|
.node__container,
|
||
|
|
.node__box,
|
||
|
|
.condition-summary,
|
||
|
|
.queue-step,
|
||
|
|
.output-row,
|
||
|
|
.flow-node-card .terminal-node__icon {
|
||
|
|
color: var(--el-text-color-regular) !important;
|
||
|
|
background: var(--surface-0) !important;
|
||
|
|
border-color: var(--line-subtle) !important;
|
||
|
|
box-shadow: none !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.node-title__icon,
|
||
|
|
.node-title__type,
|
||
|
|
.node-state,
|
||
|
|
.group__container .child__container,
|
||
|
|
.condition-summary__item,
|
||
|
|
.contract-header,
|
||
|
|
.input__container {
|
||
|
|
color: var(--el-text-color-regular) !important;
|
||
|
|
background: var(--surface-1) !important;
|
||
|
|
border-color: var(--line-subtle) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.node-title__name,
|
||
|
|
.condition-summary__title,
|
||
|
|
.flow-heading__name,
|
||
|
|
.library-title,
|
||
|
|
.node-name { color: var(--el-text-color-primary) !important; }
|
||
|
|
|
||
|
|
.node-desc,
|
||
|
|
.library-subtitle,
|
||
|
|
.flow-node-executor,
|
||
|
|
.node-title__description,
|
||
|
|
.condition-summary__text { color: var(--el-text-color-secondary) !important; }
|
||
|
|
|
||
|
|
// Corpus, speech and operational workspaces.
|
||
|
|
.row-cards .card,
|
||
|
|
.main-workspace .workspace-container > .left,
|
||
|
|
.main-workspace .workspace-container > .right,
|
||
|
|
.task-list,
|
||
|
|
.corpus-list,
|
||
|
|
.category-tree,
|
||
|
|
.page-container > .left,
|
||
|
|
.page-container > .right {
|
||
|
|
color: var(--el-text-color-regular) !important;
|
||
|
|
background: var(--surface-0) !important;
|
||
|
|
border: 1px solid var(--line-subtle) !important;
|
||
|
|
border-radius: 6px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.page-container .taskList-container .task-item,
|
||
|
|
.page-container > .right .task {
|
||
|
|
color: var(--el-text-color-regular) !important;
|
||
|
|
background: var(--surface-1) !important;
|
||
|
|
box-shadow: inset 0 0 0 1px var(--line-subtle) !important;
|
||
|
|
border-radius: 5px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.page-container .taskList-container .task-item.is-selected {
|
||
|
|
background: rgba(6, 182, 212, 0.1) !important;
|
||
|
|
box-shadow: inset 0 0 0 1px #06b6d4, 0 0 16px rgba(6, 182, 212, 0.1) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.task-log {
|
||
|
|
color: var(--el-text-color-regular) !important;
|
||
|
|
background: var(--surface-0) !important;
|
||
|
|
border-color: var(--line-subtle) !important;
|
||
|
|
border-radius: 6px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.task-log__group-header:hover,
|
||
|
|
.task-log__details,
|
||
|
|
.task-log__iteration-header,
|
||
|
|
.task-log__analysis,
|
||
|
|
.task-log__analysis-details,
|
||
|
|
.task-log__output,
|
||
|
|
.task-log__business-summary { background: var(--surface-1) !important; }
|
||
|
|
|
||
|
|
.task-log__heading,
|
||
|
|
.task-log__order,
|
||
|
|
.task-log__time,
|
||
|
|
.page-container .robot,
|
||
|
|
.page-container .progress-label { color: var(--el-text-color-secondary) !important; }
|
||
|
|
|
||
|
|
// Device list and direct control surfaces.
|
||
|
|
.robot-device-page { background: transparent !important; }
|
||
|
|
.robot-device-page .status-strip {
|
||
|
|
background: var(--surface-0) !important;
|
||
|
|
border-color: var(--line-subtle) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.robot-device-page .page-heading h2,
|
||
|
|
.robot-device-page .status-strip strong,
|
||
|
|
.robot-device-page .device-name b { color: var(--el-text-color-primary) !important; }
|
||
|
|
|
||
|
|
.robot-device-page .page-heading p,
|
||
|
|
.robot-device-page .robot-selector,
|
||
|
|
.robot-device-page .status-strip span,
|
||
|
|
.robot-device-page .device-name small { color: var(--el-text-color-secondary) !important; }
|
||
|
|
|
||
|
|
.robot-device-page .device-icon {
|
||
|
|
color: #67e8f9 !important;
|
||
|
|
background: rgba(6, 182, 212, 0.14) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.head-control,
|
||
|
|
.microphone-container,
|
||
|
|
.audio-player,
|
||
|
|
.container:has(> .left-panel > .hand-container) {
|
||
|
|
color: var(--el-text-color-regular) !important;
|
||
|
|
background: var(--surface-0) !important;
|
||
|
|
border: 1px solid var(--line-subtle) !important;
|
||
|
|
border-radius: 6px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.head-control .preset-panel,
|
||
|
|
.head-control .current-display,
|
||
|
|
.microphone-container .speaker-container,
|
||
|
|
.microphone-container .audioItem,
|
||
|
|
.audio-player .audio-item,
|
||
|
|
.voice-container .voice-btn {
|
||
|
|
color: var(--el-text-color-regular) !important;
|
||
|
|
background: var(--surface-1) !important;
|
||
|
|
border-color: var(--line-subtle) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.microphone-container .title,
|
||
|
|
.audio-player .title,
|
||
|
|
.voice-container .duration { color: var(--el-text-color-primary) !important; }
|
||
|
|
|
||
|
|
.audio-player .audio-item:hover,
|
||
|
|
.audio-player .audio-item.active,
|
||
|
|
.voice-container .voice-btn.playing {
|
||
|
|
color: #e6fbff !important;
|
||
|
|
background: linear-gradient(90deg, rgba(6, 182, 212, 0.12), rgba(168, 85, 247, 0.09)) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
// Evaluation workspaces.
|
||
|
|
.container:has(> .test-container) > .info,
|
||
|
|
.container:has(> .test-container) .btn-container,
|
||
|
|
.container:has(> .test-container) .context-container > .left > .title,
|
||
|
|
.container:has(> .test-container) .schemaList,
|
||
|
|
.evaluation-metrics > .left,
|
||
|
|
.evaluation-metrics > .right,
|
||
|
|
.evaluation-metrics .indicator-container {
|
||
|
|
color: var(--el-text-color-regular) !important;
|
||
|
|
background: var(--surface-0) !important;
|
||
|
|
border-color: var(--line-subtle) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.container:has(> .test-container) .activeItem,
|
||
|
|
.container:has(> .test-container) .schema:hover {
|
||
|
|
color: #e6fbff !important;
|
||
|
|
background: linear-gradient(105deg, rgba(6, 182, 212, 0.12), rgba(168, 85, 247, 0.1)) !important;
|
||
|
|
border-color: rgba(6, 182, 212, 0.48) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
// Robot layout editor and context menu.
|
||
|
|
#robot-interface {
|
||
|
|
background: rgba(7, 11, 20, 0.78) !important;
|
||
|
|
border: 1px solid var(--line-subtle);
|
||
|
|
border-radius: 6px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#robot-interface .tree-panel,
|
||
|
|
#robot-interface .robot-panel,
|
||
|
|
#robot-interface .popup,
|
||
|
|
#robot-interface .drag-handle,
|
||
|
|
#robot-interface .toggle-button,
|
||
|
|
#robot-interface .control-icon,
|
||
|
|
.context-menu {
|
||
|
|
color: var(--el-text-color-regular) !important;
|
||
|
|
background: rgba(20, 27, 45, 0.92) !important;
|
||
|
|
border-color: var(--line-subtle) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#robot-interface .popup,
|
||
|
|
.context-menu {
|
||
|
|
border-radius: 6px !important;
|
||
|
|
box-shadow: 0 16px 42px rgba(0, 0, 0, 0.46), 0 0 20px rgba(6, 182, 212, 0.1) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#robot-interface .toggle-button:hover,
|
||
|
|
#robot-interface .control-icon:hover,
|
||
|
|
.context-menu .menu-item:hover {
|
||
|
|
color: #67e8f9 !important;
|
||
|
|
background: rgba(6, 182, 212, 0.12) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.context-menu .menu-item,
|
||
|
|
#robot-interface .popup-title { color: var(--el-text-color-regular) !important; }
|
||
|
|
|
||
|
|
// Utility tables, icon chooser and cron editor.
|
||
|
|
.custom-table {
|
||
|
|
color: var(--el-text-color-regular) !important;
|
||
|
|
background: rgba(10, 14, 23, 0.54) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.custom-table th,
|
||
|
|
.custom-table td { border-color: var(--line-subtle) !important; }
|
||
|
|
.custom-table th { color: var(--el-text-color-primary) !important; background: var(--surface-1) !important; }
|
||
|
|
.custom-table tbody tr:hover,
|
||
|
|
.custom-table .dragging-row { background: linear-gradient(90deg, rgba(6, 182, 212, 0.1), rgba(168, 85, 247, 0.08)) !important; }
|
||
|
|
|
||
|
|
.icon-body .icon-item:hover,
|
||
|
|
.icon-body .icon-item.active {
|
||
|
|
color: #67e8f9 !important;
|
||
|
|
background: rgba(6, 182, 212, 0.1) !important;
|
||
|
|
border-radius: 4px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.popup-main,
|
||
|
|
.popup-result,
|
||
|
|
.popup-result .title,
|
||
|
|
.popup-result table span {
|
||
|
|
color: var(--el-text-color-regular) !important;
|
||
|
|
background: var(--surface-0) !important;
|
||
|
|
border-color: var(--line-subtle) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.popup-title { color: var(--el-text-color-primary) !important; background: var(--surface-1) !important; }
|
||
|
|
|
||
|
|
.pagination-container { background: transparent !important; }
|
||
|
|
.el-empty__description p,
|
||
|
|
.el-upload__tip { color: var(--el-text-color-secondary); }
|
||
|
|
}
|