feat: 调整类型&修复全局样式
parent
561cfa7cce
commit
5eaa4ad00e
@ -0,0 +1,250 @@
|
|||||||
|
// 覆盖 ElementPlus 的主色变量
|
||||||
|
|
||||||
|
// $--color-primary: #ff6600; // 设置主色为橙色
|
||||||
|
// $--el-color-primary: red;
|
||||||
|
/* 自定义 Element Plus 变量 */
|
||||||
|
@forward "element-plus/theme-chalk/src/common/var.scss" with (
|
||||||
|
$colors: (
|
||||||
|
"primary": (
|
||||||
|
"base": #2de6ff,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
$select-dropdown: (
|
||||||
|
"background-color": transparent,
|
||||||
|
)
|
||||||
|
// $el-pagination: (
|
||||||
|
// --el-pagination-button-height-small: 24px;
|
||||||
|
// )
|
||||||
|
);
|
||||||
|
|
||||||
|
/* 引入 Element Plus 样式 */
|
||||||
|
@use "element-plus/theme-chalk/src/index.scss" as *;
|
||||||
|
|
||||||
|
.el-button.is-text:not(.is-disabled):hover {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-button.is-text:not(.is-disabled):hover {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-button:hover {
|
||||||
|
color: white;
|
||||||
|
background-color: transparent;
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 表格 */
|
||||||
|
.ds_table {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
/* 分页栏 */
|
||||||
|
.fixed_pagination {
|
||||||
|
// width: calc(100% - 136px);
|
||||||
|
// background-color: white;
|
||||||
|
// z-index: 9;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: flex-end;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
.noneFixed_pagination {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: flex-end;
|
||||||
|
padding: 20px 0;
|
||||||
|
}
|
||||||
|
.el-select--small .el-select__wrapper {
|
||||||
|
min-height: 28px;
|
||||||
|
line-height: 24px;
|
||||||
|
}
|
||||||
|
.el-pagination {
|
||||||
|
button {
|
||||||
|
background-color: transparent;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
button:disabled,
|
||||||
|
button.is-disabled {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-pagination--small .btn-prev,
|
||||||
|
.el-pagination--small .btn-next,
|
||||||
|
.el-pagination--small .el-pager li {
|
||||||
|
height: 28px;
|
||||||
|
line-height: 28px;
|
||||||
|
min-width: 28px;
|
||||||
|
}
|
||||||
|
.el-select__placeholder {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
.el-select--small .el-select__wrapper {
|
||||||
|
width: 92px;
|
||||||
|
}
|
||||||
|
.el-select--small .el-select__wrapper {
|
||||||
|
padding: 2px 15px;
|
||||||
|
}
|
||||||
|
.el-pagination__jump {
|
||||||
|
color: white;
|
||||||
|
.el-input {
|
||||||
|
width: 40px;
|
||||||
|
height: 28px;
|
||||||
|
}
|
||||||
|
.el-input__wrapper {
|
||||||
|
background-color: transparent;
|
||||||
|
|
||||||
|
.el-input__inner {
|
||||||
|
color: white;
|
||||||
|
line-height: 24px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-pager li {
|
||||||
|
background-color: transparent;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 下拉选择 */
|
||||||
|
.custom-select {
|
||||||
|
width: 150px;
|
||||||
|
background-color: #032b5c; /* 自定义背景色 */
|
||||||
|
border: none; /* 可选：去掉边框 */
|
||||||
|
.el-select__selected-item {
|
||||||
|
color: white; /* 文字颜色 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-select__wrapper {
|
||||||
|
background: rgba(74, 126, 191, 0.1); /* 下拉框背景色 */
|
||||||
|
border: none !important; /* 边框 */
|
||||||
|
color: white; /* 文字颜色 */
|
||||||
|
height: 32px;
|
||||||
|
box-shadow: none;
|
||||||
|
|
||||||
|
&::placeholder {
|
||||||
|
color: rgba(255, 255, 255, 0.6); /* 占位符颜色 */
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-select__wrapper {
|
||||||
|
min-height: 32px;
|
||||||
|
line-height: 32px;
|
||||||
|
box-shadow: 0 0 0 0 !important;
|
||||||
|
}
|
||||||
|
.el-select__arrow {
|
||||||
|
color: rgba(255, 255, 255, 0.6); /* 下拉箭头颜色 */
|
||||||
|
}
|
||||||
|
&:hover .el-select__inner {
|
||||||
|
border-color: transparent; /* 悬停边框颜色 */
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.custom-input {
|
||||||
|
width: 150px;
|
||||||
|
background-color: #032b5c; /* 自定义背景色 */
|
||||||
|
border: none; /* 可选：去掉边框 */
|
||||||
|
|
||||||
|
.el-input__wrapper {
|
||||||
|
background: rgba(74, 126, 191, 0.1); /* 下拉框背景色 */
|
||||||
|
border: none; /* 边框 */
|
||||||
|
color: white; /* 文字颜色 */
|
||||||
|
height: 32px;
|
||||||
|
box-shadow: none;
|
||||||
|
&::placeholder {
|
||||||
|
color: rgba(255, 255, 255, 0.6); /* 占位符颜色 */
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-input__inner {
|
||||||
|
color: white; /* 文字颜色 */
|
||||||
|
height: 32px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 修改下拉菜单背景色 */
|
||||||
|
.el-select-dropdown {
|
||||||
|
background-color: #032b5c; /* 下拉菜单背景 */
|
||||||
|
border: none; /* 可选：去掉下拉框边框 */
|
||||||
|
border: 1px solid #032b5c;
|
||||||
|
box-shadow: none; /* 可选：去掉阴影 */
|
||||||
|
}
|
||||||
|
/* 修改普通选项文字颜色 */
|
||||||
|
.el-select-dropdown__item {
|
||||||
|
color: white; /* 下拉选项文字颜色 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-select-dropdown__item.is-hovering {
|
||||||
|
background-color: #0c4eac;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* table */
|
||||||
|
.table_action_box {
|
||||||
|
.el-button {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table--border .el-table__inner-wrapper::after,
|
||||||
|
.el-table--border::after,
|
||||||
|
.el-table--border::before,
|
||||||
|
.el-table__inner-wrapper::before {
|
||||||
|
background-color: transparent !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 分页 */
|
||||||
|
.el-pagination {
|
||||||
|
.el-pagination__total {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
.el-select {
|
||||||
|
background-color: transparent; /* 自定义背景色 */
|
||||||
|
border: none; /* 可选：去掉边框 */
|
||||||
|
}
|
||||||
|
.el-select__wrapper {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 按钮 */
|
||||||
|
.basic-btn {
|
||||||
|
height: 32px;
|
||||||
|
width: 76px;
|
||||||
|
margin: 0;
|
||||||
|
&.el-button {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.query-btn {
|
||||||
|
background: linear-gradient(180deg, #2589ff 0%, #46a9ed 100%);
|
||||||
|
border: 1px solid #42a5f5;
|
||||||
|
border-radius: 2px;
|
||||||
|
color: white;
|
||||||
|
margin-left: 0;
|
||||||
|
& .icon {
|
||||||
|
width: 14px;
|
||||||
|
height: 14px;
|
||||||
|
background-image: url("@/assets/common/search_icon.png");
|
||||||
|
background-size: contain;
|
||||||
|
background-position: center;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
margin-right: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.reset-btn {
|
||||||
|
background: transparent;
|
||||||
|
border-radius: 2px;
|
||||||
|
border: 1px solid #088bd6;
|
||||||
|
color: white;
|
||||||
|
box-shadow: none;
|
||||||
|
& .icon {
|
||||||
|
width: 14px;
|
||||||
|
height: 14px;
|
||||||
|
background-image: url("@/assets/common/reset_icon.png");
|
||||||
|
background-size: contain;
|
||||||
|
background-position: center;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
margin-right: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue