nginx-ui/frontend/src/assets/css/dark.less
2022-02-19 09:52:59 +08:00

68 lines
1.9 KiB
Text

@media (prefers-color-scheme: dark) {
@import '~ant-design-vue/dist/antd.less';
@black_bg: #1e1f20;
@background-color-base: @black_bg;
@background-color-light: @black_bg;
@btn-default-bg: @black_bg;
@black_content: #28292c;
@text-color: #fff;
@text-color-secondary: #bdbdbd;
@heading-color: #fff;
@body-background: @black_bg;
@component-background: @black_content;
@layout-body-background: @black_bg;
@layout-header-background: @black_bg;
@layout-sider-background: @black_content;
@ant-layout-sider-light: @black_content;
@menu-bg: @black_content;
@layout-trigger-background: @black_content;
@layout-sider-background-light: @black_content;
@layout-trigger-background-light: @black_content;
@item-active-bg: #161717;
@link-color: #fff;
@table-row-hover-bg: @black_bg;
@table-selected-row-bg: @black_bg;
@input-bg: @black_bg;
@disabled-bg: #363636;
@btn-default-bg: @black_bg;
@table-header-bg: @black_bg;
@border-color-base: #666666;
@disabled-color: #bcbcbc;
@radio-button-bg: @black_bg;
@checkbox-check-color: @black_bg;
@popover-bg: @black_bg;
@background-color-light: fade(@white, 4%); // background of header and selected item
// Descriptions
// ---
@descriptions-bg: @background-color-light;
// Alert
// ---
@alert-message-color: @black;
.ant-select-dropdown-menu-item:hover {
background: @black_bg;
}
.ant-layout-sider {
background-color: @black_content;
}
.ant-checkbox-indeterminate {
.ant-checkbox-inner {
background-color: transparent !important;
}
}
.ant-transfer-list-content-item:not(.ant-transfer-list-content-item-disabled):hover,
.ant-transfer-list-content-item-highlight-enter, .ant-transfer-list-content-item-highlight-enter-active {
background-color: @black_bg !important;
}
}