feat(*):菜单样式修改

src/layout/menuCom.vue

@@ -143,7 +143,7 @@ const getMenuTitle = (item) => {
 }
 
 .submenu-box {
-  background: linear-gradient(225deg, rgba(128, 255, 178, .2), rgba(58, 120, 255, .1) 100%, #0049fa 0);
+  background: #181d21;
   color: #fff !important;
   span, a, i {
     color: #fff !important;
@@ -158,7 +158,8 @@ const getMenuTitle = (item) => {
 
 .is-active {
   color: #fff !important;
-  background: #03a1b3 !important;
+  // background: #03a1b3 !important;
+  background: linear-gradient(225deg, rgba(128, 255, 178, .4), rgba(58, 120, 255, .1) 100%, #0049fa 0);
   span {
     color: #fff !important;
   }
@@ -168,7 +169,7 @@ const getMenuTitle = (item) => {
   .is-active {
     .el-submenu__title {
       color: #FFFFFFFF !important;
-      background: #03A1B3FF !important;
+      // background: #03A1B3FF !important;
 
       .el-icon-arrow-down {
         color: #FFFFFFFF;
@@ -198,19 +199,18 @@ const getMenuTitle = (item) => {
 
 .el-menu-item:hover, .el-sub-menu__title:hover {
   color: #fff !important;
-  background: #03a1b3 !important;
+  background: linear-gradient(225deg, rgba(128, 255, 178, .6), rgba(58, 120, 255, .1) 100%, #0049fa 0) !important;
   span {
     color: #fff !important;
   }
 }
-
 // menu hover
 .submenu-title-noDropdown,
 .el-submenu__title {
-  background: linear-gradient(225deg, rgba(128, 255, 178, .2), rgba(58, 120, 255, .1) 100%, #0049fa 0) !important;
+  // background: linear-gradient(225deg, rgba(128, 255, 178, .2), rgba(58, 120, 255, .1) 100%, #0049fa 0) !important;
   color: #FFFFFF !important;
   &:hover {
-    background-color: #03a1b3 !important;
+    background: linear-gradient(225deg, rgba(128, 255, 178, .6), rgba(58, 120, 255, .1) 100%, #0049fa 0) !important;
   }
 }
 
@@ -219,9 +219,9 @@ const getMenuTitle = (item) => {
 }
 
 .submenu-box .is-active {
-  background-color: #fff !important;
+  // background-color: #fff !important;
   span {
-    color: #055f7c !important;
+    // color: #055f7c !important;
   }
 }
 

src/style.css

@@ -35,7 +35,7 @@
 
 .page-container {
   width: 100%;
-  background: #ffffff;
+  background: #181d21;
   border-radius: 6px;
   box-shadow: 0px 3px 6px 0px rgba(13, 15, 18, 0.1);
   padding: 1rem;
@@ -46,7 +46,7 @@
 
 .page-container {
     width: 100%;
-    background: #ffffff;
+    background: #181d21;
     border-radius: 6px;
     box-shadow: 0px 3px 6px 0px rgba(13, 15, 18, 0.10);
     padding: 1rem;
@@ -85,3 +85,18 @@ select:-webkit-autofill {
     background-image: none;
     transition: background-color 50000s ease-in-out 0s;
 }
+
+.el-menu { 
+    border-right: unset !important;
+}
+.el-menu-item:hover {
+    background: transparent !important;
+}
+.el-menu-item .is-active{
+    background: transparent !important;
+}
+
+.el-breadcrumb__item:last-child .el-breadcrumb__inner {
+    color: #ccc !important;
+    padding-left: 16px;
+}
\ No newline at end of file