// cover some element-ui styles
|
|
.el-breadcrumb__inner,
|
.el-breadcrumb__inner a {
|
font-weight: 400 !important;
|
}
|
|
.el-upload {
|
input[type="file"] {
|
display: none !important;
|
}
|
}
|
|
.el-upload__input {
|
display: none;
|
}
|
|
.cell {
|
.el-tag {
|
margin-right: 0px;
|
}
|
}
|
|
.small-padding {
|
.cell {
|
padding-left: 5px;
|
padding-right: 5px;
|
}
|
}
|
|
.fixed-width {
|
.el-button--mini {
|
padding: 7px 10px;
|
width: 60px;
|
}
|
}
|
|
.status-col {
|
.cell {
|
padding: 0 10px;
|
text-align: center;
|
|
.el-tag {
|
margin-right: 0px;
|
}
|
}
|
}
|
|
// to fixed https://github.com/ElemeFE/element/issues/2461
|
.el-dialog {
|
transform: none;
|
left: 0;
|
position: relative;
|
margin: 0 auto;
|
border-radius: 24px;
|
padding: 0 !important;
|
border: 1px solid var(--surface-border);
|
box-shadow: var(--shadow-md);
|
background: rgba(255, 255, 255, 0.96);
|
}
|
.el-dialog__header {
|
background: linear-gradient(180deg, rgba(247, 250, 248, 0.98), rgba(242, 247, 244, 0.88));
|
padding: 18px 24px 14px;
|
border-bottom: 1px solid var(--surface-border);
|
border-radius: 24px 24px 0 0;
|
}
|
.el-dialog__title {
|
font-weight: 600;
|
font-size: 17px;
|
color: var(--text-primary);
|
}
|
.el-dialog__body {
|
padding: 24px 24px 0;
|
max-height: 74vh;
|
overflow-y: auto;
|
}
|
.el-dialog__footer {
|
text-align: center;
|
padding: 18px 24px 24px;
|
}
|
.el-message-box {
|
padding: 0 !important;
|
border-radius: 22px;
|
border: 1px solid var(--surface-border);
|
box-shadow: var(--shadow-md);
|
}
|
.el-message-box__header {
|
background: linear-gradient(180deg, rgba(247, 250, 248, 0.98), rgba(242, 247, 244, 0.88));
|
padding: 18px 24px 14px;
|
border-bottom: 1px solid var(--surface-border);
|
border-radius: 22px 22px 0 0;
|
}
|
.el-message-box__title {
|
font-weight: 600;
|
font-size: 17px;
|
color: var(--text-primary);
|
}
|
.el-message-box__content {
|
padding: 24px 24px 0;
|
}
|
.el-message-box__container {
|
justify-content: center;
|
}
|
.el-message-box__btns {
|
text-align: center;
|
padding: 16px;
|
display: flex;
|
flex-direction: row-reverse;
|
justify-content: center;
|
align-items: center;
|
.el-button--primary {
|
margin-right: 12px;
|
}
|
}
|
.el-table__expanded-cell {
|
padding: 0 !important;
|
.el-table__header-wrapper {
|
background-color: var(--surface-soft) !important;
|
}
|
}
|
|
// refine element ui upload
|
.upload-container {
|
.el-upload {
|
width: 100%;
|
|
.el-upload-dragger {
|
width: 100%;
|
height: 200px;
|
}
|
}
|
}
|
|
// dropdown
|
.el-dropdown-menu {
|
a {
|
display: block;
|
}
|
}
|
|
// fix date-picker ui bug in filter-item
|
.el-range-editor.el-input__inner {
|
display: inline-flex !important;
|
}
|
|
// to fix el-date-picker css style
|
.el-range-separator {
|
box-sizing: content-box;
|
}
|
|
.el-menu--collapse
|
> div
|
> .el-submenu
|
> .el-submenu__title
|
.el-submenu__icon-arrow {
|
display: none;
|
}
|
|
.el-dropdown .el-dropdown-link {
|
color: var(--el-color-primary) !important;
|
}
|
|
.el-button {
|
border-radius: 12px;
|
font-weight: 600;
|
box-shadow: none !important;
|
}
|
|
.el-button--primary {
|
--el-button-bg-color: var(--el-color-primary);
|
--el-button-border-color: var(--el-color-primary);
|
--el-button-hover-bg-color: var(--el-color-primary-light-3);
|
--el-button-hover-border-color: var(--el-color-primary-light-3);
|
--el-button-active-bg-color: var(--el-color-primary-dark-2);
|
--el-button-active-border-color: var(--el-color-primary-dark-2);
|
}
|
|
.el-input__wrapper,
|
.el-textarea__inner,
|
.el-select__wrapper,
|
.el-date-editor.el-input__wrapper,
|
.el-date-editor .el-input__wrapper {
|
border-radius: 12px;
|
box-shadow: 0 0 0 1px rgba(216, 225, 219, 0.92) inset !important;
|
background: rgba(255, 255, 255, 0.9);
|
}
|
|
.el-input__wrapper.is-focus,
|
.el-select__wrapper.is-focused,
|
.el-textarea__inner:focus {
|
box-shadow: 0 0 0 1px rgba(0, 47, 167, 0.28) inset !important;
|
}
|
|
.el-card {
|
border: 1px solid var(--surface-border);
|
box-shadow: var(--shadow-sm);
|
background: rgba(255, 255, 255, 0.88);
|
}
|
|
.el-table {
|
--el-table-border-color: var(--surface-border);
|
--el-table-header-bg-color: var(--surface-soft);
|
--el-table-row-hover-bg-color: #f1f6f4;
|
--el-table-current-row-bg-color: #e9f0ed;
|
border-radius: 18px;
|
}
|
|
.el-table th.el-table__cell {
|
background: var(--surface-soft) !important;
|
color: var(--text-secondary);
|
font-weight: 600;
|
}
|
|
.el-table tr,
|
.el-table td.el-table__cell,
|
.el-table__body tr > td.el-table__cell {
|
background: var(--surface-base) !important;
|
}
|
|
.el-table .el-table__body tr:hover > td.el-table__cell {
|
background: var(--el-table-row-hover-bg-color) !important;
|
}
|
|
.el-table .el-table__body tr.current-row > td.el-table__cell {
|
background: var(--el-table-current-row-bg-color) !important;
|
}
|
|
.el-table .el-table__footer-wrapper {
|
border-top: 1px solid var(--surface-border);
|
}
|
|
.el-table .el-table__footer-wrapper tbody td.el-table__cell,
|
.el-table .el-table__footer-wrapper tfoot td.el-table__cell {
|
background: var(--surface-base) !important;
|
border-top: 1px solid var(--surface-border);
|
font-weight: 600;
|
}
|
|
.el-pagination {
|
margin-top: 18px;
|
}
|