Files
lc_frontend/src/styles/avueTable.scss

173 lines
3.5 KiB
SCSS
Raw Normal View History

2025-10-17 10:31:13 +08:00
// 优化一些默认的表格样式 通用
.avue-crud__search {
.avue-form__menu--left {
padding-left: 20px !important;
box-sizing: border-box;
}
.el-form-item > .el-form-item__content > div > div > div:not(.avue-input-tag) {
display: flex;
flex-direction: column;
}
}
.low-select-radio {
padding: 0 5px;
.el-radio__label {
display: none;
}
}
//优化暗色模式下表格样式
.dark {
.avue-crud {
.avue-crud__header {
background-color: transparent;
}
.el-table__header-wrapper {
.el-table__cell {
background-color: var(--el-table-header-bg-color);
color: var(--el-table-header-text-color);
}
}
.avue-crud__tip {
background-color: var(--el-fill-color-lighter);
border-color: var(--el-border-color);
box-sizing: border-box;
}
.avue-crud__pagination {
background-color: transparent;
}
}
.avue-dialog {
.el-dialog__title,
.el-drawer__title {
color: var(--el-text-color-primary);
}
.el-dialog__header,
.el-drawer__header {
border-color: var(--el-border-color-dark);
.el-dialog__close,
.el-drawer__close {
color: var(--el-text-color-regular);
}
}
.avue-dialog__footer,
.avue-drawer__footer {
background-color: var(--el-bg-color);
border-color: var(--el-border-color-dark);
}
}
}
//修改默认的卡片模式样式
.avue-crud__grid {
.title .avue-crud__grid__value {
font-size: 14px;
font-weight: 500;
line-height: 24px;
}
.title .avue-crud__grid__label {
display: initial;
}
.avue-crud__grid__label {
font-size: 14px;
}
.avue-crud__grid__value {
font-size: 14px;
}
.avue-crud__grid__content {
padding: 16px 16px 0 16px;
background: var(--el-card-bg-color) !important;
border: 1px solid var(--el-card-border-color);
border-radius: 4px;
.avue-crud__grid__item {
line-height: 24px;
&.title {
width: 50%;
margin-bottom: 3px;
&.row {
width: 100%;
}
}
&.menu {
// border-top: 1px solid var(--el-card-border-color);
margin: 16px 0 0 0;
padding: 4px 0px;
}
}
&::before {
content: '';
position: absolute;
left: 0;
bottom: 40px;
width: 100%;
height: 1px;
background: var(--el-card-border-color);
}
}
.menu .el-button {
font-size: 14px;
}
}
.low-table-grid {
@for $i from 1 through 12 {
&__#{$i} {
.el-checkbox-group > .el-row > .el-col {
&:nth-child(#{$i}n) {
padding-right: 0;
}
&:nth-child(-n + #{$i}) {
padding-top: 0;
}
}
}
}
&.no-menu {
.avue-crud__grid__content {
padding-bottom: 10px;
&::before {
display: none;
}
}
}
//表格 单选
.lowSelectRadio {
width: inherit;
position: absolute;
right: -5px;
top: -4px;
.avue-crud__grid__label {
display: none;
}
}
}
//处理弹窗表单部分样式
.low-table__dialog {
.avue-form.avue--detail {
.el-form-item__content {
div[labelclassname='low-header__text_input'],
div[labelclassname='low-header__text_password'] {
display: flex;
flex-direction: column;
}
}
}
}
.avue-crud__left {
flex: 1;
min-width: 0;
display: flex;
flex-wrap: nowrap;
overflow-x: auto;
}
.avue-crud__right {
padding-left: 20px;
flex: 0 0 auto;
width: auto !important;
}