From 90c8b63cef12acf23f45cb8925f8f9eea62063f2 Mon Sep 17 00:00:00 2001 From: liangbin <15536829364@163.com> Date: Thu, 28 Aug 2025 08:33:46 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E5=A4=A7=E5=B1=8F=E9=85=8D?= =?UTF-8?q?=E7=BD=AE=E9=A1=B5=E9=9D=A2=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/view/LargeScreen/index.vue | 111 ++++++++++++++++++++++++++++++--- 1 file changed, 103 insertions(+), 8 deletions(-) diff --git a/src/view/LargeScreen/index.vue b/src/view/LargeScreen/index.vue index 680c7dd..5aad996 100644 --- a/src/view/LargeScreen/index.vue +++ b/src/view/LargeScreen/index.vue @@ -108,14 +108,105 @@ const tooles = ref([ background-color: #8497a5; color: #fff; } -.MainPage :deep(.el-tabs__item) { +.MainPage :deep(.el-text.is-truncated) { color: #fff; } + +.MainPage :deep(.el-tree-node__content:hover){ + background-color: #6793d6; + color: #fff; +} + + +.MainPage :deep(.el-tabs__item) { + color: #bbb; +} +.MainPage :deep(.el-tabs__item.is-active) { + color: #0078d4; +} .MainPage :deep(.el-tabs__nav-wrap:after) { background: none; } +.MainPage :deep(.el-tabs__active-bar) { + background-color: #0078d4; +} + +/* 输入框样式 */ +.MainPage :deep(.el-input__wrapper) { + background-color: #333; + border: 1px solid #444; + box-shadow: none; +} +.MainPage :deep(.el-input__wrapper:hover) { + border-color: #555; +} +.MainPage :deep(.el-input__wrapper.is-focus) { + border-color: #0078d4; + box-shadow: 0 0 0 1px rgba(0, 120, 212, 0.2); +} +.MainPage :deep(.el-input__inner) { + color: #fff; + background-color: transparent; +} .MainPage :deep(.el-input-group__append, .el-input-group__prepend) { - padding: 0px 4px; + padding: 0px 8px; + background-color: #444; + border-color: #444; + color: #bbb; +} + +/* 选择器样式 */ +.MainPage :deep(.el-select .el-input__wrapper) { + background-color: #333; + border-color: #444; +} +.MainPage :deep(.el-select .el-input__inner) { + color: #fff; +} +.MainPage :deep(.el-select__caret) { + color: #bbb; +} +.MainPage :deep(.el-select__wrapper) { + background: none; +} + + +/* 折叠面板样式 */ +.MainPage :deep(.el-collapse) { + border: none; + background-color: transparent; +} +.MainPage :deep(.el-collapse-item__header) { + background-color: #2a2a2a; + color: #fff; + border: none; + border-bottom: 1px solid #444; + padding: 12px 16px; + font-weight: 500; +} +.MainPage :deep(.el-collapse-item__header:hover) { + background-color: #333; +} +.MainPage :deep(.el-collapse-item__arrow) { + color: #bbb; +} +.MainPage :deep(.el-collapse-item__wrap) { + border: none; + background-color: #222; +} +.MainPage :deep(.el-collapse-item__content) { + padding: 16px; + background-color: #222; + border-bottom: 1px solid #333; +} + +/* 颜色选择器样式 */ +.MainPage :deep(.el-color-picker__trigger) { + border: 1px solid #444; + background-color: #333; +} +.MainPage :deep(.el-color-picker__trigger:hover) { + border-color: #555; } @@ -153,16 +244,20 @@ h2 { display: flex; align-items: center; justify-content: space-between; - gap: 6px; - margin-top: 4px; + gap: 8px; + margin-bottom: 12px; + padding: 8px 0; } .SetName { - font-size: 14px; - white-space: nowrap; + font-size: 14px; + white-space: nowrap; + color: #ccc; + min-width: 80px; } -.SetValue{ +.SetValue { display: flex; - gap: 6px; + gap: 8px; + flex: 1; }