first commit
This commit is contained in:
祀梦
377
frontend/src/styles/element-plus.css
Normal file
377
frontend/src/styles/element-plus.css
Normal file
@@ -0,0 +1,377 @@
|
||||
/* Element Plus 全局样式覆盖 - 强制去除所有黑色边框 */
|
||||
|
||||
/* 输入框 */
|
||||
.el-input__wrapper {
|
||||
box-shadow: 0 0 0 1px #FFE4EC inset !important;
|
||||
}
|
||||
|
||||
.el-input__wrapper:hover {
|
||||
box-shadow: 0 0 0 1px #FF6B9D inset !important;
|
||||
}
|
||||
|
||||
.el-input__wrapper.is-focus {
|
||||
box-shadow: 0 0 0 1px #FF6B9D inset !important;
|
||||
}
|
||||
|
||||
/* 下拉选择框 */
|
||||
.el-select__wrapper {
|
||||
box-shadow: 0 0 0 1px #FFE4EC inset !important;
|
||||
}
|
||||
|
||||
.el-select__wrapper:hover {
|
||||
box-shadow: 0 0 0 1px #FF6B9D inset !important;
|
||||
}
|
||||
|
||||
.el-select__wrapper.is-focused {
|
||||
box-shadow: 0 0 0 1px #FF6B9D inset !important;
|
||||
}
|
||||
|
||||
.el-select__placeholder {
|
||||
color: #999999 !important;
|
||||
}
|
||||
|
||||
.el-select__caret {
|
||||
color: #FF6B9D !important;
|
||||
}
|
||||
|
||||
.el-select-dropdown {
|
||||
border: 1px solid #FFE4EC !important;
|
||||
box-shadow: 0 2px 12px rgba(255, 107, 157, 0.1) !important;
|
||||
background: white !important;
|
||||
}
|
||||
|
||||
.el-select-dropdown__item {
|
||||
color: #333333 !important;
|
||||
}
|
||||
|
||||
.el-select-dropdown__item:hover {
|
||||
background: rgba(255, 107, 157, 0.1) !important;
|
||||
color: #FF6B9D !important;
|
||||
}
|
||||
|
||||
.el-select-dropdown__item.is-selected {
|
||||
color: #FF6B9D !important;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* 数字输入框 */
|
||||
.el-input-number__decrease,
|
||||
.el-input-number__increase {
|
||||
background: #FFF9FB !important;
|
||||
color: #999999 !important;
|
||||
border: 1px solid #FFE4EC !important;
|
||||
}
|
||||
|
||||
.el-input-number__decrease:hover,
|
||||
.el-input-number__increase:hover {
|
||||
background: rgba(255, 107, 157, 0.1) !important;
|
||||
color: #FF6B9D !important;
|
||||
border-color: #FF6B9D !important;
|
||||
}
|
||||
|
||||
.el-input-number__decrease.is-disabled,
|
||||
.el-input-number__increase.is-disabled {
|
||||
color: #cccccc !important;
|
||||
border-color: #FFE4EC !important;
|
||||
}
|
||||
|
||||
.el-input-number__wrapper {
|
||||
box-shadow: 0 0 0 1px #FFE4EC inset !important;
|
||||
}
|
||||
|
||||
.el-input-number__wrapper:hover {
|
||||
box-shadow: 0 0 0 1px #FF6B9D inset !important;
|
||||
}
|
||||
|
||||
.el-input-number__wrapper.is-focus {
|
||||
box-shadow: 0 0 0 1px #FF6B9D inset !important;
|
||||
}
|
||||
|
||||
/* 按钮 */
|
||||
.el-button {
|
||||
border: 1px solid #FFE4EC !important;
|
||||
}
|
||||
|
||||
.el-button--primary {
|
||||
background: linear-gradient(135deg, #FF6B9D 0%, #FF8FB3 100%) !important;
|
||||
border-color: #FF6B9D !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.el-button--primary:hover {
|
||||
background: linear-gradient(135deg, #FF5A8F 0%, #FF7FA7 100%) !important;
|
||||
box-shadow: 0 4px 12px rgba(255, 107, 157, 0.3) !important;
|
||||
}
|
||||
|
||||
.el-button--success {
|
||||
background: linear-gradient(135deg, #00D4FF 0%, #00E5FF 100%) !important;
|
||||
border-color: #00D4FF !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.el-button--success:hover {
|
||||
background: linear-gradient(135deg, #00C4F0 0%, #00D4E8 100%) !important;
|
||||
box-shadow: 0 4px 12px rgba(0, 212, 255, 0.3) !important;
|
||||
}
|
||||
|
||||
.el-button--warning {
|
||||
background: linear-gradient(135deg, #FFB800 0%, #FFD000 100%) !important;
|
||||
border-color: #FFB800 !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.el-button--warning:hover {
|
||||
background: linear-gradient(135deg, #FFA700 0%, #FFC000 100%) !important;
|
||||
box-shadow: 0 4px 12px rgba(255, 184, 0, 0.3) !important;
|
||||
}
|
||||
|
||||
.el-button--danger {
|
||||
background: linear-gradient(135deg, #FF6B6B 0%, #FF8B8B 100%) !important;
|
||||
border-color: #FF6B6B !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.el-button--danger:hover {
|
||||
background: linear-gradient(135deg, #FF5A5A 0%, #FF7A7A 100%) !important;
|
||||
box-shadow: 0 4px 12px rgba(255, 107, 107, 0.3) !important;
|
||||
}
|
||||
|
||||
/* 卡片 */
|
||||
.el-card {
|
||||
border: 1px solid #FFE4EC !important;
|
||||
box-shadow: 0 2px 12px rgba(255, 107, 157, 0.08) !important;
|
||||
}
|
||||
|
||||
.el-card__header {
|
||||
border-bottom: 1px solid #FFE4EC !important;
|
||||
}
|
||||
|
||||
.el-card__body {
|
||||
background: rgba(255, 255, 255, 0.95) !important;
|
||||
}
|
||||
|
||||
/* 表格 */
|
||||
.el-table {
|
||||
border: 1px solid #FFE4EC !important;
|
||||
background: white !important;
|
||||
}
|
||||
|
||||
.el-table th.el-table__cell {
|
||||
background: #FFF9FB !important;
|
||||
color: #333333 !important;
|
||||
border-bottom: 1px solid #FFE4EC !important;
|
||||
}
|
||||
|
||||
.el-table td.el-table__cell {
|
||||
border-bottom: 1px solid #FFE4EC !important;
|
||||
}
|
||||
|
||||
.el-table__border-left {
|
||||
border-left: 1px solid #FFE4EC !important;
|
||||
}
|
||||
|
||||
.el-table__border-right {
|
||||
border-right: 1px solid #FFE4EC !important;
|
||||
}
|
||||
|
||||
.el-table tr:hover > td {
|
||||
background: #FFF0F5 !important;
|
||||
}
|
||||
|
||||
.el-table__body tr.current-row > td.el-table__cell {
|
||||
background: #FFE4EC !important;
|
||||
}
|
||||
|
||||
/* Checkbox */
|
||||
.el-checkbox__inner {
|
||||
border: 1px solid #FFE4EC !important;
|
||||
background: white !important;
|
||||
}
|
||||
|
||||
.el-checkbox__inner:hover {
|
||||
border-color: #FF6B9D !important;
|
||||
}
|
||||
|
||||
.el-checkbox__input.is-checked .el-checkbox__inner {
|
||||
background: #FF6B9D !important;
|
||||
border-color: #FF6B9D !important;
|
||||
}
|
||||
|
||||
.el-checkbox__input.is-disabled .el-checkbox__inner {
|
||||
background: #f5f5f5 !important;
|
||||
border-color: #e4e7ed !important;
|
||||
}
|
||||
|
||||
/* 分页器 */
|
||||
.el-pagination button {
|
||||
border: 1px solid #FFE4EC !important;
|
||||
background: #FFF9FB !important;
|
||||
color: #999999 !important;
|
||||
}
|
||||
|
||||
.el-pagination button:hover {
|
||||
background: rgba(255, 107, 157, 0.1) !important;
|
||||
color: #FF6B9D !important;
|
||||
}
|
||||
|
||||
.el-pagination li.is-active {
|
||||
background: #FF6B9D !important;
|
||||
color: white !important;
|
||||
border-color: #FF6B9D !important;
|
||||
}
|
||||
|
||||
.el-pager li {
|
||||
background: #FFF9FB !important;
|
||||
color: #999999 !important;
|
||||
border: 1px solid #FFE4EC !important;
|
||||
}
|
||||
|
||||
.el-pager li:hover {
|
||||
color: #FF6B9D !important;
|
||||
}
|
||||
|
||||
/* Tag */
|
||||
.el-tag {
|
||||
border: 1px solid #FFE4EC !important;
|
||||
}
|
||||
|
||||
.el-tag--primary {
|
||||
background: rgba(255, 107, 157, 0.1) !important;
|
||||
color: #FF6B9D !important;
|
||||
border-color: rgba(255, 107, 157, 0.3) !important;
|
||||
}
|
||||
|
||||
.el-tag--success {
|
||||
background: rgba(0, 212, 255, 0.1) !important;
|
||||
color: #00D4FF !important;
|
||||
border-color: rgba(0, 212, 255, 0.3) !important;
|
||||
}
|
||||
|
||||
.el-tag--warning {
|
||||
background: rgba(255, 184, 0, 0.1) !important;
|
||||
color: #FFB800 !important;
|
||||
border-color: rgba(255, 184, 0, 0.3) !important;
|
||||
}
|
||||
|
||||
.el-tag--danger {
|
||||
background: rgba(255, 107, 107, 0.1) !important;
|
||||
color: #FF6B6B !important;
|
||||
border-color: rgba(255, 107, 107, 0.3) !important;
|
||||
}
|
||||
|
||||
/* Rate 评分 */
|
||||
.el-rate__icon {
|
||||
color: #FFE4EC !important;
|
||||
}
|
||||
|
||||
.el-rate__icon.hover {
|
||||
color: #FF6B9D !important;
|
||||
}
|
||||
|
||||
/* Dialog 对话框 */
|
||||
.el-dialog {
|
||||
border: 1px solid #FFE4EC !important;
|
||||
}
|
||||
|
||||
.el-dialog__header {
|
||||
border-bottom: 1px solid #FFE4EC !important;
|
||||
}
|
||||
|
||||
.el-dialog__body {
|
||||
background: white !important;
|
||||
}
|
||||
|
||||
.el-dialog__footer {
|
||||
border-top: 1px solid #FFE4EC !important;
|
||||
}
|
||||
|
||||
/* Dropdown 下拉菜单 */
|
||||
.el-dropdown-menu {
|
||||
border: 1px solid #FFE4EC !important;
|
||||
box-shadow: 0 2px 12px rgba(255, 107, 157, 0.1) !important;
|
||||
}
|
||||
|
||||
.el-dropdown-menu__item {
|
||||
color: #333333 !important;
|
||||
}
|
||||
|
||||
.el-dropdown-menu__item:hover {
|
||||
background: rgba(255, 107, 157, 0.1) !important;
|
||||
color: #FF6B9D !important;
|
||||
}
|
||||
|
||||
/* Scrollbar 滚动条 */
|
||||
.el-scrollbar__wrap::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
}
|
||||
|
||||
.el-scrollbar__wrap::-webkit-scrollbar-thumb {
|
||||
background: #FFE4EC;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.el-scrollbar__wrap::-webkit-scrollbar-thumb:hover {
|
||||
background: #FF6B9D;
|
||||
}
|
||||
|
||||
/* Form 表单 */
|
||||
.el-form-item__label {
|
||||
color: #666666 !important;
|
||||
}
|
||||
|
||||
.el-form-item__error {
|
||||
color: #FF6B6B !important;
|
||||
}
|
||||
|
||||
/* Message 消息提示 */
|
||||
.el-message {
|
||||
border: 1px solid #FFE4EC !important;
|
||||
box-shadow: 0 4px 16px rgba(255, 107, 157, 0.15) !important;
|
||||
}
|
||||
|
||||
.el-message--success {
|
||||
background: rgba(0, 212, 255, 0.1) !important;
|
||||
border-color: rgba(0, 212, 255, 0.3) !important;
|
||||
color: #00D4FF !important;
|
||||
}
|
||||
|
||||
.el-message--error {
|
||||
background: rgba(255, 107, 107, 0.1) !important;
|
||||
border-color: rgba(255, 107, 107, 0.3) !important;
|
||||
color: #FF6B6B !important;
|
||||
}
|
||||
|
||||
.el-message--warning {
|
||||
background: rgba(255, 184, 0, 0.1) !important;
|
||||
border-color: rgba(255, 184, 0, 0.3) !important;
|
||||
color: #FFB800 !important;
|
||||
}
|
||||
|
||||
.el-message--info {
|
||||
background: rgba(255, 107, 157, 0.1) !important;
|
||||
border-color: rgba(255, 107, 157, 0.3) !important;
|
||||
color: #FF6B9D !important;
|
||||
}
|
||||
|
||||
/* MessageBox 弹窗 */
|
||||
.el-message-box {
|
||||
border: 1px solid #FFE4EC !important;
|
||||
box-shadow: 0 4px 16px rgba(255, 107, 157, 0.15) !important;
|
||||
}
|
||||
|
||||
.el-message-box__header {
|
||||
border-bottom: 1px solid #FFE4EC !important;
|
||||
}
|
||||
|
||||
.el-message-box__title {
|
||||
color: #FF6B9D !important;
|
||||
}
|
||||
|
||||
.el-message-box__content {
|
||||
color: #333333 !important;
|
||||
}
|
||||
|
||||
.el-message-box__btns {
|
||||
border-top: 1px solid #FFE4EC !important;
|
||||
}
|
||||
Reference in New Issue
Block a user