MaxKB/ui/src/styles/element-plus.scss
2023-12-08 12:42:40 +08:00

209 lines
3.7 KiB
SCSS

:root {
--el-color-primary: #3370ff;
--el-color-primary-light-9: rgba(51, 112, 255, 0.1);
--el-menu-item-height: 45px;
--el-box-shadow-light: 0px 2px 4px 0px rgba(31, 35, 41, 0.12);
--el-border-color: #dee0e3;
}
.el-button {
padding: 5px 12px;
&.is-text {
padding: 4px !important;
font-size: 16px;
max-height: 24px;
&:not(.is-disabled):hover {
background: var(--app-text-color-light-1);
}
}
}
.el-avatar {
--el-avatar-bg-color: var(--el-color-primary);
--el-avatar-size-small: 33px;
--el-avatar-border-radius: 6px;
cursor: pointer;
}
.el-form {
--el-form-inline-content-width: 100%;
}
.el-dialog {
--el-dialog-title-font-size: 16px;
.dialog-sub-title {
color: var(--el-text-color-regular);
margin: 5px 0;
}
.el-dialog__body {
padding: 15px var(--el-dialog-padding-primary) 10px !important;
}
}
.el-message-box {
--el-messagebox-font-size: 16px;
padding: 24px;
.el-message-box__header {
padding: 0;
}
}
.el-message-box__content {
padding: 24px 0;
color: var(--app-text-color);
font-weight: 400;
}
.el-message-box__btns {
padding: 0;
button {
min-width: 80px;
&:nth-child(2) {
margin-left: 12px;
}
}
button.danger {
background: var(--el-color-danger);
border: var(--el-color-danger);
color: #ffffff;
}
}
.el-message-box__headerbtn {
right: -5px;
top: -5px;
.el-message-box__close {
font-size: 20px;
}
}
.el-card {
--el-card-padding: calc(var(--app-base-px) * 2);
}
.el-dropdown {
color: var(--app-text-color);
}
.el-dropdown-menu__item {
color: var(--app-text-color);
font-weight: 400;
padding: 5px 11px;
&:not(.is-disabled):focus {
background-color: var(--app-text-color-light-1);
color: var(--app-text-color);
}
}
.el-tag {
--el-tag-border-radius: 2px;
height: 22px;
padding: 0 6px;
}
.el-table {
--el-table-header-bg-color: var(--app-layout-bg-color);
--el-table-text-color: var(--app-text-color);
font-weight: 400;
thead {
color: var(--app-text-color-secondary);
th {
font-weight: 500;
}
}
th.el-table__cell {
border-top: var(--el-table-border);
}
.el-table__cell {
padding: 12px 0;
}
.el-checkbox {
height: 23px;
}
tr.hightlight {
background: var(--el-table-current-row-bg-color);
}
}
.el-pagination .el-select .el-input {
width: 100px;
}
/* el-steps */
.el-step__icon {
background: none;
}
.el-step__head.is-process {
.el-step__icon {
&.is-text {
color: #ffffff;
border-color: var(--el-color-primary) !important;
background: var(--el-color-primary) !important;
}
}
}
.el-text {
font-weight: 400;
&.el-text--info {
color: var(--app-text-color-secondary);
}
}
.el-switch {
height: auto;
}
.el-slider {
--el-slider-button-size: 14px;
--el-slider-height: 4px;
}
.el-slider__button {
border: solid 1px var(--app-border-color-dark);
&.hover {
border: solid 2px var(--el-slider-main-bg-color);
}
}
.el-slider__runway.show-input {
margin-right: calc(var(--app-base-px) + 4px);
}
.el-slider__input {
width: 60px;
}
.input-with-select {
.el-input-group__prepend {
background-color: var(--el-fill-color-blank);
}
}
.el-textarea__inner {
font-size: 13px;
}
.el-input__inner {
font-size: 13px;
}
.el-select-group .el-select-dropdown__item {
padding-left: 11px;
}
.el-tabs__header {
margin: 0 0 12px;
}
.el-drawer {
.el-drawer__header {
padding: 16px 24px;
margin: 0;
border-bottom: 1px solid var(--el-border-color);
color: var(--app-text-color);
}
.el-drawer__footer {
border-top: 1px solid var(--el-border-color);
padding: 16px 24px;
}
}
.el-cascader-node {
padding-left: 2px;
}
.el-cascader-node__prefix {
right: 10px;
left: auto;
}