ulthon/ulthon_admin
1
0
Fork 0
mirror of https://gitee.com/ulthon/ulthon_admin.git synced 2026-10-29 08:58:22 +08:00
Code Issues 1 Packages Projects Releases Wiki Activity

fix(theme): 清爽皮肤按钮配色适配

Browse Source
This commit is contained in:
augushong
2026-09-27 12:36:47 +00:00
parent 842641763a
commit 41cb60a80a
2 changed files with 101 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
public/static/common/css/theme/_fresh.scss
View File

@@ -178,20 +178,71 @@ $shadow-pop: 0 6px 16px rgba(31, 35, 41, .08);
} }
// E. 内容组件轻触 // E. 内容组件轻触
// 主按钮适配清爽品牌蓝（覆盖 layui 2.10 默认青绿 #16baaa）；layui 按钮系列声明
// 全部无 !important（唯一例外 disabled:hover 背景），.elem-style-fresh 包裹
// (0,2,0) 起步天然稳赢，故本段不加 !important。
.layui-btn { .layui-btn {
border-radius: $radius-btn; background-color: $main;
border-radius : $radius-btn;
color : #fff;
} }
.layui-btn:hover {
background-color: #40a2ff;
}
.layui-btn:active {
background-color: #0f87e6;
}
// 描边钮（方案A）：必须声明在上方 .layui-btn 背景之后，同特异性源序压过主色
.layui-btn-primary { .layui-btn-primary {
border-color: $border; background-color: #fff;
border-color : $border;
color : #4e5969; color : #4e5969;
} }
.layui-btn-primary:hover { .layui-btn-primary:hover {
border-color: $main; background-color: $main-light;
border-color : $main;
color : $main; color : $main;
} }
// 描边钮软按压态：同 hover 底色，:active (0,3,0) 声明在 primary:hover 之后，
// 源序压过 .layui-btn:active 的压深值，修复点击瞬间闪实心深蓝
.layui-btn-primary:active {
background-color: $main-light;
border-color : $main;
color : $main;
}
// 语义色保留：显式重申当前生效值（danger/success 与 public.css 一致，warm/disabled
// 为 layui 原值），防止被上方主色背景同特异性压过；hover/active 同值重申防被提亮/
// 压深值命中变蓝（:active 是 (0,3,0)，必须并入同值规则组才能压过 .layui-btn:active；
// layui 原版语义钮 hover/active 为 opacity 变化，无背景声明；disabled:hover 背景
// 已由 layui !important 自保护，无需重申）
.layui-btn-warm,
.layui-btn-warm:hover,
.layui-btn-warm:active {
background-color: #ffb800;
}
.layui-btn-danger,
.layui-btn-danger:hover,
.layui-btn-danger:active {
background-color: #f56c6c;
}
.layui-btn-success,
.layui-btn-success:hover,
.layui-btn-success:active {
background-color: #4bb368;
}
.layui-btn-disabled {
background-color: #fbfbfb;
}
.layui-card, .layui-card,
.layuimini-container { .layuimini-container {
border-radius: $radius-card; border-radius: $radius-card;

45
public/static/common/css/theme/index.css
View File

@@ -2294,16 +2294,61 @@
.elem-style-neomorphic .elem-style-fresh .layuimini-menu-left-zoom > ul, .elem-style-fresh .elem-style-neomorphic .layuimini-menu-left .layui-nav .layui-nav-item a, .elem-style-neomorphic .layuimini-menu-left .layui-nav .layui-nav-item .elem-style-fresh a, .elem-style-neomorphic .elem-style-fresh .layuimini-menu-left-zoom > ul, .elem-style-fresh .elem-style-neomorphic .layuimini-menu-left .layui-nav .layui-nav-item a, .elem-style-neomorphic .layuimini-menu-left .layui-nav .layui-nav-item .elem-style-fresh a,
.elem-style-fresh .elem-style-neomorphic .layuimini-menu-left-zoom.layui-nav .layui-nav-item a, .elem-style-fresh .elem-style-neomorphic .layuimini-menu-left-zoom.layui-nav .layui-nav-item a,
.elem-style-neomorphic .layuimini-menu-left-zoom.layui-nav .layui-nav-item .elem-style-fresh a, .elem-style-fresh .elem-style-neomorphic .layui-header .layuimini-header-menu > .layui-nav-item, .elem-style-neomorphic .layui-header .elem-style-fresh .layuimini-header-menu > .layui-nav-item, .elem-style-fresh .elem-style-neomorphic .layui-header .layui-nav .layui-nav-item, .elem-style-neomorphic .layui-header .layui-nav .elem-style-fresh .layui-nav-item, .elem-style-fresh .elem-style-neomorphic .layui-form-select dl, .elem-style-neomorphic .layui-form-select .elem-style-fresh dl, .elem-style-fresh .elem-style-neomorphic .layui-form-checkbox, .elem-style-neomorphic .elem-style-fresh .layui-form-checkbox, .elem-style-fresh .elem-style-neomorphic .layui-form-radio, .elem-style-neomorphic .elem-style-fresh .layui-form-radio { .elem-style-neomorphic .layuimini-menu-left-zoom.layui-nav .layui-nav-item .elem-style-fresh a, .elem-style-fresh .elem-style-neomorphic .layui-header .layuimini-header-menu > .layui-nav-item, .elem-style-neomorphic .layui-header .elem-style-fresh .layuimini-header-menu > .layui-nav-item, .elem-style-fresh .elem-style-neomorphic .layui-header .layui-nav .layui-nav-item, .elem-style-neomorphic .layui-header .layui-nav .elem-style-fresh .layui-nav-item, .elem-style-fresh .elem-style-neomorphic .layui-form-select dl, .elem-style-neomorphic .layui-form-select .elem-style-fresh dl, .elem-style-fresh .elem-style-neomorphic .layui-form-checkbox, .elem-style-neomorphic .elem-style-fresh .layui-form-checkbox, .elem-style-fresh .elem-style-neomorphic .layui-form-radio, .elem-style-neomorphic .elem-style-fresh .layui-form-radio {
background-color: #1E9FFF;
border-radius: 4px; border-radius: 4px;
color: #fff;
}
.elem-style-fresh .layui-btn:hover, .elem-style-fresh .elem-style-sicfi .layui-layer-easy .layui-layer-btn a:hover, .elem-style-sicfi .layui-layer-easy .layui-layer-btn .elem-style-fresh a:hover, .elem-style-fresh .elem-style-gtk .layuimini-container .layui-table-tool .layui-inline[lay-event]:hover, .elem-style-gtk .layuimini-container .layui-table-tool .elem-style-fresh .layui-inline[lay-event]:hover, .elem-style-fresh .elem-style-gtk .laydate-footer-btns span:hover, .elem-style-gtk .laydate-footer-btns .elem-style-fresh span:hover, .elem-style-fresh .elem-style-gtk .layui-laydate-footer span:hover, .elem-style-gtk .layui-laydate-footer .elem-style-fresh span:hover, .elem-style-fresh .elem-style-gtk .layui-tab-brief > .layui-tab-title li:hover, .elem-style-gtk .layui-tab-brief > .layui-tab-title .elem-style-fresh li:hover, .elem-style-fresh .elem-style-gtk .layuimini-header-menu > li.layui-nav-item:hover, .elem-style-gtk .elem-style-fresh .layuimini-header-menu > li.layui-nav-item:hover, .elem-style-fresh .elem-style-nes .layuimini-container .layui-table-tool .layui-inline[lay-event]:hover, .elem-style-nes .layuimini-container .layui-table-tool .elem-style-fresh .layui-inline[lay-event]:hover, .elem-style-fresh .elem-style-nes .layui-layer-easy .layui-layer-btn a:hover, .elem-style-nes .layui-layer-easy .layui-layer-btn .elem-style-fresh a:hover, .elem-style-fresh .elem-style-win7 .layui-layer-easy .layui-layer-btn a:hover, .elem-style-win7 .layui-layer-easy .layui-layer-btn .elem-style-fresh a:hover, .elem-style-fresh .elem-style-neomorphic .layui-table-tool .layui-inline[lay-event]:hover, .elem-style-neomorphic .layui-table-tool .elem-style-fresh .layui-inline[lay-event]:hover, .elem-style-fresh .elem-style-neomorphic .layuimini-main:hover, .elem-style-neomorphic .elem-style-fresh .layuimini-main:hover, .elem-style-fresh .elem-style-neomorphic .layui-layer:hover, .elem-style-neomorphic .elem-style-fresh .layui-layer:hover, .elem-style-fresh .elem-style-neomorphic .layui-card:hover, .elem-style-neomorphic .elem-style-fresh .layui-card:hover, .elem-style-fresh .elem-style-neomorphic .panel:hover, .elem-style-neomorphic .elem-style-fresh .panel:hover, .elem-style-fresh .elem-style-neomorphic .layuimini-qiuck-module:hover, .elem-style-neomorphic .elem-style-fresh .layuimini-qiuck-module:hover, .elem-style-fresh .elem-style-neomorphic .layui-side.layui-bg-black:hover, .elem-style-neomorphic .elem-style-fresh .layui-side.layui-bg-black:hover,
.elem-style-fresh .elem-style-neomorphic .layui-side.layui-bg-black > .layuimini-menu-left > ul:hover,
.elem-style-neomorphic .elem-style-fresh .layui-side.layui-bg-black > .layuimini-menu-left > ul:hover,
.elem-style-fresh .elem-style-neomorphic .layuimini-menu-left-zoom > ul:hover,
.elem-style-neomorphic .elem-style-fresh .layuimini-menu-left-zoom > ul:hover, .elem-style-fresh .elem-style-neomorphic .layuimini-menu-left .layui-nav .layui-nav-item a:hover, .elem-style-neomorphic .layuimini-menu-left .layui-nav .layui-nav-item .elem-style-fresh a:hover,
.elem-style-fresh .elem-style-neomorphic .layuimini-menu-left-zoom.layui-nav .layui-nav-item a:hover,
.elem-style-neomorphic .layuimini-menu-left-zoom.layui-nav .layui-nav-item .elem-style-fresh a:hover, .elem-style-fresh .elem-style-neomorphic .layui-header .layuimini-header-menu > .layui-nav-item:hover, .elem-style-neomorphic .layui-header .elem-style-fresh .layuimini-header-menu > .layui-nav-item:hover, .elem-style-fresh .elem-style-neomorphic .layui-header .layui-nav .layui-nav-item:hover, .elem-style-neomorphic .layui-header .layui-nav .elem-style-fresh .layui-nav-item:hover, .elem-style-fresh .elem-style-neomorphic .layui-form-select dl:hover, .elem-style-neomorphic .layui-form-select .elem-style-fresh dl:hover, .elem-style-fresh .elem-style-neomorphic .layui-form-checkbox:hover, .elem-style-neomorphic .elem-style-fresh .layui-form-checkbox:hover, .elem-style-fresh .elem-style-neomorphic .layui-form-radio:hover, .elem-style-neomorphic .elem-style-fresh .layui-form-radio:hover {
background-color: #40a2ff;
}
.elem-style-fresh .layui-btn:active, .elem-style-fresh .elem-style-sicfi .layui-layer-easy .layui-layer-btn a:active, .elem-style-sicfi .layui-layer-easy .layui-layer-btn .elem-style-fresh a:active, .elem-style-fresh .elem-style-gtk .layuimini-container .layui-table-tool .layui-inline[lay-event]:active, .elem-style-gtk .layuimini-container .layui-table-tool .elem-style-fresh .layui-inline[lay-event]:active, .elem-style-fresh .elem-style-gtk .laydate-footer-btns span:active, .elem-style-gtk .laydate-footer-btns .elem-style-fresh span:active, .elem-style-fresh .elem-style-gtk .layui-laydate-footer span:active, .elem-style-gtk .layui-laydate-footer .elem-style-fresh span:active, .elem-style-fresh .elem-style-gtk .layui-tab-brief > .layui-tab-title li:active, .elem-style-gtk .layui-tab-brief > .layui-tab-title .elem-style-fresh li:active, .elem-style-fresh .elem-style-gtk .layuimini-header-menu > li.layui-nav-item:active, .elem-style-gtk .elem-style-fresh .layuimini-header-menu > li.layui-nav-item:active, .elem-style-fresh .elem-style-nes .layuimini-container .layui-table-tool .layui-inline[lay-event]:active, .elem-style-nes .layuimini-container .layui-table-tool .elem-style-fresh .layui-inline[lay-event]:active, .elem-style-fresh .elem-style-nes .layui-layer-easy .layui-layer-btn a:active, .elem-style-nes .layui-layer-easy .layui-layer-btn .elem-style-fresh a:active, .elem-style-fresh .elem-style-win7 .layui-layer-easy .layui-layer-btn a:active, .elem-style-win7 .layui-layer-easy .layui-layer-btn .elem-style-fresh a:active, .elem-style-fresh .elem-style-neomorphic .layui-table-tool .layui-inline[lay-event]:active, .elem-style-neomorphic .layui-table-tool .elem-style-fresh .layui-inline[lay-event]:active, .elem-style-fresh .elem-style-neomorphic .layuimini-main:active, .elem-style-neomorphic .elem-style-fresh .layuimini-main:active, .elem-style-fresh .elem-style-neomorphic .layui-layer:active, .elem-style-neomorphic .elem-style-fresh .layui-layer:active, .elem-style-fresh .elem-style-neomorphic .layui-card:active, .elem-style-neomorphic .elem-style-fresh .layui-card:active, .elem-style-fresh .elem-style-neomorphic .panel:active, .elem-style-neomorphic .elem-style-fresh .panel:active, .elem-style-fresh .elem-style-neomorphic .layuimini-qiuck-module:active, .elem-style-neomorphic .elem-style-fresh .layuimini-qiuck-module:active, .elem-style-fresh .elem-style-neomorphic .layui-side.layui-bg-black:active, .elem-style-neomorphic .elem-style-fresh .layui-side.layui-bg-black:active,
.elem-style-fresh .elem-style-neomorphic .layui-side.layui-bg-black > .layuimini-menu-left > ul:active,
.elem-style-neomorphic .elem-style-fresh .layui-side.layui-bg-black > .layuimini-menu-left > ul:active,
.elem-style-fresh .elem-style-neomorphic .layuimini-menu-left-zoom > ul:active,
.elem-style-neomorphic .elem-style-fresh .layuimini-menu-left-zoom > ul:active, .elem-style-fresh .elem-style-neomorphic .layuimini-menu-left .layui-nav .layui-nav-item a:active, .elem-style-neomorphic .layuimini-menu-left .layui-nav .layui-nav-item .elem-style-fresh a:active,
.elem-style-fresh .elem-style-neomorphic .layuimini-menu-left-zoom.layui-nav .layui-nav-item a:active,
.elem-style-neomorphic .layuimini-menu-left-zoom.layui-nav .layui-nav-item .elem-style-fresh a:active, .elem-style-fresh .elem-style-neomorphic .layui-header .layuimini-header-menu > .layui-nav-item:active, .elem-style-neomorphic .layui-header .elem-style-fresh .layuimini-header-menu > .layui-nav-item:active, .elem-style-fresh .elem-style-neomorphic .layui-header .layui-nav .layui-nav-item:active, .elem-style-neomorphic .layui-header .layui-nav .elem-style-fresh .layui-nav-item:active, .elem-style-fresh .elem-style-neomorphic .layui-form-select dl:active, .elem-style-neomorphic .layui-form-select .elem-style-fresh dl:active, .elem-style-fresh .elem-style-neomorphic .layui-form-checkbox:active, .elem-style-neomorphic .elem-style-fresh .layui-form-checkbox:active, .elem-style-fresh .elem-style-neomorphic .layui-form-radio:active, .elem-style-neomorphic .elem-style-fresh .layui-form-radio:active {
background-color: #0f87e6;
} }
.elem-style-fresh .layui-btn-primary { .elem-style-fresh .layui-btn-primary {
background-color: #fff;
border-color: #e5e9ef; border-color: #e5e9ef;
color: #4e5969; color: #4e5969;
} }
.elem-style-fresh .layui-btn-primary:hover { .elem-style-fresh .layui-btn-primary:hover {
background-color: #e8f3ff;
border-color: #1E9FFF; border-color: #1E9FFF;
color: #1E9FFF; color: #1E9FFF;
} }
.elem-style-fresh .layui-btn-primary:active {
background-color: #e8f3ff;
border-color: #1E9FFF;
color: #1E9FFF;
}
.elem-style-fresh .layui-btn-warm,
.elem-style-fresh .layui-btn-warm:hover,
.elem-style-fresh .layui-btn-warm:active {
background-color: #ffb800;
}
.elem-style-fresh .layui-btn-danger,
.elem-style-fresh .layui-btn-danger:hover,
.elem-style-fresh .layui-btn-danger:active {
background-color: #f56c6c;
}
.elem-style-fresh .layui-btn-success,
.elem-style-fresh .layui-btn-success:hover,
.elem-style-fresh .layui-btn-success:active {
background-color: #4bb368;
}
.elem-style-fresh .layui-btn-disabled {
background-color: #fbfbfb;
}
.elem-style-fresh .layui-card, .elem-style-fresh .layui-card,
.elem-style-fresh .layuimini-container { .elem-style-fresh .layuimini-container {
border-radius: 8px; border-radius: 8px;