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