//通用样式
html {
--hc-body-bg-color: #F5F5F5;
--hc-bg-color: #ffffff;
--hc-text-color: #333333;
--hc-shadow: 4px 4px 8px 0 rgba(54,92,167,0.15), -4px -4px 8px 0 #ffffff;
transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0s, background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0s;
}
//深色主题设置
html.dark {
--hc-body-bg-color: #050c17;
--hc-bg-color: #050c17;
--hc-text-color: #7780A1;
--el-bg-color-overlay: #050c17;
--hc-border-color: rgba(119, 128, 161, .2);
--hc-label-color: #5A6382;
--hc-shadow: 4px 4px 8px 0 rgba(0,0,0,0.15), -4px -4px 8px 0 #3d3d3d;
html, body, #app {
background: #000000;
color: hsla(0,0%,100%,0.8);
}
.hc-layout-box .hc-layout-left-box {
background: #181818 !important;
color: hsla(0,0%,100%,0.8) !important;
}
.hc-layout-box .hc-layout-left-box .hc-project-box,
.hc-layout-box .hc-layout-left-box .hc-tree-foot-tip-box {
border-color: hsla(0,0%,100%,0.2);
}
.hc-layout-box .hc-layout-left-box .hc-project-box .hc-project-icon-box {
color: white;
}
.hc-layout-box .hc-layout-left-box .hc-project-box .project-name-box .project-alias {
color: white;
}
.hc-layout-box .hc-layout-left-box .hc-tree-foot-tip-box .dot-view.black:before,
.hc-tree-mp-tip-box .dot-view.black:before{
border: 1px solid #3e3d3d;
}
.data-custom-tree-node .menu-icon1 {
background: hsla(0,0%,100%,0.46);
}
.data-custom-tree-node{
&:hover {
background-color: #000000;
}
}
.data-custom-tree-node .menu-icon1 .cu-tree-node-popover-menu-icon {
color: black;
}
//右键菜单
.hc-context-menu-box {
background-color: #4A4A4A;
}
.hc-context-menu-box .hc-context-menu-item {
color: #E3E3E3;
&:hover {
background-color: #616161;
}
}
//新卡片
.el-card.hc-new-card-box {
background: #181818;
--el-card-bg-color: #181818;
--el-text-color-primary: hsla(0, 0%, 100%, 0.8);
}
.el-card.hc-tab-card-box .hc-card-header-box {
border-color: hsla(0, 0%, 100%, 0.2);
}
.el-card.hc-tab-card-box .tab-card-header-tabs .item {
border-color: hsla(0, 0%, 100%, 0.2);
}
.el-card.hc-tab-card-box .tab-card-header-tabs {
.item + .item {
border-left: 0;
}
}
.el-card.hc-tab-card-box .tab-card-header-tabs .item.cur {
background: #181818;
border-color: hsla(0, 0%, 100%, 0.2);
color: hsla(0, 0%, 100%, 0.8);
}
.el-card.hc-tab-card-box .tab-card-header-tabs .item.cur:after {
background: #181818;
}
//切换线
.hc-expansion-contraction-tree:hover {
color: #8c9099;
background: #181818;
}
//表单
.data-fill-list-box .el-collapse .el-collapse-item {
background-color: #282828;
border-color: hsla(0,0%,100%,0.45);
}
.data-fill-list-box .hc-collapse-item-header .item-title {
color: rgba(255, 255, 255, 0.9);
}
.data-fill-list-box .hc-collapse-item-header .real-fill-rate::after {
background: hsla(0, 0%, 100%, 0.2);
}
.data-fill-list-box .hc-collapse-item-header .real-fill-rate .tag {
background: #181818;
}
.data-fill-list-box .el-collapse .el-collapse-item.is-active .el-collapse-item__header.is-active {
background-color: transparent;
}
.data-fill-list-box .el-collapse .el-collapse-item__wrap .el-collapse-item__content {
color: hsla(0, 0%, 100%, 0.8);
}
.data-fill-list-box .data-fill-list-item-content .data-fill-table-form-box {
border-color: #131313;
}
//表单颜色
.hc-table-form-data-item .hc-excel-table-form, .hc-excel-table-form-view {
.el-input, .el-date-editor {
--el-input-text-color: #606266;
--el-input-hover-border: #c0c4cc;
--el-input-border-color: #dcdfe6;
--el-input-bg-color: #ffffff;
--el-input-icon-color: #a8abb2;
--el-input-placeholder-color: #a8abb2;
--el-input-hover-border-color: #c0c4cc;
--el-input-clear-hover-color: #909399;
}
.el-date-editor .el-range-input {
color: #4c4e50;
}
.el-radio, .el-checkbox {
color: #606266;
}
}
.el-overlay {
background-color: rgb(255 255 255/0.05);
backdrop-filter: blur(4px);
}
.ui-drag-modal-box .ui-drag-modal-dialog {
background: #2f2f2f;
border: 1px solid hsla(0,0%,100%,0.2);
box-shadow: 0 0 24px rgba(81,87,103,.16);
}
.el-overlay-dialog .el-dialog.hc-new-dialog {
background: #2f2f2f;
border: 1px solid hsla(0,0%,100%,0.2);
box-shadow: 0 0 24px rgba(81,87,103,.16);
}
.el-overlay-dialog .el-dialog.hc-modal-border .el-dialog__header,
.el-overlay-dialog .el-dialog.hc-modal-border .el-dialog__footer {
border-color: hsla(0, 0%, 100%, 0.2);
}
.el-form-item--large .el-form-item__content .form-item-div {
border-color: hsla(0, 0%, 100%, 0.2);
color: hsla(0, 0%, 100%, 0.8);
}
.hc-counter-box .counter-box {
color: hsla(0, 0%, 100%, 0.8);
}
.hc-counter-box .counter-box .counter-btn {
border-color: hsla(0, 0%, 100%, 0.2);
background-color: #414141;
}
.hc-counter-box .counter-box .counter-btn[disabled=true] {
background-color: #c4c4c4;
color: #949393;
}
.hc-counter-box .counter-box .counter-val {
border-color: hsla(0, 0%, 100%, 0.2);
}
.el-card.hc-new-card-box .hc-card-header-box {
border-color: hsla(0, 0%, 100%, 0.2);
}
.sort-node-body-box.list-group {
border-color: hsla(0, 0%, 100%, 0.2);
}
.sort-node-body-box.list-group.header .list-group-item {
background-color: #191919;
color: hsla(0, 0%, 100%, 0.8);
}
.sort-node-body-box.list-group .list-group-item:hover {
background-color: #252424;
}
.sort-node-body-box.list-group .list-group-item + .list-group-item {
border-color: hsla(0, 0%, 100%, 0.2);
}
//分页
.card-page-box .el-pagination.is-background .btn-next,
.card-page-box .el-pagination.is-background .btn-prev,
.card-page-box .el-pagination.is-background .el-pager li {
border-color: hsla(0, 0%, 100%, 0.2);
}
//日志填报
.el-menu.hc-ledger-query-menu {
--el-menu-text-color: initial;
--el-menu-hover-bg-color: #343434;
}
.el-menu.hc-ledger-query-menu .el-sub-menu .el-menu-item.is-active {
background: #181818;
border: 1px solid hsla(0, 0%, 100%, 0.2);
box-shadow: none;
color: white;
}
.hc-table-form-content .hc-table-forem-box, .hc-table-form-content .hc-fixed-page,
.hc-table-form-content .hc-right-pian-box, .hc-table-form-content .hc-footer-box {
padding: 8px;
background: #181818;
border-color: #131313;
}
.hc-date-calendar-box .hc-date-picker-box {
border-color: hsla(0, 0%, 100%, 0.2);
}
.hc-date-calendar-box .hc-date-picker-box .hc-date-btn-box .hc-div-btn {
background: #343434;
color: hsla(0, 0%, 100%, 0.8);
border: 1px solid hsla(0, 0%, 100%, 0.2);
box-shadow: none;
&:hover {
color: var(--el-color-primary);
}
}
.hc-date-calendar-box .hc-date-dates .hc-date-dates-day {
color: hsla(0, 0%, 100%, 0.8);
&:hover {
color: var(--el-color-primary);
}
}
.hc-date-calendar-box .hc-date-dates .hc-date-dates-day.choice {
box-shadow: none;
}
.hc-table-form-content .hc-content-box .hc-fixed-page .hc-fixed-page-list-box .fixed-page-item {
background: #343434;
color: hsla(0, 0%, 100%, 0.8);
border: 1px solid hsla(0, 0%, 100%, 0.2);
box-shadow: none;
}
.hc-layout-box .hc-chart-content-box {
background: #181818;
}
.hc-layout-box .hc-round-chart-card-box,
.hc-layout-box .hc-report-chart-card-box,
.hc-layout-box .hc-media-chart-card-box {
background: #181818;
}
.hc-layout-box .hc-round-chart .hc-round-chart-card-box .hc-card-content-box .card-title {
color: hsla(0,0%,100%,0.46);
}
.hc-layout-box .hc-round-chart .hc-round-chart-card-box .hc-card-content-box .card-ratio-box .ratio-num {
color: hsla(0, 0%, 100%, 0.8);
}
.hc-layout-box .hc-round-chart .hc-round-chart-card-box .hc-card-content-box .card-amount-box .amount-divider{
background-color: hsla(0, 0%, 100%, 0.2);
}
.hc-layout-box .hc-chart-flex .hc-report-chart-card-box .hc-chart-title .title,
.hc-layout-box .hc-chart-flex .hc-media-chart-card-box .hc-chart-title .title {
color: hsla(0,0%,100%,0.46);
}
.hc-layout-box .hc-chart-flex .hc-report-chart-card-box .hc-report-chart-box,
.hc-layout-box .hc-chart-flex .hc-media-chart-card-box .hc-report-chart-box,
.hc-layout-box .hc-chart-flex .hc-report-chart-card-box .hc-media-chart-box,
.hc-layout-box .hc-chart-flex .hc-media-chart-card-box .hc-media-chart-box,
.hc-layout-box .hc-chart-flex .hc-media-chart-card-box .hc-media-chart-box .hc-media-pian-box {
background: #343434;
color: hsla(0, 0%, 100%, 0.8);
border: 1px solid hsla(0, 0%, 100%, 0.2);
}
}