diff --git a/extend/base/admin/view/index/index.js b/extend/base/admin/view/index/index.js index e7f0dca..83895fa 100644 --- a/extend/base/admin/view/index/index.js +++ b/extend/base/admin/view/index/index.js @@ -4,7 +4,7 @@ $(function () { iniUrl: ua.url('ajax/initAdmin'), // 初始化接口 clearUrl: ua.url("ajax/clearCache"), // 缓存清理接口 urlHashLocation: true, // 是否打开hash定位 - bgColorDefault: false, // 主题默认配置 + bgColorDefault: 12, // 主题默认配置（12=全白浅色，配清爽皮肤） menuChildOpen: false, // 是否默认展开菜单 loadingTime: 0, // 初始化加载时间 pageAnim: true, // iframe窗口动画 diff --git a/public/static/common/css/theme/_fresh.scss b/public/static/common/css/theme/_fresh.scss new file mode 100644 index 0000000..cc8ca3e --- /dev/null +++ b/public/static/common/css/theme/_fresh.scss @@ -0,0 +1,211 @@ +// ============================================================================ +// 清爽（fresh）皮肤 —— 36px 紧凑头部 + 白底轻量视觉 +// 结构：(0)设计令牌 (A)头部36px (B)头部分组tab (C)页签条重描 (D)侧栏 (E)内容组件轻触 +// 约定：尺寸/布局/圆角/阴影归本文件，颜色基调归配色系统（buildThemeCss）， +// 本文件只覆盖自身视觉语言所需颜色。禁用选择器扩展语法。 +// ============================================================================ + +// 0. 设计令牌 +$header-h: 36px; +$main: #1E9FFF; +$main-light: #e8f3ff; +$text-main: #33383f; +$text-sub: #6b7280; +$border-light: #f0f2f5; +$border: #e5e9ef; +$bg-page: #f7f8fa; +$radius-btn: 4px; +$radius-card: 8px; +$shadow-card: 0 1px 2px rgba(0, 0, 0, .04); +$shadow-pop: 0 6px 16px rgba(31, 35, 41, .08); + +// A. 头部 36px（对冲 layuimini.css 全部 60px !important 硬编码） +.layui-layout-admin .layui-header, +.layuimini-header-menu { + height : $header-h !important; + box-sizing : border-box; + border-bottom : 1px solid $border-light; +} + +.layuimini-header-menu>.layui-nav-item, +.layui-header>.layui-layout-right>.layui-nav-item { + height : $header-h !important; + line-height: $header-h !important; +} + +.layui-layout-admin .layui-header .layui-nav .layui-nav-item a { + line-height: $header-h; +} + +.layui-layout-admin .layuimini-logo { + height : $header-h !important; + line-height : $header-h !important; + background-color: #fff !important; + color : $text-main !important; + box-sizing : border-box; + border-right : 1px solid $border-light; +} + +.layui-layout-admin .layuimini-logo img { + height: 20px; +} + +.layui-layout-admin .layuimini-logo h1 { + color : $text-main !important; + font-size: 15px; +} + +.layuimini-tool { + line-height: $header-h; + color : $text-sub !important; +} + +.layuimini-tool i { + width : 20px; + height : 20px; + line-height : 20px; + margin-top : 8px; + border-radius: $radius-btn; + color : $text-sub; +} + +.layui-layout-admin .layui-body, +.layui-layout-admin .layui-side { + top: $header-h !important; +} + +// B. 头部分组 tab（白底浅字，激活用 inset box-shadow 底条，不依赖被置零的 :after） +.layuimini-header-menu>.layui-nav-item>a, +.layui-header>.layui-layout-right>.layui-nav-item>a { + padding: 0 14px; + color : $text-sub !important; +} + +.layuimini-header-menu>.layui-nav-item:hover, +.layuimini-header-menu>.layui-nav-item.layui-this, +.layui-header>.layui-layout-right>.layui-nav-item:hover, +.layui-header>.layui-layout-right>.layui-nav-item.layui-this { + background-color: transparent !important; +} + +.layuimini-header-menu>.layui-nav-item:hover>a, +.layuimini-header-menu>.layui-nav-item.layui-this>a, +.layui-header>.layui-layout-right>.layui-nav-item:hover>a, +.layui-header>.layui-layout-right>.layui-nav-item.layui-this>a { + color: $main !important; +} + +.layuimini-header-menu>.layui-nav-item.layui-this, +.layui-header>.layui-layout-right>.layui-nav-item.layui-this { + box-shadow: inset 0 -2px 0 $main; +} + +.layui-header .layui-nav-img { + width : 24px; + height: 24px; +} + +// C. 页签条重描（高度保持 35px，仅改颜色） +.layuimini-tab .layui-tab-title { + border-color: $border-light; +} + +.layuimini-tab .layui-tab-title li { + border-right: 1px solid $border-light; + color : $text-sub; +} + +.layuimini-tab .layui-tab-title span { + color: $text-sub; +} + +.layuimini-tab .layui-tab-title .layui-this { + box-shadow: inset 0 -2px 0 $main; +} + +.layuimini-tab .layui-tab-title .layui-this span { + color: $main !important; +} + +.layuimini-tab .layui-tab-title .layuimini-tab-active { + width : 6px; + height : 6px; + background-color: $main; +} + +.layuimini-tab .layui-tab-control>li { + background-color: #fff; + border-top : $border-light 1px solid; + border-bottom : $border-light 1px solid; +} + +// D. 侧栏（浅色菜单；菜单项 40px 高度不动） +.layuimini-menu-left .layui-nav .layui-nav-item>a, +.layuimini-menu-left .layui-nav .layui-nav-child a { + color: #4a5261 !important; +} + +.layuimini-menu-left .layui-nav .layui-nav-item a:hover { + background-color: #f5f7fa !important; +} + +.layui-side.layui-bg-black>.layuimini-menu-left>ul>.layui-nav-item:first-child { + border-top-color: $border-light; +} + +.layuimini-menu-left .layui-nav-tree .layui-nav-child, +.layuimini-menu-left-zoom.layui-nav-tree .layui-nav-child { + background-color: #fafbfc; +} + +// 激活态（选择器清单参照 _sicfi.scss:763-770，含 dd 与 -zoom 变体） +.layuimini-menu-left .layui-nav-tree .layui-this, +.layuimini-menu-left .layui-nav-tree .layui-this>a, +.layuimini-menu-left .layui-nav-tree .layui-nav-child dd.layui-this, +.layuimini-menu-left .layui-nav-tree .layui-nav-child dd.layui-this a, +.layuimini-menu-left-zoom.layui-nav-tree .layui-this, +.layuimini-menu-left-zoom.layui-nav-tree .layui-this>a, +.layuimini-menu-left-zoom.layui-nav-tree .layui-nav-child dd.layui-this, +.layuimini-menu-left-zoom.layui-nav-tree .layui-nav-child dd.layui-this a { + background-color: $main-light !important; + color : $main !important; + box-shadow : inset 3px 0 0 $main; +} + +// E. 内容组件轻触（& = body.elem-style-fresh） +& { + background: $bg-page; +} + +.layui-btn { + border-radius: $radius-btn; +} + +.layui-card, +.layuimini-container { + border-radius: $radius-card; + border : 1px solid $border; + box-shadow : $shadow-card; +} + +.layui-layer { + border-radius: $radius-card; + overflow : hidden; +} + +.layui-layer-title { + background-color: #fff; + border-bottom : 1px solid $border-light; +} + +.layui-table thead tr, +.layui-table-header { + background-color: #fafbfc; +} + +.layui-header .layui-nav-child { + top : 100% !important; + border-radius : 6px; + border : 1px solid $border-light; + box-shadow : $shadow-pop; +} diff --git a/public/static/common/css/theme/index.css b/public/static/common/css/theme/index.css index ae2d7c5..598c25c 100644 --- a/public/static/common/css/theme/index.css +++ b/public/static/common/css/theme/index.css @@ -82,6 +82,15 @@ .elem-style-sicfi .layuimini-container .layui-table-tool { background-color: rgb(2, 17, 20); } +.elem-style-sicfi .layui-btn.layui-btn-lg, .elem-style-sicfi .elem-style-neomorphic .layui-btn-lg.layui-form-radio, .elem-style-neomorphic .elem-style-sicfi .layui-btn-lg.layui-form-radio, .elem-style-sicfi .elem-style-neomorphic .layui-btn-lg.layui-form-checkbox, .elem-style-neomorphic .elem-style-sicfi .layui-btn-lg.layui-form-checkbox, .elem-style-sicfi .elem-style-neomorphic .layui-form-select dl.layui-btn-lg, .elem-style-neomorphic .layui-form-select .elem-style-sicfi dl.layui-btn-lg, .elem-style-sicfi .elem-style-neomorphic .layui-header .layui-nav .layui-btn-lg.layui-nav-item, .elem-style-neomorphic .layui-header .layui-nav .elem-style-sicfi .layui-btn-lg.layui-nav-item, .elem-style-sicfi .elem-style-neomorphic .layui-header .layuimini-header-menu > .layui-btn-lg.layui-nav-item, .elem-style-neomorphic .layui-header .elem-style-sicfi .layuimini-header-menu > .layui-btn-lg.layui-nav-item, .elem-style-sicfi .elem-style-neomorphic .layuimini-menu-left .layui-nav .layui-nav-item a.layui-btn-lg, .elem-style-neomorphic .layuimini-menu-left .layui-nav .layui-nav-item .elem-style-sicfi a.layui-btn-lg, +.elem-style-sicfi .elem-style-neomorphic .layuimini-menu-left-zoom.layui-nav .layui-nav-item a.layui-btn-lg, +.elem-style-neomorphic .layuimini-menu-left-zoom.layui-nav .layui-nav-item .elem-style-sicfi a.layui-btn-lg, .elem-style-sicfi .elem-style-neomorphic .layui-btn-lg.layui-side.layui-bg-black, .elem-style-neomorphic .elem-style-sicfi .layui-btn-lg.layui-side.layui-bg-black, +.elem-style-sicfi .elem-style-neomorphic .layui-side.layui-bg-black > .layuimini-menu-left > ul.layui-btn-lg, +.elem-style-neomorphic .elem-style-sicfi .layui-side.layui-bg-black > .layuimini-menu-left > ul.layui-btn-lg, +.elem-style-sicfi .elem-style-neomorphic .layuimini-menu-left-zoom > ul.layui-btn-lg, +.elem-style-neomorphic .elem-style-sicfi .layuimini-menu-left-zoom > ul.layui-btn-lg, .elem-style-sicfi .elem-style-neomorphic .layui-btn-lg.layuimini-qiuck-module, .elem-style-neomorphic .elem-style-sicfi .layui-btn-lg.layuimini-qiuck-module, .elem-style-sicfi .elem-style-neomorphic .layui-btn-lg.panel, .elem-style-neomorphic .elem-style-sicfi .layui-btn-lg.panel, .elem-style-sicfi .elem-style-neomorphic .layui-btn-lg.layui-card, .elem-style-neomorphic .elem-style-sicfi .layui-btn-lg.layui-card, .elem-style-sicfi .elem-style-neomorphic .layui-btn-lg.layui-layer, .elem-style-neomorphic .elem-style-sicfi .layui-btn-lg.layui-layer, .elem-style-sicfi .elem-style-neomorphic .layui-btn-lg.layuimini-main, .elem-style-neomorphic .elem-style-sicfi .layui-btn-lg.layuimini-main, .elem-style-sicfi .elem-style-neomorphic .layui-table-tool .layui-btn-lg.layui-inline[lay-event], .elem-style-neomorphic .layui-table-tool .elem-style-sicfi .layui-btn-lg.layui-inline[lay-event], .elem-style-win7 .layui-layer-easy .layui-layer-btn .elem-style-sicfi a.layui-btn-lg, .elem-style-nes .layui-layer-easy .layui-layer-btn .elem-style-sicfi a.layui-btn-lg, .elem-style-sicfi .elem-style-nes .layuimini-container .layui-table-tool .layui-btn-lg.layui-inline[lay-event], .elem-style-nes .layuimini-container .layui-table-tool .elem-style-sicfi .layui-btn-lg.layui-inline[lay-event], .elem-style-sicfi .elem-style-gtk .layuimini-header-menu > li.layui-btn-lg.layui-nav-item, .elem-style-gtk .elem-style-sicfi .layuimini-header-menu > li.layui-btn-lg.layui-nav-item, .elem-style-sicfi .elem-style-gtk .layui-tab-brief > .layui-tab-title li.layui-btn-lg, .elem-style-gtk .layui-tab-brief > .layui-tab-title .elem-style-sicfi li.layui-btn-lg, .elem-style-sicfi .elem-style-gtk .layui-laydate-footer span.layui-btn-lg, .elem-style-gtk .layui-laydate-footer .elem-style-sicfi span.layui-btn-lg, .elem-style-sicfi .elem-style-gtk .laydate-footer-btns span.layui-btn-lg, .elem-style-gtk .laydate-footer-btns .elem-style-sicfi span.layui-btn-lg, .elem-style-sicfi .elem-style-gtk .layuimini-container .layui-table-tool .layui-btn-lg.layui-inline[lay-event], .elem-style-gtk .layuimini-container .layui-table-tool .elem-style-sicfi .layui-btn-lg.layui-inline[lay-event], .elem-style-sicfi .layui-layer-easy .layui-layer-btn a.layui-btn-lg { + padding-right: 25px; +} .elem-style-sicfi .layui-btn, .elem-style-sicfi .elem-style-neomorphic .layui-form-radio, .elem-style-neomorphic .elem-style-sicfi .layui-form-radio, .elem-style-sicfi .elem-style-neomorphic .layui-form-checkbox, .elem-style-neomorphic .elem-style-sicfi .layui-form-checkbox, .elem-style-sicfi .elem-style-neomorphic .layui-form-select dl, .elem-style-neomorphic .layui-form-select .elem-style-sicfi dl, .elem-style-sicfi .elem-style-neomorphic .layui-header .layui-nav .layui-nav-item, .elem-style-neomorphic .layui-header .layui-nav .elem-style-sicfi .layui-nav-item, .elem-style-sicfi .elem-style-neomorphic .layui-header .layuimini-header-menu > .layui-nav-item, .elem-style-neomorphic .layui-header .elem-style-sicfi .layuimini-header-menu > .layui-nav-item, .elem-style-sicfi .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-sicfi a, .elem-style-sicfi .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-sicfi a, .elem-style-sicfi .elem-style-neomorphic .layui-side.layui-bg-black, .elem-style-neomorphic .elem-style-sicfi .layui-side.layui-bg-black, @@ -98,15 +107,6 @@ text-shadow: rgb(126, 252, 246) 0px 0px 1px; background-color: rgb(126, 252, 246); } -.elem-style-sicfi .layui-btn.layui-btn-lg, .elem-style-sicfi .elem-style-neomorphic .layui-btn-lg.layui-form-radio, .elem-style-neomorphic .elem-style-sicfi .layui-btn-lg.layui-form-radio, .elem-style-sicfi .elem-style-neomorphic .layui-btn-lg.layui-form-checkbox, .elem-style-neomorphic .elem-style-sicfi .layui-btn-lg.layui-form-checkbox, .elem-style-sicfi .elem-style-neomorphic .layui-form-select dl.layui-btn-lg, .elem-style-neomorphic .layui-form-select .elem-style-sicfi dl.layui-btn-lg, .elem-style-sicfi .elem-style-neomorphic .layui-header .layui-nav .layui-btn-lg.layui-nav-item, .elem-style-neomorphic .layui-header .layui-nav .elem-style-sicfi .layui-btn-lg.layui-nav-item, .elem-style-sicfi .elem-style-neomorphic .layui-header .layuimini-header-menu > .layui-btn-lg.layui-nav-item, .elem-style-neomorphic .layui-header .elem-style-sicfi .layuimini-header-menu > .layui-btn-lg.layui-nav-item, .elem-style-sicfi .elem-style-neomorphic .layuimini-menu-left .layui-nav .layui-nav-item a.layui-btn-lg, .elem-style-neomorphic .layuimini-menu-left .layui-nav .layui-nav-item .elem-style-sicfi a.layui-btn-lg, -.elem-style-sicfi .elem-style-neomorphic .layuimini-menu-left-zoom.layui-nav .layui-nav-item a.layui-btn-lg, -.elem-style-neomorphic .layuimini-menu-left-zoom.layui-nav .layui-nav-item .elem-style-sicfi a.layui-btn-lg, .elem-style-sicfi .elem-style-neomorphic .layui-btn-lg.layui-side.layui-bg-black, .elem-style-neomorphic .elem-style-sicfi .layui-btn-lg.layui-side.layui-bg-black, -.elem-style-sicfi .elem-style-neomorphic .layui-side.layui-bg-black > .layuimini-menu-left > ul.layui-btn-lg, -.elem-style-neomorphic .elem-style-sicfi .layui-side.layui-bg-black > .layuimini-menu-left > ul.layui-btn-lg, -.elem-style-sicfi .elem-style-neomorphic .layuimini-menu-left-zoom > ul.layui-btn-lg, -.elem-style-neomorphic .elem-style-sicfi .layuimini-menu-left-zoom > ul.layui-btn-lg, .elem-style-sicfi .elem-style-neomorphic .layui-btn-lg.layuimini-qiuck-module, .elem-style-neomorphic .elem-style-sicfi .layui-btn-lg.layuimini-qiuck-module, .elem-style-sicfi .elem-style-neomorphic .layui-btn-lg.panel, .elem-style-neomorphic .elem-style-sicfi .layui-btn-lg.panel, .elem-style-sicfi .elem-style-neomorphic .layui-btn-lg.layui-card, .elem-style-neomorphic .elem-style-sicfi .layui-btn-lg.layui-card, .elem-style-sicfi .elem-style-neomorphic .layui-btn-lg.layui-layer, .elem-style-neomorphic .elem-style-sicfi .layui-btn-lg.layui-layer, .elem-style-sicfi .elem-style-neomorphic .layui-btn-lg.layuimini-main, .elem-style-neomorphic .elem-style-sicfi .layui-btn-lg.layuimini-main, .elem-style-sicfi .elem-style-neomorphic .layui-table-tool .layui-btn-lg.layui-inline[lay-event], .elem-style-neomorphic .layui-table-tool .elem-style-sicfi .layui-btn-lg.layui-inline[lay-event], .elem-style-win7 .layui-layer-easy .layui-layer-btn .elem-style-sicfi a.layui-btn-lg, .elem-style-nes .layui-layer-easy .layui-layer-btn .elem-style-sicfi a.layui-btn-lg, .elem-style-sicfi .elem-style-nes .layuimini-container .layui-table-tool .layui-btn-lg.layui-inline[lay-event], .elem-style-nes .layuimini-container .layui-table-tool .elem-style-sicfi .layui-btn-lg.layui-inline[lay-event], .elem-style-sicfi .elem-style-gtk .layuimini-header-menu > li.layui-btn-lg.layui-nav-item, .elem-style-gtk .elem-style-sicfi .layuimini-header-menu > li.layui-btn-lg.layui-nav-item, .elem-style-sicfi .elem-style-gtk .layui-tab-brief > .layui-tab-title li.layui-btn-lg, .elem-style-gtk .layui-tab-brief > .layui-tab-title .elem-style-sicfi li.layui-btn-lg, .elem-style-sicfi .elem-style-gtk .layui-laydate-footer span.layui-btn-lg, .elem-style-gtk .layui-laydate-footer .elem-style-sicfi span.layui-btn-lg, .elem-style-sicfi .elem-style-gtk .laydate-footer-btns span.layui-btn-lg, .elem-style-gtk .laydate-footer-btns .elem-style-sicfi span.layui-btn-lg, .elem-style-sicfi .elem-style-gtk .layuimini-container .layui-table-tool .layui-btn-lg.layui-inline[lay-event], .elem-style-gtk .layuimini-container .layui-table-tool .elem-style-sicfi .layui-btn-lg.layui-inline[lay-event], .elem-style-sicfi .layui-layer-easy .layui-layer-btn a.layui-btn-lg { - padding-right: 25px; -} .elem-style-sicfi .layui-btn::before, .elem-style-sicfi .elem-style-neomorphic .layui-form-radio::before, .elem-style-neomorphic .elem-style-sicfi .layui-form-radio::before, .elem-style-sicfi .elem-style-neomorphic .layui-form-checkbox::before, .elem-style-neomorphic .elem-style-sicfi .layui-form-checkbox::before, .elem-style-sicfi .elem-style-neomorphic .layui-form-select dl::before, .elem-style-neomorphic .layui-form-select .elem-style-sicfi dl::before, .elem-style-sicfi .elem-style-neomorphic .layui-header .layui-nav .layui-nav-item::before, .elem-style-neomorphic .layui-header .layui-nav .elem-style-sicfi .layui-nav-item::before, .elem-style-sicfi .elem-style-neomorphic .layui-header .layuimini-header-menu > .layui-nav-item::before, .elem-style-neomorphic .layui-header .elem-style-sicfi .layuimini-header-menu > .layui-nav-item::before, .elem-style-sicfi .elem-style-neomorphic .layuimini-menu-left .layui-nav .layui-nav-item a::before, .elem-style-neomorphic .layuimini-menu-left .layui-nav .layui-nav-item .elem-style-sicfi a::before, .elem-style-sicfi .elem-style-neomorphic .layuimini-menu-left-zoom.layui-nav .layui-nav-item a::before, .elem-style-neomorphic .layuimini-menu-left-zoom.layui-nav .layui-nav-item .elem-style-sicfi a::before, .elem-style-sicfi .elem-style-neomorphic .layui-side.layui-bg-black::before, .elem-style-neomorphic .elem-style-sicfi .layui-side.layui-bg-black::before, @@ -812,9 +812,7 @@ border-radius: 5px; transition: all 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94); padding: 4px 9px; - -webkit-user-select: none; - -moz-user-select: none; - user-select: none; + user-select: none; color: #2e3436; outline-color: rgba(53, 132, 228, 0.5); border: 1px solid #cdc7c2; @@ -972,9 +970,7 @@ overflow: visible; border-radius: 5px; transition: all 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94); - -webkit-user-select: none; - -moz-user-select: none; - user-select: none; + user-select: none; outline-color: rgba(53, 132, 228, 0.5); border: 1px solid #cdc7c2; border-bottom-color: rgb(205, 199, 194); @@ -1052,9 +1048,7 @@ white-space: nowrap; color: #2e3436; font-weight: normal; - -webkit-user-select: none; - -moz-user-select: none; - user-select: none; + user-select: none; border: 0; border-top-style: none; border-right-style: none; @@ -1111,9 +1105,7 @@ border-radius: 5px; transition: all 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94); padding: 4px 9px; - -webkit-user-select: none; - -moz-user-select: none; - user-select: none; + user-select: none; color: #2e3436 !important; outline-color: rgba(53, 132, 228, 0.5); border: 1px solid #cdc7c2; @@ -1405,6 +1397,7 @@ cursor: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAzElEQVRYR+2X0Q6AIAhF5f8/2jYXZkwEjNSVvVUjDpcrGgT7FUkI2D9xRfQETwNIiWO85wfINfQUEyxBG2ArsLwC0jioGt5zFcwF4OYDPi/mBYKm4t0U8ATgRm3ThFoAqkhNgWkA0jJLvaOVSs7j3qMnSgXWBMiWPXe94QqMBMBc1VZIvaTu5u5pQewq0EqNZvIEMCmxAawK0DNkay9QmfFNAJUXfgGgUkLaE7j/h8fnASkxHTz0DGIBMCnBeeM7AArpUd3mz2x3C7wADglA8BcWMZhZAAAAAElFTkSuQmCC) 14 0, pointer; -webkit-user-select: none; -moz-user-select: none; + -ms-user-select: none; user-select: none; color: #212529; background-color: #fff; @@ -2118,8 +2111,7 @@ width: 100%; box-sizing: border-box; transition: all 0.2s ease-in-out; - -moz-appearance: none; - appearance: none; + appearance: none; -webkit-appearance: none; } .elem-style-neomorphic .layuimini-upload .layuimini-upload-btn { @@ -2175,7 +2167,166 @@ background-color: #EBECF0; } +.elem-style-fresh .layui-layout-admin .layui-header, +.elem-style-fresh .layuimini-header-menu { + height: 36px !important; + box-sizing: border-box; + border-bottom: 1px solid #f0f2f5; +} +.elem-style-fresh .layuimini-header-menu > .layui-nav-item, +.elem-style-fresh .layui-header > .layui-layout-right > .layui-nav-item { + height: 36px !important; + line-height: 36px !important; +} +.elem-style-fresh .layui-layout-admin .layui-header .layui-nav .layui-nav-item a { + line-height: 36px; +} +.elem-style-fresh .layui-layout-admin .layuimini-logo { + height: 36px !important; + line-height: 36px !important; + background-color: #fff !important; + color: #33383f !important; + box-sizing: border-box; + border-right: 1px solid #f0f2f5; +} +.elem-style-fresh .layui-layout-admin .layuimini-logo img { + height: 20px; +} +.elem-style-fresh .layui-layout-admin .layuimini-logo h1 { + color: #33383f !important; + font-size: 15px; +} +.elem-style-fresh .layuimini-tool { + line-height: 36px; + color: #6b7280 !important; +} +.elem-style-fresh .layuimini-tool i { + width: 20px; + height: 20px; + line-height: 20px; + margin-top: 8px; + border-radius: 4px; + color: #6b7280; +} +.elem-style-fresh .layui-layout-admin .layui-body, +.elem-style-fresh .layui-layout-admin .layui-side { + top: 36px !important; +} +.elem-style-fresh .layuimini-header-menu > .layui-nav-item > a, +.elem-style-fresh .layui-header > .layui-layout-right > .layui-nav-item > a { + padding: 0 14px; + color: #6b7280 !important; +} +.elem-style-fresh .layuimini-header-menu > .layui-nav-item:hover, +.elem-style-fresh .layuimini-header-menu > .layui-nav-item.layui-this, +.elem-style-fresh .layui-header > .layui-layout-right > .layui-nav-item:hover, +.elem-style-fresh .layui-header > .layui-layout-right > .layui-nav-item.layui-this { + background-color: transparent !important; +} +.elem-style-fresh .layuimini-header-menu > .layui-nav-item:hover > a, +.elem-style-fresh .layuimini-header-menu > .layui-nav-item.layui-this > a, +.elem-style-fresh .layui-header > .layui-layout-right > .layui-nav-item:hover > a, +.elem-style-fresh .layui-header > .layui-layout-right > .layui-nav-item.layui-this > a { + color: #1E9FFF !important; +} +.elem-style-fresh .layuimini-header-menu > .layui-nav-item.layui-this, +.elem-style-fresh .layui-header > .layui-layout-right > .layui-nav-item.layui-this { + box-shadow: inset 0 -2px 0 #1E9FFF; +} +.elem-style-fresh .layui-header .layui-nav-img { + width: 24px; + height: 24px; +} +.elem-style-fresh .layuimini-tab .layui-tab-title { + border-color: #f0f2f5; +} +.elem-style-fresh .layuimini-tab .layui-tab-title li { + border-right: 1px solid #f0f2f5; + color: #6b7280; +} +.elem-style-fresh .layuimini-tab .layui-tab-title span { + color: #6b7280; +} +.elem-style-fresh .layuimini-tab .layui-tab-title .layui-this { + box-shadow: inset 0 -2px 0 #1E9FFF; +} +.elem-style-fresh .layuimini-tab .layui-tab-title .layui-this span { + color: #1E9FFF !important; +} +.elem-style-fresh .layuimini-tab .layui-tab-title .layuimini-tab-active { + width: 6px; + height: 6px; + background-color: #1E9FFF; +} +.elem-style-fresh .layuimini-tab .layui-tab-control > li { + background-color: #fff; + border-top: #f0f2f5 1px solid; + border-bottom: #f0f2f5 1px solid; +} +.elem-style-fresh .layuimini-menu-left .layui-nav .layui-nav-item > a, +.elem-style-fresh .layuimini-menu-left .layui-nav .layui-nav-child a { + color: #4a5261 !important; +} +.elem-style-fresh .layuimini-menu-left .layui-nav .layui-nav-item a:hover { + background-color: #f5f7fa !important; +} +.elem-style-fresh .layui-side.layui-bg-black > .layuimini-menu-left > ul > .layui-nav-item:first-child { + border-top-color: #f0f2f5; +} +.elem-style-fresh .layuimini-menu-left .layui-nav-tree .layui-nav-child, +.elem-style-fresh .layuimini-menu-left-zoom.layui-nav-tree .layui-nav-child { + background-color: #fafbfc; +} +.elem-style-fresh .layuimini-menu-left .layui-nav-tree .layui-this, +.elem-style-fresh .layuimini-menu-left .layui-nav-tree .layui-this > a, +.elem-style-fresh .layuimini-menu-left .layui-nav-tree .layui-nav-child dd.layui-this, +.elem-style-fresh .layuimini-menu-left .layui-nav-tree .layui-nav-child dd.layui-this a, +.elem-style-fresh .layuimini-menu-left-zoom.layui-nav-tree .layui-this, +.elem-style-fresh .layuimini-menu-left-zoom.layui-nav-tree .layui-this > a, +.elem-style-fresh .layuimini-menu-left-zoom.layui-nav-tree .layui-nav-child dd.layui-this, +.elem-style-fresh .layuimini-menu-left-zoom.layui-nav-tree .layui-nav-child dd.layui-this a { + background-color: #e8f3ff !important; + color: #1E9FFF !important; + box-shadow: inset 3px 0 0 #1E9FFF; +} +.elem-style-fresh { + background: #f7f8fa; +} +.elem-style-fresh .layui-btn, .elem-style-fresh .elem-style-sicfi .layui-layer-easy .layui-layer-btn a, .elem-style-sicfi .layui-layer-easy .layui-layer-btn .elem-style-fresh a, .elem-style-fresh .elem-style-gtk .layuimini-container .layui-table-tool .layui-inline[lay-event], .elem-style-gtk .layuimini-container .layui-table-tool .elem-style-fresh .layui-inline[lay-event], .elem-style-fresh .elem-style-gtk .laydate-footer-btns span, .elem-style-gtk .laydate-footer-btns .elem-style-fresh span, .elem-style-fresh .elem-style-gtk .layui-laydate-footer span, .elem-style-gtk .layui-laydate-footer .elem-style-fresh span, .elem-style-fresh .elem-style-gtk .layui-tab-brief > .layui-tab-title li, .elem-style-gtk .layui-tab-brief > .layui-tab-title .elem-style-fresh li, .elem-style-fresh .elem-style-gtk .layuimini-header-menu > li.layui-nav-item, .elem-style-gtk .elem-style-fresh .layuimini-header-menu > li.layui-nav-item, .elem-style-fresh .elem-style-nes .layuimini-container .layui-table-tool .layui-inline[lay-event], .elem-style-nes .layuimini-container .layui-table-tool .elem-style-fresh .layui-inline[lay-event], .elem-style-fresh .elem-style-nes .layui-layer-easy .layui-layer-btn a, .elem-style-nes .layui-layer-easy .layui-layer-btn .elem-style-fresh a, .elem-style-fresh .elem-style-win7 .layui-layer-easy .layui-layer-btn a, .elem-style-win7 .layui-layer-easy .layui-layer-btn .elem-style-fresh a, .elem-style-fresh .elem-style-neomorphic .layui-table-tool .layui-inline[lay-event], .elem-style-neomorphic .layui-table-tool .elem-style-fresh .layui-inline[lay-event], .elem-style-fresh .elem-style-neomorphic .layuimini-main, .elem-style-neomorphic .elem-style-fresh .layuimini-main, .elem-style-fresh .elem-style-neomorphic .layui-layer, .elem-style-neomorphic .elem-style-fresh .layui-layer, .elem-style-fresh .elem-style-neomorphic .layui-card, .elem-style-neomorphic .elem-style-fresh .layui-card, .elem-style-fresh .elem-style-neomorphic .panel, .elem-style-neomorphic .elem-style-fresh .panel, .elem-style-fresh .elem-style-neomorphic .layuimini-qiuck-module, .elem-style-neomorphic .elem-style-fresh .layuimini-qiuck-module, .elem-style-fresh .elem-style-neomorphic .layui-side.layui-bg-black, .elem-style-neomorphic .elem-style-fresh .layui-side.layui-bg-black, +.elem-style-fresh .elem-style-neomorphic .layui-side.layui-bg-black > .layuimini-menu-left > ul, +.elem-style-neomorphic .elem-style-fresh .layui-side.layui-bg-black > .layuimini-menu-left > ul, +.elem-style-fresh .elem-style-neomorphic .layuimini-menu-left-zoom > ul, +.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-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 { + border-radius: 4px; +} +.elem-style-fresh .layui-card, +.elem-style-fresh .layuimini-container { + border-radius: 8px; + border: 1px solid #e5e9ef; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04); +} +.elem-style-fresh .layui-layer { + border-radius: 8px; + overflow: hidden; +} +.elem-style-fresh .layui-layer-title { + background-color: #fff; + border-bottom: 1px solid #f0f2f5; +} +.elem-style-fresh .layui-table thead tr, +.elem-style-fresh .layui-table-header { + background-color: #fafbfc; +} +.elem-style-fresh .layui-header .layui-nav-child { + top: 100% !important; + border-radius: 6px; + border: 1px solid #f0f2f5; + box-shadow: 0 6px 16px rgba(31, 35, 41, 0.08); +} + @font-face { font-family: "ark-pixel"; src: url("./nes/ark-pixel-font-12px/ark-pixel-12px-zh_cn.ttf") format("truetype"), url("./nes/ark-pixel-font-12px/ark-pixel-12px-zh_hk.ttf") format("truetype"), url("./nes/ark-pixel-font-12px/ark-pixel-12px-zh_tr.ttf") format("truetype"), url("./nes/ark-pixel-font-12px/ark-pixel-12px-zh_tw.ttf") format("truetype"), url("./nes/ark-pixel-font-12px/ark-pixel-12px-ja.ttf") format("truetype"), url("./nes/ark-pixel-font-12px/ark-pixel-12px-ko.ttf") format("truetype"), url("./nes/ark-pixel-font-12px/ark-pixel-12px-latin.ttf") format("truetype"); -} \ No newline at end of file +} diff --git a/public/static/common/css/theme/index.scss b/public/static/common/css/theme/index.scss index ebe8083..a927fff 100644 --- a/public/static/common/css/theme/index.scss +++ b/public/static/common/css/theme/index.scss @@ -26,6 +26,10 @@ @import 'neomorphic'; } +.elem-style-fresh { + @import 'fresh'; +} + @font-face { font-family: "ark-pixel"; src : url('./nes/ark-pixel-font-12px/ark-pixel-12px-zh_cn.ttf') format('truetype'), diff --git a/public/static/plugs/lay-module/layuimini/miniTheme.js b/public/static/plugs/lay-module/layuimini/miniTheme.js index e274ff7..f27b09a 100644 --- a/public/static/plugs/lay-module/layuimini/miniTheme.js +++ b/public/static/plugs/lay-module/layuimini/miniTheme.js @@ -286,7 +286,7 @@ */ render: function (options) { options.bgColorDefault = options.bgColorDefault || 0; - options.elemStyleDefault = options.elemStyleDefault || 'index'; + options.elemStyleDefault = options.elemStyleDefault || 'fresh'; options.listen = options.listen || false; var bgcolorId = localStorage.getItem('layuiminiBgcolorId'); if (bgcolorId === null || bgcolorId === undefined || bgcolorId === '') { @@ -308,7 +308,7 @@ renderElemStyle(elemStyleDefault) { - elemStyleDefault = elemStyleDefault || 'index'; + elemStyleDefault = elemStyleDefault || 'fresh'; var elemStyleName = localStorage.getItem('layuiminiElemStyleName'); if (!elemStyleName) elemStyleName = elemStyleDefault; @@ -450,6 +450,11 @@ }, configElemStyle() { var listElemStyle = [ + { + title: '清爽', + className: 'fresh', + defaultColorConfig: '12' + }, { title: '标准', className: 'normal'