1075 lines
19 KiB
Plaintext
1075 lines
19 KiB
Plaintext
// 重置样式
|
|
@import '~ant-design-vue/dist/antd.less'; // 引入官方提供的 less 样式入口文件
|
|
|
|
@modalBg: #022024;
|
|
@formInputBgColor: #03353f;
|
|
@formInputBorderColor: #0b8c82;
|
|
|
|
@primary-color: #1397a3;
|
|
@link-color: #1397a3;
|
|
@border-radius-base: 4px;
|
|
@text-color: #fff;
|
|
@btn-default-bg: #b98326;
|
|
@btn-default-border: #b98326;
|
|
|
|
@radio-button-bg: transparent;
|
|
@radio-button-checked-bg: transparent;
|
|
@radio-button-color: @btn-default-color;
|
|
|
|
@modal-footer-border-color-split: @formInputBorderColor;
|
|
|
|
@disabled-color: rgba(255, 255, 255, 0.25);
|
|
@background-color-base: darken(@primary-color, 20);
|
|
@border-color-base: darken(@primary-color, 20);
|
|
|
|
@text-color: #fff;
|
|
|
|
@component-background: @modalBg;
|
|
@heading-color: #fff;
|
|
|
|
@input-bg: @formInputBgColor;
|
|
@input-border-color: @formInputBorderColor;
|
|
|
|
@font-face {
|
|
font-family: MicrogrammaD-MediExte;
|
|
src: url(~@/assets/fonts/MicrogrammaDMedExt.ttf);
|
|
}
|
|
|
|
@font-face {
|
|
font-family: BookmanOldStyle;
|
|
src: url(~@/assets/fonts/BOOKOS.ttf);
|
|
}
|
|
|
|
body {
|
|
color: #fff;
|
|
font-family: Arial;
|
|
}
|
|
|
|
.ant-layout {
|
|
background: url(~@/assets/images/content/bg.jpg) center center no-repeat;
|
|
background-size: cover;
|
|
height: 100vh;
|
|
}
|
|
|
|
// 卡片样式
|
|
.ant-card {
|
|
background-color: transparent;
|
|
&-head {
|
|
padding: 0;
|
|
color: #fff;
|
|
}
|
|
&-body {
|
|
padding: 0;
|
|
}
|
|
}
|
|
|
|
// 表格样式
|
|
@table-border-radius-base: 0;
|
|
@table-padding-vertical-sm: 2px;
|
|
@table-padding-vertical: 6px;
|
|
@table-padding-horizontal: 8px;
|
|
@table-row-hover-bg: #0e505f;
|
|
|
|
.ant-table {
|
|
color: #ade6ee;
|
|
font-size: 16px;
|
|
border: 1px solid rgba(65, 111, 127, 0.5);
|
|
|
|
&-thead {
|
|
> tr {
|
|
th {
|
|
background-color: #126b82 !important;
|
|
color: #fff;
|
|
border-bottom: none;
|
|
}
|
|
}
|
|
}
|
|
&-tbody {
|
|
tr {
|
|
background-color: #06282a;
|
|
&:nth-child(2n) {
|
|
background-color: #08373a;
|
|
}
|
|
|
|
td {
|
|
padding: 10px 8px !important;
|
|
border-bottom: none;
|
|
}
|
|
|
|
&.ant-table-row-selected {
|
|
td {
|
|
background-color: #0d4e5c !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
&-placeholder {
|
|
background-color: @modalBg;
|
|
border-top: none;
|
|
border-bottom: none;
|
|
}
|
|
&-selected {
|
|
background-color: 0d4e5c;
|
|
}
|
|
|
|
&-row-expand-icon {
|
|
background-color: transparent;
|
|
border-color: @formInputBorderColor;
|
|
color: @formInputBorderColor;
|
|
}
|
|
|
|
&-small {
|
|
font-size: 14px;
|
|
|
|
.ant-table {
|
|
&-tbody {
|
|
tr td {
|
|
padding-top: 6px !important;
|
|
padding-bottom: 6px !important;
|
|
}
|
|
}
|
|
|
|
&-placeholder {
|
|
.ant-empty-image {
|
|
height: 60px;
|
|
}
|
|
|
|
.ant-empty-description {
|
|
font-size: 14px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// 表格下的分页器
|
|
.ant-table-pagination {
|
|
float: none !important;
|
|
text-align: center;
|
|
}
|
|
|
|
// 表单样式
|
|
@antFormSelector: .ant-form;
|
|
@{antFormSelector} {
|
|
&-item {
|
|
&-label {
|
|
> label {
|
|
color: #5b9cba;
|
|
}
|
|
}
|
|
&-children {
|
|
display: inline-block;
|
|
width: 100%;
|
|
}
|
|
&-required::before {
|
|
// display: none !important;
|
|
}
|
|
}
|
|
&-horizontal {
|
|
@{antFormSelector} {
|
|
&-item {
|
|
display: flex;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// 日期选择
|
|
.ant-calendar {
|
|
border-color: @formInputBorderColor;
|
|
border-radius: 0;
|
|
|
|
&,
|
|
&-time-picker-inner {
|
|
background-color: @modalBg;
|
|
}
|
|
&-time-picker {
|
|
background: none;
|
|
}
|
|
&-time-picker-combobox {
|
|
background-color: @modalBg !important;
|
|
border-color: @formInputBorderColor !important;
|
|
}
|
|
|
|
&-picker {
|
|
width: 100%;
|
|
&-container {
|
|
padding-top: 2px;
|
|
}
|
|
&-clear {
|
|
background-color: @formInputBgColor;
|
|
color: #00e9fe !important;
|
|
}
|
|
&-select {
|
|
background-color: @formInputBgColor !important;
|
|
}
|
|
}
|
|
|
|
&-input {
|
|
background-color: red;
|
|
&-wrap {
|
|
border-color: @formInputBorderColor;
|
|
height: 32px;
|
|
}
|
|
}
|
|
|
|
&-header,
|
|
&-footer {
|
|
border-color: @formInputBgColor;
|
|
}
|
|
|
|
&-year-select,
|
|
&-month-select,
|
|
&-day-select {
|
|
color: #fff !important;
|
|
}
|
|
|
|
&-time-picker {
|
|
&-select {
|
|
li {
|
|
&:hover {
|
|
background-color: @primary-color !important;
|
|
}
|
|
}
|
|
&-option-selected {
|
|
background-color: @primary-color !important;
|
|
color: #fff !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
&-month {
|
|
&-panel {
|
|
background-color: @modalBg;
|
|
&-header {
|
|
border-bottom: 1px solid @formInputBorderColor;
|
|
}
|
|
&-year-select-content {
|
|
color: #fff;
|
|
}
|
|
&-month {
|
|
&:hover {
|
|
color: #fff !important;
|
|
background-color: @primary-color;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
&-date {
|
|
&:hover {
|
|
background-color: @primary-color;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
&-selected-day {
|
|
.ant-calendar-date {
|
|
background-color: @primary-color;
|
|
}
|
|
}
|
|
&-today {
|
|
.ant-calendar-date {
|
|
color: #fff;
|
|
}
|
|
}
|
|
}
|
|
.ant-calendar-range .ant-calendar-in-range-cell::before {
|
|
background: #1397a3;
|
|
}
|
|
|
|
// 日历
|
|
.ant-fullcalendar {
|
|
border-spacing: 0;
|
|
&-column-header {
|
|
background-color: #126b82;
|
|
border-left: 1px solid #126b82 !important;
|
|
padding: 0 !important;
|
|
line-height: 34px;
|
|
&-inner {
|
|
text-align: center;
|
|
}
|
|
}
|
|
|
|
&-content {
|
|
margin-top: 10px;
|
|
height: 98px !important;
|
|
&::-webkit-scrollbar {
|
|
width: 4px !important;
|
|
}
|
|
}
|
|
|
|
&-date {
|
|
margin: 0 !important;
|
|
height: 159px !important;
|
|
border-top: none !important;
|
|
}
|
|
|
|
&-value {
|
|
font-size: 24px;
|
|
font-family: Arial;
|
|
color: #ade6ee !important;
|
|
}
|
|
|
|
&-last-month-cell,
|
|
&-next-month-btn-day {
|
|
.ant-fullcalendar-value {
|
|
color: rgba(173, 230, 238, 0.1) !important;
|
|
}
|
|
}
|
|
|
|
&-calendar-body {
|
|
padding: 0 !important;
|
|
}
|
|
|
|
&-cell {
|
|
border-top: 1px solid #25454e !important;
|
|
border-left: 1px solid #25454e !important;
|
|
&:last-child {
|
|
border-right: 1px solid #25454e !important;
|
|
}
|
|
}
|
|
|
|
&-table {
|
|
background-color: #06282a !important;
|
|
}
|
|
|
|
&-tbody {
|
|
border-bottom: 1px solid #25454e;
|
|
}
|
|
|
|
&-selected-day &-date,
|
|
&-date:hover {
|
|
background-color: #0b4f54 !important;
|
|
// background-color: #072f32 !important;
|
|
}
|
|
}
|
|
|
|
// 时间选择器
|
|
@time-picker-selected-bg: @primary-color;
|
|
@item-hover-bg: @primary-color;
|
|
.ant-time-picker {
|
|
width: 100%;
|
|
|
|
&-input {
|
|
border-radius: 0;
|
|
|
|
&::placeholder {
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
&-clear,
|
|
&-clock-icon {
|
|
color: #01b6e3 !important;
|
|
}
|
|
|
|
&-panel {
|
|
&-input {
|
|
background-color: transparent;
|
|
}
|
|
|
|
&-inner {
|
|
background-color: @modalBg;
|
|
border: 1px solid @formInputBorderColor;
|
|
border-radius: 0;
|
|
}
|
|
|
|
&-select li:focus {
|
|
color: #fff;
|
|
}
|
|
}
|
|
}
|
|
|
|
// 输入框样式
|
|
.ant-calendar-input {
|
|
background-color: transparent !important;
|
|
}
|
|
.ant-calendar-range-middle {
|
|
color: #fff;
|
|
}
|
|
.ant-input {
|
|
border-radius: 0;
|
|
color: #fff;
|
|
&::placeholder {
|
|
color: #fff;
|
|
}
|
|
&:focus {
|
|
box-shadow: none;
|
|
}
|
|
&-number {
|
|
background-color: transparent;
|
|
}
|
|
&-group {
|
|
&-addon {
|
|
background-color: transparent;
|
|
}
|
|
}
|
|
&-clear-icon {
|
|
color: #00e9fe !important;
|
|
}
|
|
&:focus {
|
|
box-shadow: none !important;
|
|
}
|
|
&:disabled {
|
|
color: #fff;
|
|
}
|
|
|
|
&-search-icon {
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
// 数字输入框
|
|
@input-number-handler-active-bg: #06404c;
|
|
@input-number-handler-hover-bg: #06404c;
|
|
@input-number-handler-bg: #06404c;
|
|
@input-number-handler-border-color: transparent;
|
|
|
|
.ant-input-number {
|
|
border-radius: 0;
|
|
border: 1px solid #0b8c82;
|
|
&-handler {
|
|
height: 50% !important;
|
|
&:hover {
|
|
height: 50% !important;
|
|
}
|
|
|
|
.anticon {
|
|
display: none !important;
|
|
}
|
|
|
|
// 数组输入框右侧的上下箭头
|
|
&::after {
|
|
content: '';
|
|
display: inline-block;
|
|
width: 0;
|
|
height: 0;
|
|
border: 5px solid transparent;
|
|
border-left-width: 4px;
|
|
border-right-width: 4px;
|
|
border-bottom-color: #4b859e;
|
|
position: absolute;
|
|
bottom: 2px;
|
|
right: 50%;
|
|
transform: translateX(4px);
|
|
}
|
|
|
|
&-down {
|
|
border-top: none;
|
|
&::after {
|
|
transform: translateX(4px) rotate(180deg);
|
|
top: 2px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
input[type='number']::-webkit-inner-spin-button,
|
|
input[type='number']::-webkit-outer-spin-button {
|
|
-webkit-appearance: none;
|
|
appearance: none;
|
|
margin: 0;
|
|
}
|
|
|
|
// 单选样式
|
|
.ant-radio {
|
|
&-wrapper {
|
|
color: #fff;
|
|
}
|
|
&-button-wrapper {
|
|
color: @primary-color;
|
|
}
|
|
}
|
|
|
|
.ant-upload {
|
|
&-select-picture-card {
|
|
background-color: transparent !important;
|
|
}
|
|
}
|
|
|
|
@checkboxSelector: .ant-checkbox;
|
|
@{checkboxSelector} {
|
|
&-inner {
|
|
background-color: #03353f;
|
|
border-radius: 0;
|
|
border-color: #0a544e;
|
|
}
|
|
&-checked {
|
|
@{checkboxSelector} {
|
|
&-inner {
|
|
background-color: #00e9fe;
|
|
&::after {
|
|
border-color: #000 !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// 下拉框样式
|
|
@select-dropdown-bg: #03353f;
|
|
.ant-select {
|
|
color: #fff !important;
|
|
&-selection {
|
|
background-color: @formInputBgColor !important;
|
|
border-color: @formInputBorderColor !important;
|
|
border-radius: 0;
|
|
box-shadow: none !important;
|
|
&__placeholder {
|
|
color: #fff !important;
|
|
}
|
|
|
|
&--multiple {
|
|
.ant-select-selection__choice {
|
|
background: transparent;
|
|
color: #fff;
|
|
border: 1px solid #0b8c82;
|
|
&__remove {
|
|
color: #fff !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
&-dropdown {
|
|
padding-top: 7px;
|
|
background-color: transparent;
|
|
|
|
@borderColor: #0da397;
|
|
&:not(.ant-select-tree-dropdown) {
|
|
.ant-select-dropdown-content {
|
|
border: 1px solid @borderColor;
|
|
overflow: visible !important;
|
|
&::before {
|
|
position: absolute;
|
|
top: -6px;
|
|
left: 20px;
|
|
content: '';
|
|
width: 12px;
|
|
height: 12px;
|
|
border: 1px solid #0da397;
|
|
background: #03353f;
|
|
transform: rotate(45deg) skew(14deg, 14deg);
|
|
}
|
|
}
|
|
|
|
&.ant-select-dropdown-placement-topLeft {
|
|
padding-top: 0;
|
|
padding-bottom: 7px;
|
|
|
|
.ant-select-dropdown-content {
|
|
&::before {
|
|
top: auto;
|
|
bottom: -6px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
&-menu {
|
|
background: #03353f;
|
|
padding: 0;
|
|
position: relative;
|
|
&-item {
|
|
color: #fff;
|
|
font-family: Arial;
|
|
border: 0;
|
|
background-color: transparent !important;
|
|
padding: 4px 14px;
|
|
&:hover {
|
|
background-color: #055565 !important;
|
|
}
|
|
&-selected {
|
|
color: #0cebc9;
|
|
font-weight: normal;
|
|
}
|
|
&-disabled {
|
|
color: #476d74 !important;
|
|
&:hover {
|
|
background-color: transparent !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
&--multiple {
|
|
// 多选
|
|
color: #000;
|
|
.ant-select-dropdown {
|
|
&-menu-item {
|
|
padding-left: 35px;
|
|
.anticon-check {
|
|
width: 16px;
|
|
height: 16px;
|
|
line-height: 18px;
|
|
left: 13px;
|
|
border: 1px solid #0a544e !important;
|
|
color: transparent !important;
|
|
background-color: #03353f;
|
|
}
|
|
&-selected {
|
|
.anticon-check {
|
|
background: #00e9fe;
|
|
border-color: #00e9fe;
|
|
color: #000 !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// 下拉框打开时的样式
|
|
&-open {
|
|
.ant-select {
|
|
&-selection {
|
|
background-color: #055565 !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
&-clear-icon {
|
|
color: #00e9fe !important;
|
|
background-color: #03353f !important;
|
|
}
|
|
&-open {
|
|
.ant-select-clear-icon {
|
|
background-color: #055565 !important;
|
|
}
|
|
}
|
|
}
|
|
.ant-select-selection--multiple .ant-select-selection__choice {
|
|
max-width: 60%;
|
|
}
|
|
|
|
// 下拉菜单
|
|
.ant-dropdown {
|
|
&-menu {
|
|
background: #03353f;
|
|
padding: 0;
|
|
position: relative;
|
|
&-item {
|
|
color: #fff;
|
|
font-family: Arial;
|
|
border: 0;
|
|
background-color: transparent !important;
|
|
padding: 4px 14px;
|
|
&:hover {
|
|
background-color: #055565 !important;
|
|
}
|
|
&-selected {
|
|
color: #0cebc9;
|
|
font-weight: normal;
|
|
}
|
|
&-disabled {
|
|
color: #476d74 !important;
|
|
&:hover {
|
|
background-color: transparent !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// 树形下拉样式
|
|
.ant-select-tree {
|
|
color: #fff !important;
|
|
.ant-select-tree-node-content-wrapper {
|
|
color: #fff !important;
|
|
background-color: transparent !important;
|
|
&:hover {
|
|
background-color: #055565 !important;
|
|
}
|
|
&-selected {
|
|
color: #0cebc9;
|
|
font-weight: normal;
|
|
}
|
|
&-disabled {
|
|
color: #476d74 !important;
|
|
&:hover {
|
|
background-color: transparent !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// 树形结构
|
|
.ant-tree {
|
|
&-checkbox {
|
|
&-checked {
|
|
.ant-tree-checkbox-inner {
|
|
background-color: #00e9fe !important;
|
|
border-color: #00e9fe !important;
|
|
}
|
|
}
|
|
}
|
|
&-checkbox-inner {
|
|
background-color: #03353f !important;
|
|
border-color: #0a544e !important;
|
|
border-radius: 0;
|
|
&::after {
|
|
border-color: #000 !important;
|
|
}
|
|
}
|
|
&-node-content-wrapper {
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
&-treenode-disabled {
|
|
.ant-tree-checkbox-inner {
|
|
border-color: #0a544e !important;
|
|
}
|
|
.ant-tree-checkbox-disabled {
|
|
.ant-tree-checkbox-inner {
|
|
&::after {
|
|
border-color: rgba(0, 0, 0, 0.3) !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
&-node-selected {
|
|
.ant-tree-title {
|
|
color: #0cebc9 !important;
|
|
}
|
|
}
|
|
|
|
&-title {
|
|
user-select: none;
|
|
color: #ade6ee !important;
|
|
}
|
|
}
|
|
|
|
// 按钮
|
|
.ant-btn {
|
|
border-radius: 0;
|
|
font-family: Arial;
|
|
span {
|
|
text-shadow: 0px 1px 0px #000;
|
|
font-size: 16px;
|
|
}
|
|
|
|
&-success {
|
|
// 自定义warn样式
|
|
background-color: #08a7cf !important;
|
|
color: #fff !important;
|
|
border-color: #08a7cf !important;
|
|
&:hover {
|
|
background-color: #08a7cf !important;
|
|
}
|
|
}
|
|
|
|
&-warn {
|
|
// 自定义warn样式
|
|
background-color: #b98326 !important;
|
|
color: #fff !important;
|
|
border-color: #b98326 !important;
|
|
&:hover {
|
|
background-color: #b98326 !important;
|
|
}
|
|
}
|
|
|
|
&-grey {
|
|
// 自定义warn样式
|
|
background-color: #406979 !important;
|
|
color: #fff !important;
|
|
border-color: #406979 !important;
|
|
&:hover {
|
|
background-color: #406979 !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
// 空状态
|
|
.ant-empty {
|
|
background-color: transparent;
|
|
color: #145b5c;
|
|
}
|
|
|
|
// 分页器样式
|
|
.ant-pagination {
|
|
&,
|
|
&-item a {
|
|
color: #ade6ee;
|
|
}
|
|
|
|
&-item {
|
|
min-width: 26px;
|
|
height: 26px !important;
|
|
line-height: 26px !important;
|
|
border-radius: 13px;
|
|
&-active {
|
|
background-color: #00bded;
|
|
a {
|
|
color: #fff !important;
|
|
}
|
|
}
|
|
&-ellipsis {
|
|
color: #ade6ee !important;
|
|
}
|
|
}
|
|
|
|
.ant-pagination-item-link {
|
|
color: #00bded;
|
|
}
|
|
&-disabled {
|
|
.ant-pagination-item-link {
|
|
color: #9ca2a6 !important;
|
|
}
|
|
}
|
|
|
|
.ant-select {
|
|
&-selection {
|
|
border: none;
|
|
box-shadow: none;
|
|
background-color: transparent !important;
|
|
color: #ade6ee;
|
|
&-selected-value {
|
|
height: 26px;
|
|
line-height: 26px;
|
|
}
|
|
.ant-select-arrow {
|
|
display: none;
|
|
}
|
|
}
|
|
.ant-select-selection__rendered::after {
|
|
content: '';
|
|
margin-left: 18px;
|
|
border: 6px solid transparent;
|
|
border-top-width: 8px;
|
|
border-bottom-width: 8px;
|
|
border-top-color: #00bded;
|
|
visibility: visible;
|
|
transform: translateY(8px);
|
|
transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
transform-origin: 50% 25%;
|
|
}
|
|
&-open {
|
|
.ant-select-selection__rendered::after {
|
|
transform: translateY(6px) rotate(180deg);
|
|
}
|
|
}
|
|
}
|
|
|
|
&-options {
|
|
&-quick-jumper {
|
|
input {
|
|
background-color: #011927;
|
|
border: 1px solid #00cbfe;
|
|
width: 70px !important;
|
|
border-radius: 0;
|
|
color: #ade6ee;
|
|
text-align: center;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// 弹窗样式
|
|
.ant-modal {
|
|
&-content {
|
|
border-radius: 0;
|
|
border: 1px solid #0c6a66;
|
|
background-color: @modalBg;
|
|
}
|
|
&-header {
|
|
background-color: #0c817b;
|
|
padding: 0 20px;
|
|
border-radius: 0;
|
|
border-bottom: none;
|
|
}
|
|
&-title {
|
|
font-family: MicrogrammaD-MediExte;
|
|
font-weight: bold;
|
|
color: #fff;
|
|
height: 40px;
|
|
line-height: 40px;
|
|
}
|
|
&-close {
|
|
color: #fff !important;
|
|
&-x {
|
|
width: 40px;
|
|
height: 40px;
|
|
line-height: 40px;
|
|
}
|
|
}
|
|
&-body {
|
|
padding-bottom: 22px;
|
|
}
|
|
}
|
|
|
|
// 确认弹窗样式
|
|
.ant-modal-confirm {
|
|
&-title,
|
|
&-content {
|
|
color: #fff !important;
|
|
}
|
|
}
|
|
|
|
// 通知样式
|
|
.ant-message {
|
|
&-notice {
|
|
&-content {
|
|
border: 1px solid @formInputBorderColor;
|
|
background-color: @modalBg;
|
|
border-radius: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
.ant-notification {
|
|
&-notice {
|
|
background-color: @modalBg;
|
|
&-message {
|
|
color: #fff;
|
|
}
|
|
&-close {
|
|
color: #fff !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
// 抽屉
|
|
.ant-drawer {
|
|
&-header {
|
|
background-color: @modalBg;
|
|
border-bottom-color: @formInputBorderColor;
|
|
}
|
|
&-title,
|
|
&-close {
|
|
color: #fff !important;
|
|
}
|
|
&-content {
|
|
background-color: @modalBg;
|
|
}
|
|
&-body {
|
|
> div {
|
|
background-color: @modalBg !important;
|
|
border: none !important;
|
|
}
|
|
|
|
.drawer-bootom-button {
|
|
border-top: 1px solid #0b8c82 !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
// 警告提示
|
|
.ant-alert {
|
|
&-info {
|
|
background-color: @modalBg;
|
|
}
|
|
}
|
|
|
|
.ant-popover {
|
|
&-inner {
|
|
background-color: #03353f;
|
|
}
|
|
&-arrow {
|
|
border-left-color: #03353f !important;
|
|
border-top-color: #03353f !important;
|
|
z-index: -1;
|
|
}
|
|
}
|
|
|
|
// 滚动条
|
|
::-webkit-scrollbar {
|
|
width: 6px;
|
|
height: 6px;
|
|
background-color: #15494c !important;
|
|
}
|
|
|
|
// 穿梭框样式
|
|
.ant-transfer {
|
|
&-list {
|
|
border-radius: 0;
|
|
border-color: #224852;
|
|
&-header {
|
|
background-color: #08363c;
|
|
border-radius: 0;
|
|
border-bottom-color: #224852;
|
|
}
|
|
&-body {
|
|
overflow: auto;
|
|
}
|
|
}
|
|
&-operation {
|
|
.ant-btn {
|
|
background-color: #1397a3;
|
|
border: none;
|
|
border-radius: 0;
|
|
color: #fff;
|
|
&:disabled {
|
|
background-color: #4f7578;
|
|
color: #fff;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.ant-divider {
|
|
background-color: @formInputBorderColor;
|
|
}
|
|
|
|
.ant-spin {
|
|
&-blur::after {
|
|
opacity: 0.1;
|
|
}
|
|
}
|
|
|
|
.ant-popover {
|
|
&-arrow {
|
|
border-right-color: @formInputBgColor !important;
|
|
border-bottom-color: @formInputBgColor !important;
|
|
}
|
|
}
|
|
|
|
// collapse
|
|
@collapse-panel-border-radius: 0;
|
|
@collapse-header-padding: 0;
|
|
@collapse-header-bg: transparent;
|
|
@collapse-header-padding-extra: 20px;
|
|
@collapse-content-padding: 0;
|
|
@collapse-content-bg: transparent;
|
|
.ant-collapse {
|
|
border: none;
|
|
|
|
> .ant-collapse-item {
|
|
border-bottom: none;
|
|
}
|
|
|
|
&-content {
|
|
border-top: none;
|
|
}
|
|
}
|
|
|
|
#userLayout {
|
|
.container {
|
|
background-color: @modalBg !important;
|
|
.title {
|
|
color: #fff !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
background-color: #15494c !important;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
background-color: #007f9a !important;
|
|
}
|
|
|
|
::-webkit-scrollbar-button {
|
|
background-color: #15494c !important;
|
|
display: none;
|
|
}
|
|
|
|
::-webkit-scrollbar-track-piece {
|
|
background-color: #15494c !important;
|
|
}
|
|
|
|
::-webkit-scrollbar-corner {
|
|
background-color: #15494c;
|
|
}
|