Commit ff2b80cc authored by 田争光's avatar 田争光

feat(*):菜单样式修改

parent af761158
...@@ -236,7 +236,7 @@ watch( ...@@ -236,7 +236,7 @@ watch(
.el-table { .el-table {
// 设置表头样式 // 设置表头样式
th.el-table__cell { th.el-table__cell {
background-color: #f5f7fa !important; // background-color: #f5f7fa !important;
color: #606266; color: #606266;
font-weight: 600; font-weight: 600;
} }
......
...@@ -16,29 +16,29 @@ ...@@ -16,29 +16,29 @@
} }
.el-table__header { .el-table__header {
border-top: 1px solid var(--table-border-color); border-top: 0px solid var(--table-border-color);
} }
.el-table__header th{ .el-table__header th{
background-color: var(--table-head-bg-color) !important; background-color: var(--table-head-bg-color) !important;
border-bottom-color: var(--table-item-border-color) !important; border-bottom-color: transparent !important;
} }
.el-table__body td { .el-table__body td {
border-bottom-color: var(--table-item-border-color) !important; border-bottom-color: transparent !important;
} }
.el-table--border .el-table__inner-wrapper:after { .el-table--border .el-table__inner-wrapper:after {
height: 0.9px !important; height: 0px !important;
} }
.el-table--border .el-table__inner-wrapper:after, .el-table--border:after, .el-table--border:before, .el-table__inner-wrapper:before { .el-table--border .el-table__inner-wrapper:after, .el-table--border:after, .el-table--border:before, .el-table__inner-wrapper:before {
background-color: var(--table-border-color) !important; background-color: transparent !important;
} }
.el-table__border-left-patch { .el-table__border-left-patch {
background-color: var(--table-border-color) !important; background-color: var(--table-border-color) !important;
width: 0.9px; width: 0px;
} }
.el-table--border:after { .el-table--border:after {
background-color: var(--table-border-color) !important; background-color: transparent !important;
} }
.el-table--border .el-table__cell { .el-table--border .el-table__cell {
border-right: none !important; border-right: transparent !important;
} }
...@@ -214,15 +214,4 @@ const getMenuTitle = (item) => { ...@@ -214,15 +214,4 @@ const getMenuTitle = (item) => {
} }
} }
.el-menu-item {
// background: #055F7CFF !important;
}
.submenu-box .is-active {
// background-color: #fff !important;
span {
// color: #055f7c !important;
}
}
</style> </style>
\ No newline at end of file
import { createApp } from "vue"; import { createApp } from "vue";
import "./style.css";
import "./theme.scss";
import App from "./App.vue"; import App from "./App.vue";
import { router } from "./router"; import { router } from "./router";
import "@/router/routePermission.js"; import "@/router/routePermission.js";
...@@ -11,6 +9,8 @@ import * as ElementPlusIconsVue from "@element-plus/icons-vue"; ...@@ -11,6 +9,8 @@ import * as ElementPlusIconsVue from "@element-plus/icons-vue";
import { createPinia } from "pinia"; import { createPinia } from "pinia";
import moment from 'moment'; import moment from 'moment';
import { startPermissionCheck, stopPermissionCheck } from '@/utils/permissionChecker'; import { startPermissionCheck, stopPermissionCheck } from '@/utils/permissionChecker';
import "./style.css";
import "./theme.scss";
const app = createApp(App); const app = createApp(App);
......
...@@ -44,9 +44,9 @@ ...@@ -44,9 +44,9 @@
margin: 0; margin: 0;
} }
.page-container { .page-container,.my-agency,.equipment-management {
width: 100%; width: 100%;
background: #181d21; background: #181d21 !important;
border-radius: 6px; border-radius: 6px;
box-shadow: 0px 3px 6px 0px rgba(13, 15, 18, 0.10); box-shadow: 0px 3px 6px 0px rgba(13, 15, 18, 0.10);
padding: 1rem; padding: 1rem;
...@@ -89,9 +89,7 @@ select:-webkit-autofill { ...@@ -89,9 +89,7 @@ select:-webkit-autofill {
.el-menu { .el-menu {
border-right: unset !important; border-right: unset !important;
} }
.el-menu-item:hover {
background: transparent !important;
}
.el-menu-item .is-active{ .el-menu-item .is-active{
background: transparent !important; background: transparent !important;
} }
...@@ -99,4 +97,10 @@ select:-webkit-autofill { ...@@ -99,4 +97,10 @@ select:-webkit-autofill {
.el-breadcrumb__item:last-child .el-breadcrumb__inner { .el-breadcrumb__item:last-child .el-breadcrumb__inner {
color: #ccc !important; color: #ccc !important;
padding-left: 16px; padding-left: 16px;
}
.el-progress-bar__outer {
background-color: #4e4e4e;
} }
\ No newline at end of file
.el-form-item__label { .el-form-item__label {
font-size: 14px; font-size: 14px;
color: #909399 !important; color: #909399 !important;
} }
.el-select { .el-select {
width: 230px; width: 230px;
.el-select__placeholder { .el-select__placeholder {
color: #d9dbdc !important; color: #d9dbdc !important;
} }
...@@ -13,6 +14,7 @@ ...@@ -13,6 +14,7 @@
background-color: var(--bg-secondary) !important; background-color: var(--bg-secondary) !important;
box-shadow: 0 0 0 1px #2a2a2a inset !important; box-shadow: 0 0 0 1px #2a2a2a inset !important;
} }
.el-input { .el-input {
background-color: var(--bg-secondary); background-color: var(--bg-secondary);
...@@ -44,28 +46,30 @@ ...@@ -44,28 +46,30 @@
} }
} }
.el-popper.is-light, .el-popper.is-light>.el-popper__arrow:before { .el-popper.is-light,
background: var(--bg-secondary) !important; .el-popper.is-light>.el-popper__arrow:before {
border: 1px solid var(--bg-secondary) !important; background: var(--bg-secondary) !important;
border: 1px solid var(--bg-secondary) !important;
} }
.el-select-dropdown__item.is-hovering { .el-select-dropdown__item.is-hovering {
background-color: rgba(255, 255, 255, 0.1) !important; background-color: rgba(255, 255, 255, 0.1) !important;
} }
.el-select-dropdown__item { .el-select-dropdown__item {
color: #d9dbdc; color: #d9dbdc;
&.selected { &.selected {
background-color: rgba(255, 255, 255, 0.1); background-color: rgba(255, 255, 255, 0.1);
} }
&:hover { &:hover {
background-color: rgba(255, 255, 255, 0.05); background-color: rgba(255, 255, 255, 0.05);
}
} }
.el-select-dropdown__item.is-hovering { }
background-color: rgba(255, 255, 255, 0.1);
.el-select-dropdown__item.is-hovering {
background-color: rgba(255, 255, 255, 0.1);
} }
.el-popper__arrow { .el-popper__arrow {
...@@ -73,37 +77,41 @@ ...@@ -73,37 +77,41 @@
} }
.el-range-editor { .el-range-editor {
background-color: var(--bg-secondary) !important; background-color: var(--bg-secondary) !important;
border-color: var(--bg-secondary) !important; border-color: var(--bg-secondary) !important;
.el-range__icon {
display: none !important;
}
.el-range-input {
color: #d9dbdc !important;
background-color: transparent !important;
font-size: 15px !important;
&::placeholder { .el-range__icon {
color: rgba(255, 255, 255, 0.5) !important; display: none !important;
} }
}
.el-range-separator { .el-range-input {
color: rgba(255, 255, 255, 0.7) !important; color: #d9dbdc !important;
background-color: transparent !important;
font-size: 15px !important;
&::placeholder {
color: rgba(255, 255, 255, 0.5) !important;
} }
} }
.el-icon { .el-range-separator {
color: rgba(255, 255, 255, 0.7) !important; color: rgba(255, 255, 255, 0.7) !important;
} }
}
.el-icon {
color: rgba(255, 255, 255, 0.7) !important;
}
.el-date-editor.el-input__wrapper {
box-shadow: 0 0 0 1px #2a2a2a inset !important; .el-date-editor.el-input__wrapper {
box-shadow: 0 0 0 1px #2a2a2a inset !important;
} }
.el-popper.is-light {
border: 1px solid #181d21 !important; .el-popper.is-light {
} border: 1px solid #181d21 !important;
}
.date-picker-popper { .date-picker-popper {
border: 1px solid #181d21 !important; border: 1px solid #181d21 !important;
box-shadow: #181d21 !important; box-shadow: #181d21 !important;
...@@ -112,6 +120,7 @@ ...@@ -112,6 +120,7 @@
background: #00000040; background: #00000040;
box-shadow: 0 0 0 2px #181d21 inset !important; box-shadow: 0 0 0 2px #181d21 inset !important;
} }
.el-input__wrapper { .el-input__wrapper {
box-shadow: 0 0 0 1px #535252 inset !important; box-shadow: 0 0 0 1px #535252 inset !important;
} }
...@@ -119,12 +128,15 @@ ...@@ -119,12 +128,15 @@
.el-date-range-picker__time-header { .el-date-range-picker__time-header {
border-bottom: 1px solid #8a9199 !important; border-bottom: 1px solid #8a9199 !important;
} }
.el-picker-panel { .el-picker-panel {
color: #d9dbdc !important; color: #d9dbdc !important;
} }
.el-picker-panel__body { .el-picker-panel__body {
background: #181d21; background: #181d21;
} }
.el-date-range-picker__content.is-left { .el-date-range-picker__content.is-left {
border-right: 1px solid #181d21 !important; border-right: 1px solid #181d21 !important;
} }
...@@ -132,62 +144,120 @@ ...@@ -132,62 +144,120 @@
.el-date-table th { .el-date-table th {
border-bottom: 1px solid #181d21 !important; border-bottom: 1px solid #181d21 !important;
} }
.el-date-table th { .el-date-table th {
color: #d9dbdc !important; color: #d9dbdc !important;
} }
.el-date-table td.in-range .el-date-table-cell { .el-date-table td.in-range .el-date-table-cell {
background-color: #181d21 !important; background-color: #181d21 !important;
} }
.el-date-editor .el-range__icon, .el-date-editor .el-range__icon,
.el-date-editor .el-range-separator, .el-date-editor .el-range-separator,
.el-date-editor .el-range-input { .el-date-editor .el-range-input {
color: #d9dbdc !important; color: #d9dbdc !important;
font-size: 14px !important; font-size: 14px !important;
} }
.el-picker-panel__footer { .el-picker-panel__footer {
background-color: #181d21 !important; background-color: #181d21 !important;
border-top-color: #181d21 !important; border-top-color: #181d21 !important;
} }
.el-input__wrapper { .el-input__wrapper {
background-color: #181d21 !important; background-color: #181d21 !important;
} }
.el-button.is-text { .el-button.is-text {
color: #d9dbdc !important; color: #d9dbdc !important;
} }
.el-button.is-plain { .el-button.is-plain {
color: #4e7bfa !important; color: #4e7bfa !important;
background-color: rgba(78, 123, 250, 0.2) !important; background-color: rgba(78, 123, 250, 0.2) !important;
border-color: #4e7bfa !important; border-color: #4e7bfa !important;
} }
.el-button.is-text:not(.is-disabled):hover { .el-button.is-text:not(.is-disabled):hover {
background-color: #9b9a9a !important; background-color: #9b9a9a !important;
} }
.el-select__wrapper { .el-select__wrapper {
background-color: #181d21 !important; background-color: #181d21 !important;
} }
.el-input__inner { .el-input__inner {
color: #d9dbdc !important; color: #d9dbdc !important;
} }
.el-picker-panel .el-time-panel { .el-picker-panel .el-time-panel {
background-color: #181d21 !important; background-color: #181d21 !important;
border-color: #181d21 !important; border-color: #181d21 !important;
} }
.el-time-panel__footer { .el-time-panel__footer {
border-color: #181d21 !important; border-color: #181d21 !important;
} }
.el-time-spinner__item.is-active:not(.is-disabled) { .el-time-spinner__item.is-active:not(.is-disabled) {
color: #d9dbdc !important; color: #d9dbdc !important;
} }
.el-select-dropdown { .el-select-dropdown {
background-color: #181d21 !important; background-color: #181d21 !important;
} }
.el-select-dropdown__item { .el-select-dropdown__item {
color: #d9dbdc !important; color: #d9dbdc !important;
} }
.el-select-dropdown__item .is-hovering { .el-select-dropdown__item .is-hovering {
color: #181d21 !important; color: #181d21 !important;
} }
.date-picker-popper .el-picker-panel__body { .date-picker-popper .el-picker-panel__body {
background-color: #181d21 !important; background-color: #181d21 !important;
} }
}
.common-table {
.el-table tr,.el-table th.el-table__cell {
background-color: #101418 !important;
color: #ccc !important;
}
.el-table--border .el-table__cell {
border-color: #000000 !important;
}
}
.el-table {
--el-table-border-color: #101418 !important;
}
.el-scrollbar__wrap {
background-color: #101418 !important;
}
.el-table .el-table__body tr:hover > td {
background-color:rgba(82, 82, 82, 0.5) !important;
}
.el-table__border-left-patch {
background-color: #101418 !important;
}
.collectorList .health-score {
color: rgba(54, 241, 205, 0.7) !important;
}
.el-pagination button.is-disabled, .el-pagination button:disabled {
background-color: #181d21 !important;
cursor: not-allowed;
}
.el-pager li ,.btn-next,.btn-prev,.el-pagination__editor .el-input__wrapper{
background-color: #181d21 !important;
color: #ccc;
} }
\ No newline at end of file
...@@ -142,22 +142,22 @@ watch( ...@@ -142,22 +142,22 @@ watch(
cursor: pointer; cursor: pointer;
} }
.message-item:hover { .message-item:hover {
background: #f0f0f0; background: #000000;
} }
.message-item .time { .message-item .time {
color: #58616b; color: #CCC;
margin-right: 5px; margin-right: 5px;
min-width: 80px; min-width: 80px;
flex-shrink: 0; flex-shrink: 0;
} }
.message-item .title { .message-item .title {
margin-right: 5px; margin-right: 5px;
color: #0c0b0b; color: #8d8d8d;
font-weight: bold; font-weight: bold;
} }
.message-item .content { .message-item .content {
flex: 1; flex: 1;
color: #58616b; color: #CCC;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
......
...@@ -124,7 +124,7 @@ onBeforeUnmount(() => { }); ...@@ -124,7 +124,7 @@ onBeforeUnmount(() => { });
height: 15rem; height: 15rem;
&>div { &>div {
background: #ffffff; background: #181d21;
border-radius: 6px; border-radius: 6px;
box-shadow: 0px 3px 6px 0px rgba(13, 15, 18, 0.1); box-shadow: 0px 3px 6px 0px rgba(13, 15, 18, 0.1);
padding: 16px; padding: 16px;
...@@ -134,7 +134,7 @@ onBeforeUnmount(() => { }); ...@@ -134,7 +134,7 @@ onBeforeUnmount(() => { });
.title { .title {
font-size: 18px; font-size: 18px;
font-weight: normal; font-weight: normal;
color: #83868b; color: #CCC;
line-height: 22px; line-height: 22px;
margin-bottom: 10px; margin-bottom: 10px;
} }
...@@ -176,7 +176,7 @@ onBeforeUnmount(() => { }); ...@@ -176,7 +176,7 @@ onBeforeUnmount(() => { });
width: 100%; width: 100%;
height: calc(100% - 16rem); height: calc(100% - 16rem);
margin-top: 1rem; margin-top: 1rem;
background: #ffffff; background: #181d21;
border-radius: 6px; border-radius: 6px;
box-shadow: 0px 3px 6px 0px rgba(13, 15, 18, 0.1); box-shadow: 0px 3px 6px 0px rgba(13, 15, 18, 0.1);
padding: 16px; padding: 16px;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment