feat: 主题支持次色可配置

src/component/avatarList/index.less

@@ -0,0 +1 @@
+@import "../../theme/variable.less";

src/component/body/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 .layui-body {
   display: block;
   flex: 1;

src/component/breadcrumb/index.less

@@ -0,0 +1 @@
+@import "../../theme/variable.less";

src/component/breadcrumbItem/index.less

@@ -0,0 +1 @@
+@import "../../theme/variable.less";

src/component/button/index.less

@@ -56,7 +56,7 @@
 }
 
 .layui-btn-primary {
-  border-color: @global-border-color;
+  border-color: @global-neutral-color-3;
   background: 0 0;
   color: #666;
 }

src/component/buttonContainer/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 .layui-btn-container {
   font-size: 0;
   .layui-btn {

src/component/carousel/index.less

@@ -0,0 +1 @@
+@import "../../theme/variable.less";

src/component/carouselItem/index.less

@@ -0,0 +1 @@
+@import "../../theme/variable.less";

src/component/checkbox/index.less

@@ -0,0 +1 @@
+@import "../../theme/variable.less";

src/component/checkboxGroup/index.less

@@ -0,0 +1 @@
+@import "../../theme/variable.less";

src/component/col/index.less

@@ -0,0 +1 @@
+@import "../../theme/variable.less";

src/component/collapse/index.less

@@ -0,0 +1 @@
+@import "../../theme/variable.less";

src/component/collapseItem/index.less

@@ -0,0 +1 @@
+@import "../../theme/variable.less";

src/component/colorPicker/index.vue

@@ -131,6 +131,7 @@ let blue = ref(0);
 let alpha = ref(1);
 
 onMounted(() => {
+  console.log(props.modelValue)
   let { r, g, b, a } = parseColor(props.modelValue);
   red.value = r;
   green.value = g;

src/component/container/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 .layui-container {
   position: relative;
   margin: 0 auto;

src/component/countUp/index.less

@@ -0,0 +1 @@
+@import "../../theme/variable.less";

src/component/dropdown/index.less

@@ -0,0 +1 @@
+@import "../../theme/variable.less";

src/component/dropdownItem/index.less

@@ -0,0 +1 @@
+@import "../../theme/variable.less";

src/component/empty/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 .layui-empty {
   margin: 0 8px;
   font-size: 14px;

src/component/exception/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 .layui-exception {
   .layui-exception-image {
     width: 50%;

src/component/field/index.less

@@ -4,7 +4,7 @@
 @field-border-radius: var(--field-border-radius);
 
 :root {
-  --field-border-color: @global-border-color;
+  --field-border-color: @global-neutral-color-3;
   --field-border-radius: @global-border-radius;
 }
 

src/component/footer/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 .layui-footer {
   box-sizing: border-box;
 }

src/component/form/index.less

@@ -0,0 +1 @@
+@import "../../theme/variable.less";

src/component/formItem/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 @error_color: red;
 
 .layui-required {

src/component/fullscreen/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 .layui-fullscreen {
   position: fixed;
   top: 0;

src/component/header/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 .layui-header {
   box-sizing: border-box;
   height: 60px;

src/component/icon/index.less

@@ -0,0 +1 @@
+@import "../../theme/variable.less";

src/component/iconPicker/index.less

@@ -94,7 +94,7 @@
 }
 
 .layui-iconpicker-list li:hover {
-  background-color: #fafafa;
+  background-color: @global-neutral-color-1;
   color: rgba(0, 0, 0, 0.5);
 }
 

src/component/input/index.less

@@ -5,7 +5,7 @@
 
 :root {
   --input-border-radius: @global-border-radius;
-  --input-border-color: @global-border-color;
+  --input-border-color: @global-neutral-color-3;
 }
 
 .layui-input {

src/component/layout/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 .layui-layout {
   flex: 1;
   display: flex;

src/component/panel/index.less

@@ -6,7 +6,7 @@
 @panel-back-color: var(--panel-back-color);
 
 :root {
-  --panel-border-color: @global-border-color;
+  --panel-border-color: @global-neutral-color-3;
   --panel-border-radius: @global-border-radius;
   --panel-fore-color: @global-fore-color;
   --panel-back-color: @global-back-color;

src/component/popper/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 // 主题颜色
 // 浅色 --> 默认使用
 @ligh-background: #FFF;

src/component/quote/index.less

@@ -14,7 +14,7 @@
   margin-bottom: 10px;
   border-left: 5px solid @block-default-color;
   border-radius: @block-border-radius;
-  background-color: #fafafa;
+  background-color: @global-neutral-color-1;
 }
 
 .layui-quote-nm {

src/component/rate/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 .layui-rate,
 .layui-rate * {
   display: inline-block;

src/component/result/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 .result {
   text-align: center;
 }

src/component/row/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 .layui-row:after,
 .layui-row:before {
   content: "";

src/component/select/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 dl.layui-anim-upbit > dd input[type="checkbox"] {
   display: none;
 }

src/component/side/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 .layui-side {
   overflow: auto;
   box-sizing: border-box;

src/component/skeleton/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 .lay-skeleton {
   .lay-skeleton-item {
     height: 16px;

src/component/splitPanel/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 .lay-split-panel {
   height: 100%;
   display: flex;
@@ -16,7 +18,7 @@
     height: 100%;
     width: 3px;
     border: 1px #eeeeee solid;
-    background-color: #fafafa;
+    background-color: @global-neutral-color-1;
     border-left: none;
     border-right: none;
     cursor: col-resize;
@@ -48,7 +50,7 @@
     height: 3px;
     cursor: row-resize;
     border: 1px #eeeeee solid;
-    background-color: #fafafa;
+    background-color: @global-neutral-color-1;
     border-top: none;
     border-bottom: none;
     &:before {

src/component/step/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 @width-height-pace: 24px;
 @step-color: @step-success-color;
 @step-fail-color: #ff5722;

src/component/table/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 .laytable-cell-checkbox {
   width: 34px;
 }
@@ -32,7 +34,7 @@
 .layui-table-total,
 .layui-table-total tr,
 .layui-table[lay-even] tr:nth-child(even) {
-  background-color: #fafafa;
+  background-color: @global-neutral-color-1;
 }
 
 .layui-table td,

src/component/textarea/index.less

@@ -5,7 +5,7 @@
 
 :root {
   --textarea-border-radius: @global-border-radius;
-  --textarea-border-color: @global-border-color;
+  --textarea-border-color: @global-neutral-color-3;
 }
 
 .layui-textarea {

src/component/tree/index.less

@@ -1,3 +1,5 @@
+@import "../../theme/variable.less";
+
 .layui-tree {
   line-height: 22px;
 }