From 6948cb2db573404b8488f04a5ee5db63189b31a7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B0=B1=E7=9C=A0=E5=84=80=E5=BC=8F?= <854085467@qq.com> Date: Sun, 6 Feb 2022 13:14:41 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=BF=E6=8D=A2=E5=85=A8=E5=B1=80=E4=B8=BB?= =?UTF-8?q?=E9=A2=98=E5=8F=98=E9=87=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- build.less.ts | 2 +- src/component/block/index.less | 4 +- src/component/menu/index.less | 12 +++-- src/component/slider/index.less | 12 +++-- src/component/timeline/index.less | 4 +- src/theme/index.less | 76 ++++++++++++++++--------------- 6 files changed, 60 insertions(+), 50 deletions(-) diff --git a/build.less.ts b/build.less.ts index d1176c5c..66cc0f59 100644 --- a/build.less.ts +++ b/build.less.ts @@ -24,7 +24,7 @@ if(exists){ var c = fs.readFileSync(path); content += c.toString() + '\n\n'; - // 如何删除所有 @import 关键字 + // @ts-ignore content = content.replaceAll(/\@import.*?\;/g,""); fs.writeFileSync('./lib/index.less',content); } diff --git a/src/component/block/index.less b/src/component/block/index.less index 58295cba..cfe31047 100644 --- a/src/component/block/index.less +++ b/src/component/block/index.less @@ -1,8 +1,10 @@ +@import "../../theme/variable.less"; + .layui-elem-quote { margin-bottom: 10px; padding: 15px; line-height: 1.6; - border-left: 5px solid #5fb878; + border-left: 5px solid @global-checked-color; border-radius: 0 2px 2px 0; background-color: #fafafa; } diff --git a/src/component/menu/index.less b/src/component/menu/index.less index 9032b3cc..4e9f6ad7 100644 --- a/src/component/menu/index.less +++ b/src/component/menu/index.less @@ -1,3 +1,5 @@ +@import "../../theme/variable.less"; + .layui-nav .layui-show.layui-anim-upbit .layui-show.layui-anim-upbit { top: 0px; left: 94px; @@ -53,7 +55,7 @@ top: 0; width: 0; height: 3px; - background-color: #5fb878; + background-color: @global-checked-color; transition: all 0.2s; -webkit-transition: all 0.2s; pointer-events: none; @@ -187,13 +189,13 @@ .layui-nav-tree .layui-nav-bar { width: 5px; height: 0; - background-color: #009688; + background-color: @global-primary-color; } .layui-nav-tree .layui-this, .layui-nav-tree .layui-nav-child dd.layui-this, .layui-nav-tree .layui-this > a:hover { - background-color: #009688; + background-color: @global-primary-color; color: #fff; } @@ -252,12 +254,12 @@ .layui-nav-tree.layui-bg-gray .layui-nav-child dd.layui-this, .layui-nav-tree.layui-bg-gray .layui-nav-child dd.layui-this a { background: 0 0 !important; - color: #5fb878 !important; + color: @global-checked-color !important; font-weight: 700; } .layui-nav.layui-bg-gray .layui-nav-bar { - background-color: #5fb878; + background-color: @global-checked-color; } .layui-nav-side { diff --git a/src/component/slider/index.less b/src/component/slider/index.less index 9b4dac98..3db87a9d 100644 --- a/src/component/slider/index.less +++ b/src/component/slider/index.less @@ -1,3 +1,5 @@ +@import "../../theme/variable.less"; + // 横向样式 .layui-slider-v { width: 100%; @@ -18,7 +20,7 @@ height: 12px; background-color: white; position: absolute; - border: 2px solid rgb(0, 150, 136); + border: 2px solid @global-primary-color; border-radius: 50%; cursor: pointer; left: 0%; @@ -31,7 +33,7 @@ position: absolute; top: 6px; left: 0; - background-color: rgb(0, 150, 136); + background-color: @global-primary-color; z-index: 1; } @@ -46,7 +48,7 @@ cursor: not-allowed !important; } .layui-slider-disabled-rate { - background-color: rgb(0, 150, 136) !important; + background-color: @global-primary-color !important; } // 纵向样式 @@ -67,7 +69,7 @@ background-color: white; position: absolute; // top: -7px; - border: 2px solid rgb(0, 150, 136); + border: 2px solid @global-primary-color; border-radius: 50%; cursor: pointer; bottom: 0%; @@ -81,7 +83,7 @@ position: absolute; bottom: 0; left: 7px; - background-color: rgb(0, 150, 136); + background-color: @global-primary-color; z-index: 1; } diff --git a/src/component/timeline/index.less b/src/component/timeline/index.less index f31bf081..d8bb19a6 100644 --- a/src/component/timeline/index.less +++ b/src/component/timeline/index.less @@ -1,3 +1,5 @@ +@import "../../theme/variable.less"; + .layui-timeline { padding-left: 5px; } @@ -16,7 +18,7 @@ height: 20px; line-height: 20px; background-color: #fff; - color: #5fb878; + color: @global-checked-color; border-radius: 50%; text-align: center; cursor: pointer; diff --git a/src/theme/index.less b/src/theme/index.less index a85e34d8..1deb0d2f 100644 --- a/src/theme/index.less +++ b/src/theme/index.less @@ -1,3 +1,5 @@ +@import "./variable.less"; + .layui-inline, img { display: inline-block; @@ -278,7 +280,7 @@ a cite { height: 60px; line-height: 60px; text-align: center; - color: #009688; + color: @global-primary-color; font-size: 16px; box-shadow: 0 1px 2px 0 rgb(0 0 0 / 15%); } @@ -350,7 +352,7 @@ a cite { height: 6px; border-radius: 20px; text-align: right; - background-color: #5fb878; + background-color: @global-checked-color; transition: all 0.3s; -webkit-transition: all 0.3s; } @@ -483,7 +485,7 @@ a cite { } .layui-bg-green { - background-color: #009688 !important; + background-color: @global-primary-color !important; } .layui-bg-cyan { @@ -539,8 +541,8 @@ a cite { } .layui-border-green { - border-color: #009688 !important; - color: #009688 !important; + border-color: @global-primary-color !important; + color: @global-primary-color !important; } .layui-border-cyan { @@ -664,7 +666,7 @@ a cite { } .layui-font-green { - color: #009688 !important; + color: @global-primary-color !important; } .layui-font-cyan { @@ -1007,7 +1009,7 @@ a cite { .layui-form-select dl dd.layui-this { background-color: #f6f6f6; - color: #5fb878; + color: @global-checked-color; font-weight: 700; } @@ -1105,17 +1107,17 @@ a cite { .layui-form-checked, .layui-form-checked:hover { - border-color: #5fb878; + border-color: @global-checked-color; } .layui-form-checked span, .layui-form-checked:hover span { - background-color: #5fb878; + background-color: @global-checked-color; } .layui-form-checked i, .layui-form-checked:hover i { - color: #5fb878; + color: @global-checked-color; } .layui-form-item .layui-form-checkbox { @@ -1157,13 +1159,13 @@ a cite { } .layui-form-checkbox[lay-skin="primary"]:hover i { - border-color: #5fb878; + border-color: @global-checked-color; color: #fff; } .layui-form-checked[lay-skin="primary"] i { - border-color: #5fb878 !important; - background-color: #5fb878; + border-color: @global-checked-color !important; + background-color: @global-checked-color; color: #fff; } @@ -1219,8 +1221,8 @@ a cite { } .layui-form-onswitch { - border-color: #5fb878; - background-color: #5fb878; + border-color: @global-checked-color; + background-color: @global-checked-color; } .layui-checkbox-disabled, @@ -1283,7 +1285,7 @@ a cite { .layui-form-radio:hover *, .layui-form-radioed, .layui-form-radioed > i { - color: #5fb878; + color: @global-checked-color; } .layui-radio-disabled > i { @@ -1570,7 +1572,7 @@ a cite { } .layui-laypage a:hover { - color: #009688; + color: @global-primary-color; } .layui-laypage em { @@ -1602,7 +1604,7 @@ a cite { padding: 1px; width: 100%; height: 100%; - background-color: #009688; + background-color: @global-primary-color; } .layui-laypage-em { @@ -1668,7 +1670,7 @@ a cite { .layui-laypage input:focus, .layui-laypage select:focus { - border-color: #009688 !important; + border-color: @global-primary-color !important; } .layui-laypage button { @@ -1765,11 +1767,11 @@ a cite { .layui-upload-drag .layui-icon { font-size: 50px; - color: #009688; + color: @global-primary-color; } .layui-upload-drag[lay-over] { - border-color: #009688; + border-color: @global-primary-color; } .layui-upload-iframe { @@ -1904,12 +1906,12 @@ a cite { .layui-menu .layui-menu-item-checked2 { background-color: #f6f6f6 !important; border-radius: 2px; - color: #5fb878; + color: @global-checked-color; } .layui-menu .layui-menu-item-checked a, .layui-menu .layui-menu-item-checked2 a { - color: #5fb878; + color: @global-checked-color; } .layui-menu .layui-menu-item-checked:after { @@ -1917,7 +1919,7 @@ a cite { right: 0; top: 0; bottom: 0; - border-right: 3px solid #5fb878; + border-right: 3px solid @global-checked-color; content: ""; } @@ -1981,7 +1983,7 @@ a cite { .layui-menu-lg .layui-menu-body-title a:hover, .layui-menu-lg li:hover { background: 0 0; - color: #5fb878; + color: @global-checked-color; } .layui-menu-lg li .layui-menu-body-panel { @@ -2114,8 +2116,8 @@ a cite { } .layui-iconpicker-list li.layui-this { - border-color: #5fb878; - color: #5fb878; + border-color: @global-checked-color; + color: @global-checked-color; } .layui-iconpicker-list li .layui-icon { @@ -2196,7 +2198,7 @@ a cite { height: 20px; line-height: 20px; border: none; - color: #009688; + color: @global-primary-color; } .layui-keyboard-header button:first-child { @@ -2230,8 +2232,8 @@ a cite { } .layui-keyboard-list li.layui-this { - border-color: #5fb878; - color: #5fb878; + border-color: @global-checked-color; + color: @global-checked-color; } .layui-breadcrumb { @@ -2247,7 +2249,7 @@ a cite { } .layui-breadcrumb a:hover { - color: #5fb878 !important; + color: @global-checked-color !important; } .layui-breadcrumb a:nth-last-child(2) { @@ -2402,14 +2404,14 @@ a cite { } .layui-tab-brief > .layui-tab-title .layui-this { - color: #009688; + color: @global-primary-color; } .layui-tab-brief > .layui-tab-more li.layui-this:after, .layui-tab-brief > .layui-tab-title .layui-this:after { border: none; border-radius: 0; - border-bottom: 2px solid #5fb878; + border-bottom: 2px solid @global-checked-color; } .layui-tab-brief[overflow] > .layui-tab-title .layui-this:after { @@ -2452,7 +2454,7 @@ a cite { .layui-tab-card > .layui-tab-more .layui-this { background: 0 0; - color: #5fb878; + color: @global-checked-color; } .layui-tab-card > .layui-tab-more .layui-this:after { @@ -2910,8 +2912,8 @@ body .layui-util-face .layui-layer-content { display: block; margin: 0; padding: 0 15px; - background-color: #5fb878; - border-color: #5fb878; + background-color: @global-checked-color; + border-color: @global-checked-color; color: #fff; } @@ -3306,7 +3308,7 @@ body .layui-util-face .layui-layer-content { } .layui-slider-input-btn i:hover { - color: #009688; + color: @global-primary-color; } .layui-slider-vertical {