From 6467e4115c5284a15f393e3dd2ffb07ebd2a96d6 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期一, 28 十二月 2020 18:31:48 +0800
Subject: [PATCH] 2020-12-28

---
 src/assets/css/viewstyle.scss |  314 ++++++++++++++++++++++++++++++++++++++++++++++------
 1 files changed, 277 insertions(+), 37 deletions(-)

diff --git a/src/assets/css/viewstyle.scss b/src/assets/css/viewstyle.scss
index 02b146b..87163cc 100644
--- a/src/assets/css/viewstyle.scss
+++ b/src/assets/css/viewstyle.scss
@@ -1,80 +1,320 @@
-.mk-white {
-  > .flex-container {
-    > .header-container {
-      background: #ffffff;
-      color: #000000;
-      box-shadow: 0 2px 8px #f0f1f2;
+// bg1     涓昏儗鏅壊
+// bg2     娆¤儗鏅壊
+// font1   涓诲瓧浣撻鑹�
+// color1  1闃惰壊 - 搴曡壊
+// color2  2闃惰壊
+// color3  3闃惰壊
+// color4  4闃惰壊
+// color5  5闃惰壊
+// color6  6闃惰壊 - 涓昏壊绯�
+// color7  7闃惰壊
+// color8  8闃惰壊
+// color9  9闃惰壊
+// color10 10闃惰壊
+@mixin viewstyle($bg1, $bg2, $font1, $font2, $color1, $color2, $color3, $color4, $color5, $color6, $color7, $color8, $color9, $color10) {
+  .login-container {
+    background-color: $bg1;
+    .logo {
+      border-color: transparent;
+      .plat-name {
+        color: $font1;
+      }
+    }
+    .login-middle {
+      border-color: transparent;
+      .login-form-button {
+        background-color: $color6;
+        border-color: $color6;
+      }
+      .login-form-button[disabled] {
+        background-color: $color5;
+        border-color: $color5;
+      }
+      button.vercode {
+        color: $color6;
+      }
+      .ant-tabs {
+        .ant-tabs-tab.ant-tabs-tab-active {
+          color: $color6;
+        }
+        .ant-tabs-tab:hover {
+          color: $color6;
+        }
+      }
+    }
+    .login-bottom {
+      color: $font1;
+      a {
+        color: $font1;
+      }
+    }
+  }
 
+  #root > .main-view {
+    > .header-container {
+      background: $bg1;
+      color: $font1;
+      box-shadow: 0 1px 1px #d9d9d9;
+
+      .header-setting span {
+        color: $font1;
+      }
       > .header-collapse i {
-        color: #000000;
+        color: $font1;
       }
       > .header-menu {
         li {
           span {
-            color: #000000;
+            color: $font1;
           }
     
           &:hover {
             span {
-              color: #1890ff;
-              border-bottom: 4px solid #1890ff;
+              color: $color6;
+              border-bottom: 4px solid $color6;
             }
           }
           &.active {
             span {
-              color: #1890ff;
-              border-bottom: 4px solid #1890ff;
+              color: $color6;
+              border-bottom: 4px solid $color6;
             }
           }
         }
       }
-      > .header-setting span {
-        color: #000000;
-      }
-      > .header-edit-box .dragdashboard {
-        background: #ffffff;
-      }
     }
     > .side-menu {
       border-right: 1px solid #d9d9d9;
-      background: #ffffff;
+      background: $bg1;
       > .ant-menu {
-        background: #ffffff;
+        background: $bg1;
         > .ant-menu-submenu {
-          color: #000000;
-          background: #ffffff;
+          color: $font1;
+          background: transparent;
           > .ant-menu-submenu-title {
-            background: #ffffff;
             &:hover {
-              color: #1890ff;
+              color: $font1;
             }
             > .ant-menu-submenu-arrow:before {
-              background: #000000;
+              background: $font1;
             }
             > .ant-menu-submenu-arrow:after {
-              background: #000000;
+              background: $font1;
             }
           }
           > .ant-menu-sub {
-            background: #ffffff;
-            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25) inset;
+            background: transparent;
+            box-shadow: none;
             .ant-menu-item {
-              border-bottom: 1px solid #d9d9d9;
-              // background-color: #c4ebfd;
               a {
-                color: #000000;
+                color: $font2;
               }
             }
           }
         }
         > .ant-menu-submenu.ant-menu-submenu-open {
-          color: #1890ff;
+          > .ant-menu-submenu-title {
+            background: $bg2;
+          }
         }
       }
-      // .ant-menu-inline.ant-menu-sub {
-      //   background: #ffffff;
-      //   color: #000000;
-      // }
+    }
+    > .side-menu:not(.edit) {
+      > .ant-menu {
+        > .ant-menu-submenu {
+          > .ant-menu-sub {
+            .ant-menu-item.ant-menu-item-active, .ant-menu-item.ant-menu-item-selected {
+              background: $color5;
+              color: #ffffff;
+              a {
+                color: #ffffff;
+              }
+            }
+          }
+        }
+      }
+    }
+    >.content-box {
+      >.content-header {
+        >.ant-tabs {
+          >.ant-tabs-bar {
+            .ant-tabs-tab:hover {
+              color: $color5;
+            }
+            .ant-tabs-tab.ant-tabs-tab-active {
+              color: $color6;
+            }
+            .ant-tabs-ink-bar {
+              background-color: $color6;
+            }
+          }
+        }
+      }
+      .normal-data-table, .normal-custom-table {
+        table {
+          .ant-table-tbody {
+            > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) > td {
+              background-color: $color1;
+            }
+            > tr.ant-table-row-selected:not(.background) td {
+              background-color: $color1;
+            }
+            > tr.ant-table-row-selected:not(.background):hover .ant-table-column-sort {
+              background-color: $color1;
+            }
+            > tr.mk-row-active:not(.background) td {
+              background-color: $color3;
+            }
+            > tr.ant-table-row-selected.mk-row-active:not(.background):hover .ant-table-column-sort {
+              background-color: $color3;
+            }
+          }
+        }
+      }
+      .top-search {
+        >.ant-row {
+          .ant-col.search-button {
+            .ant-btn:not(.ant-btn-primary):active, .ant-btn:not(.ant-btn-primary).active, .ant-btn:not(.ant-btn-primary):hover, .ant-btn:not(.ant-btn-primary):focus {
+              color: $color7;
+              border-color: $color7;
+            }
+            .ant-btn-primary {
+              background-color: $color6;
+              border-color: $color6;
+            }
+          }
+        }
+      }
+      .ant-tabs-nav .ant-tabs-tab-active {
+        color: $color6;
+      }
+      .ant-tabs-nav .ant-tabs-ink-bar {
+        background-color: $color6;
+      }
+      .ant-tabs-nav .ant-tabs-tab:active {
+        color: $color7;
+      }
+      .ant-tabs-nav .ant-tabs-tab:hover {
+        color: $color5;
+      }
+      .ant-pagination {
+        .ant-pagination-item-active {
+          border-color: $color6;
+          a {
+            color: $color6;
+          }
+        }
+        .ant-pagination-item:hover a {
+          color: $color6;
+        }
+        .ant-pagination-prev:hover .ant-pagination-item-link {
+          color: $color6;
+        }
+        .ant-pagination-next:hover .ant-pagination-item-link {
+          color: $color6;
+        }
+      }
     }
   }
-}
\ No newline at end of file
+
+  // 绯荤粺鏍峰紡淇敼
+  // .ant-select-dropdown-menu-item:hover:not(.ant-select-dropdown-menu-item-disabled) {
+  //   background-color: $color1;
+  // }
+  // .ant-select-dropdown-menu-item-active:not(.ant-select-dropdown-menu-item-disabled) {
+  //   background-color: $color1;
+  // }
+  // // 澶嶉�夋
+  // .ant-checkbox-checked .ant-checkbox-inner {
+  //   background-color: $color6;
+  //   border-color: $color6;
+  // }
+  // .ant-checkbox-checked::after {
+  //   border: 1px solid $color6;
+  // }
+  // .ant-checkbox-indeterminate .ant-checkbox-inner::after {
+  //   background-color: $color6;
+  // }
+  // .ant-checkbox-wrapper:hover .ant-checkbox-inner, .ant-checkbox:hover .ant-checkbox-inner, .ant-checkbox-input:focus + .ant-checkbox-inner {
+  //   border-color: $color6;
+  // }
+  // // 涓嬫媺妗�
+  // .ant-select-selection:hover {
+  //   border-color: $color5;
+  // }
+  // .ant-select-focused .ant-select-selection, .ant-select-selection:focus, .ant-select-selection:active {
+  //   border-color: $color5;
+  //   box-shadow: 0 0 0 2px $color2;
+  // }
+  // // 鍒囨崲
+  // .ant-switch-checked {
+  //   background-color: $color6;
+  // }
+  // // 杈撳叆妗�
+  // .ant-input:hover {
+  //   border-color: $color5;
+  // }
+  // .ant-input:focus, .ant-input:active {
+  //   border-color: $color5;
+  //   box-shadow: 0 0 0 2px $color2;
+  // }
+  // .ant-input-number-focused {
+  //   border-color: $color5;
+  //   box-shadow: 0 0 0 2px $color2;
+  // }
+  // .ant-input-number:hover, .ant-input-number:focus, .ant-input-number:active, .ant-input-number-input:hover, .ant-input-number-input:focus, .ant-input-number-input:active, .ant-input-number-focused:hover, .ant-input-number-focused:focus, .ant-input-number-focused:active {
+  //   border-color: $color5;
+  // }
+  // .ant-input-number:focus, .ant-input-number:active {
+  //   box-shadow: 0 0 0 2px $color2;
+  // }
+  // // 鏃ュ巻
+  // .ant-calendar-picker:hover .ant-calendar-picker-input:not(.ant-input-disabled) {
+  //   border-color: $color5;
+  // }
+}
+
+@mixin bgblack() {
+  #root > .main-view {
+    > .header-container {
+      box-shadow: none;
+      > .header-menu {
+        li {
+          &:hover, &.active {
+            span {
+              color: #ffffff;
+            }
+          }
+        }
+      }
+    }
+  }
+}
+
+body.mk-blue-black {
+  --antd-wave-shadow-color: #1890ff;
+  @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65), #e6f7ff, #bae7ff, #91d5ff, #69c0ff, #40a9ff, #1890ff, #096dd9, #0050b3, #003a8c, #002766);
+  @include bgblack();
+}
+body.mk-blue-white {
+  --antd-wave-shadow-color: #1890ff;
+  @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #e6f7ff, #bae7ff, #91d5ff, #69c0ff, #40a9ff, #1890ff, #096dd9, #0050b3, #003a8c, #002766);
+}
+body.mk-red-black {
+  --antd-wave-shadow-color: #f5222d;
+  @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65), #fff1f0, #ffccc7, #ffa39e, #ff7875, #ff4d4f, #f5222d, #cf1322, #a8071a, #820014, #5c0011);
+  @include bgblack();
+}
+body.mk-red-white {
+  --antd-wave-shadow-color: #f5222d;
+  @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #fff1f0, #ffccc7, #ffa39e, #ff7875, #ff4d4f, #f5222d, #cf1322, #a8071a, #820014, #5c0011);
+}
+body.mk-orange-black {
+  --antd-wave-shadow-color: #fa8c16;
+  @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65), #fff7e6, #ffe7ba, #ffd591, #ffc069, #ffa940, #fa8c16, #d46b08, #ad4e00, #873800, #612500);
+  @include bgblack();
+}
+body.mk-orange-white {
+  --antd-wave-shadow-color: #fa8c16;
+  @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #fff7e6, #ffe7ba, #ffd591, #ffc069, #ffa940, #fa8c16, #d46b08, #ad4e00, #873800, #612500);
+}

--
Gitblit v1.8.0