146 lines
4.6 KiB
SCSS
146 lines
4.6 KiB
SCSS
// 黑夜模式
|
|
[data-theme='theme-black'] {
|
|
--base-color: #304156;
|
|
// root
|
|
--base-menu-color: var(--base-color);
|
|
--base-menu-color-active: #f4f4f5;
|
|
--base-bg-main: var(--base-color);
|
|
--base-menu-background: var(--base-color);
|
|
--base-logo-title-color: #ffffff;
|
|
--base-topBar-background: var(--base-color) !important;
|
|
--base-topBar-color: #fff;
|
|
// --base-tags-bg-border: #304156 !important;
|
|
//缩小状态下子菜单选中颜色
|
|
// --base-sub-menu-hover: #000;
|
|
|
|
--next-color-white: #ffffff;
|
|
--next-color-disabled: #304156;
|
|
--next-color-bar: #dadada;
|
|
--next-border-color: #424242;
|
|
--next-border-black: #333333;
|
|
--next-text-color-regular: #9b9da1;
|
|
--next-text-color-placeholder: #7a7a7a;
|
|
--next-color-hover: #3c3c3c;
|
|
--next-color-hover-rgba: rgba(0, 0, 0, 0.3);
|
|
|
|
// el-ement ui 设置
|
|
--el-fill-color-light: var(--next-color-hover-rgba) !important;
|
|
--el-fill-color-blank: var(--base-bg-main) !important;
|
|
// element plus
|
|
--el-table-bg-color: var(--el-fill-color-blank);
|
|
--el-color-white: var(--next-color-disabled) !important;
|
|
--el-text-color-primary: var(--next-color-bar) !important;
|
|
--el-border-color-base: var(--next-border-black) !important;
|
|
--el-border-color-light: var(--next-border-black) !important;
|
|
--el-text-color-regular: var(--next-text-color-regular) !important;
|
|
--el-bg-color: var(--base-bg-main) !important;
|
|
--el-color-success-lighter: var(--base-color) !important;
|
|
--el-color-warning-lighter: var(--base-color) !important;
|
|
--el-color-danger-lighter: var(--base-color) !important;
|
|
--el-color-primary-lighter: var(--base-color) !important;
|
|
--el-color-primary-light-9: var(--next-color-hover) !important;
|
|
--el-text-color-disabled-base: var(--el-color-primary) !important;
|
|
--el-border-color-lighter: var(--next-border-black) !important;
|
|
--el-text-color-placeholder: var(--next-text-color-placeholder) !important;
|
|
--el-disabled-bg-color: var(--next-color-disabled) !important;
|
|
--el-fill-base: var(--next-color-white) !important;
|
|
// el-date-picker bg
|
|
--el-bg-color-overlay: var(--base-bg-main) !important;
|
|
// drawer
|
|
.drawer-item,
|
|
.drawer-title {
|
|
color: var(--next-color-white) !important;
|
|
}
|
|
|
|
// button
|
|
.el-button {
|
|
&:hover {
|
|
border-color: var(--next-border-color) !important;
|
|
}
|
|
}
|
|
.el-button--primary,
|
|
.el-button--info,
|
|
.el-button--danger,
|
|
.el-button--success,
|
|
.el-button--warning {
|
|
--el-button-text-color: var(--next-color-white) !important;
|
|
--el-button-hover-text-color: var(--next-color-white) !important;
|
|
--el-button-disabled-text-color: var(--next-color-white) !important;
|
|
&:hover {
|
|
border-color: var(--el-button-hover-border-color, var(--el-button-hover-bg-color)) !important;
|
|
}
|
|
}
|
|
|
|
// pagination
|
|
.el-pagination.is-background .el-pager li:not(.disabled).active {
|
|
color: var(--next-color-white) !important;
|
|
}
|
|
.el-pagination.is-background .btn-next,
|
|
.el-pagination.is-background .btn-prev,
|
|
.el-pagination.is-background .el-pager li {
|
|
background-color: var(--main-bg-color);
|
|
}
|
|
|
|
// tabs
|
|
.el-tabs--border-card {
|
|
background-color: var(--el-color-white) !important;
|
|
}
|
|
.el-tabs--border-card > .el-tabs__header .el-tabs__item.is-active {
|
|
background: var(--base-color) !important;
|
|
}
|
|
|
|
// alert / notice-bar
|
|
.home-card-item {
|
|
border: 1px solid var(--next-border-color-light) !important;
|
|
}
|
|
.el-alert,
|
|
.notice-bar {
|
|
border: 1px solid var(--next-border-color) !important;
|
|
background-color: var(--next-color-disabled) !important;
|
|
}
|
|
|
|
// colorPicker
|
|
.el-color-picker__mask {
|
|
background: unset !important;
|
|
}
|
|
.el-color-picker__trigger {
|
|
border: 1px solid var(--next-border-color-light) !important;
|
|
}
|
|
|
|
// popper / dropdown
|
|
.el-popper {
|
|
border: 1px solid var(--next-border-color) !important;
|
|
color: var(--el-text-color-primary) !important;
|
|
.el-popper__arrow:before {
|
|
background: var(--el-color-white) !important;
|
|
border: 1px solid var(--next-border-color);
|
|
}
|
|
a {
|
|
color: var(--el-text-color-primary) !important;
|
|
}
|
|
}
|
|
.el-popper,
|
|
.el-dropdown-menu {
|
|
background: var(--el-color-white) !important;
|
|
}
|
|
.el-dropdown-menu__item:hover:not(.is-disabled) {
|
|
background: var(--el-bg-color) !important;
|
|
}
|
|
.el-dropdown-menu__item.is-disabled {
|
|
font-weight: 700 !important;
|
|
}
|
|
|
|
//tags menu 选择
|
|
.tags-view-container .tags-view-wrapper .tags-view-item.active {
|
|
background-color: var(--base-color) !important;
|
|
// border-color: var(--base-color) !important;
|
|
}
|
|
|
|
// md 编辑器、图片加载错误、
|
|
.md,
|
|
.el-upload--picture-card,
|
|
.el-image__error {
|
|
background: none !important;
|
|
}
|
|
}
|