body { color: #fff; background-color: #161719; // background-color: #161719; } /* Color -------------------------- */ /// color|1|Background Color|4 $--color-white: #161719 !default; /// color|1|Background Color|4 $--color-black: #fff !default; $--color-primary-light-1: mix($--color-white, $--color-primary, 10%) !default; /* 53a8ff */ $--color-primary-light-2: mix($--color-white, $--color-primary, 20%) !default; /* 66b1ff */ $--color-primary-light-3: mix($--color-white, $--color-primary, 30%) !default; /* 79bbff */ $--color-primary-light-4: mix($--color-white, $--color-primary, 40%) !default; /* 8cc5ff */ $--color-primary-light-5: mix($--color-white, $--color-primary, 50%) !default; /* a0cfff */ $--color-primary-light-6: mix($--color-white, $--color-primary, 60%) !default; /* b3d8ff */ $--color-primary-light-7: mix($--color-white, $--color-primary, 70%) !default; /* c6e2ff */ $--color-primary-light-8: mix($--color-white, $--color-primary, 80%) !default; /* d9ecff */ $--color-primary-light-9: mix($--color-white, $--color-primary, 90%) !default; /* ecf5ff */ /// color|1|Font Color|2 $--color-text-primary: #fff !default; /// color|1|Font Color|2 $--color-text-regular: #D8D9DA !default; /// color|1|Font Color|2 $--color-text-secondary: #8E8E8E !default; /// color|1|Font Color|2 $--color-text-placeholder: #555555 !default; /// color|1|Border Color|3 $--border-color-base: #262628 !default; /// color|1|Border Color|3 $--border-color-light: #262628 !default; /// color|1|Border Color|3 $--border-color-lighter: #262628 !default; /// color|1|Border Color|3 $--border-color-extra-light: #262628 !default; // Background /// color|1|Background Color|4 $--background-color-base: #19191b !default; /* Link -------------------------- */ $--link-color: $--color-primary-light-2 !default; $--link-hover-color: $--color-primary !default; /* Border -------------------------- */ $--border-width-base: 1px !default; $--border-style-base: solid !default; $--border-color-hover: $--color-text-placeholder !default; $--border-base: $--border-width-base $--border-style-base $--border-color-base !default; // Box-shadow /// boxShadow|1|Shadow|1 $--box-shadow-base: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04) !default; // boxShadow|1|Shadow|1 $--box-shadow-dark: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .12) !default; /// boxShadow|1|Shadow|1 $--box-shadow-light: 0 2px 12px 0 rgba(0, 0, 0, 0.1) !default; /* Fill -------------------------- */ $--fill-base: $--color-white !default; /* Typography -------------------------- */ $--font-color-disabled-base: #bbb !default; /* Disable base -------------------------- */ $--disabled-fill-base: $--background-color-base !default; $--disabled-color-base: $--color-text-placeholder !default; $--disabled-border-base: $--border-color-light !default; /* Button -------------------------- */ /// color||Color|0 $--button-primary-font-color: $--color-text-regular !default; /// color||Color|0 $--button-success-font-color: $--color-text-regular !default; /// color||Color|0 $--button-warning-font-color: $--color-text-regular !default; /// color||Color|0 $--button-danger-font-color: $--color-text-regular !default; /// color||Color|0 $--button-info-font-color: $--color-text-regular !default; /* Dropdown -------------------------- */ $--dropdown-menuItem-hover-fill: rgba($--color-primary, 0.1) !default; $--select-option-hover-background: rgba($--color-primary, 0.1) !default; .el-dialog__wrapper { background: rgba(0, 0, 0, 0.8); } .el-menu { & > .el-menu-item { &:not(.is-disabled):hover, &:not(.is-disabled):focus{ background-color: rgba($--color-primary, 0.1) !important; } } } .eagle-scheme__card { border-color: $border; background-color: inherit; } .eagle-detail__group-title, .eagle-form__group-title { border-color: $border; } .el-badge__content { color: $--color-black !important; }