对配色进行一些调整

Author: bigrocs

src/components/Layout/Sidebar.vue

@@ -4,18 +4,14 @@
     <div class="layout-logo-mini">Core</div>
     <el-menu default-active="1-4-1" theme="dark" class="sidebar-menu">
       <el-submenu index="1">
-        <template slot="title"><i class="el-icon-message"></i> 导航一</template>
-        <el-menu-item-group title="分组一">
+        <template slot="title"><i class="el-icon-message"></i><span>导航一</span></template>
           <el-menu-item index="1-1">选项1</el-menu-item>
           <el-menu-item index="1-2">选项2</el-menu-item>
-        </el-menu-item-group>
-        <el-menu-item-group title="分组2">
           <el-menu-item index="1-3">选项3</el-menu-item>
-        </el-menu-item-group>
-        <el-submenu index="1-4">
-          <template slot="title">选项4</template>
-          <el-menu-item index="1-4-1">选项1</el-menu-item>
-        </el-submenu>
+          <el-submenu index="1-4">
+            <template slot="title">选项4</template>
+            <el-menu-item index="1-4-1">选项1</el-menu-item>
+          </el-submenu>
       </el-submenu>
       <el-submenu index="2">
         <template slot="title">导航一</template>
@@ -55,7 +51,7 @@
     name: 'sidebar'
   }
 </script>
-<style lang="scss" scoped>
+<style lang="scss">
   @import  './../../assets/sass/mixin.scss';
   .layout-logo-lg {
     background-color: #d73925;
@@ -88,5 +84,24 @@
   .el-menu {
     border-radius: 0px;
   }
-
+  .el-menu--dark{
+    background-color: #222d32!important;
+  }
+  .el-submenu__title{
+    height: 44px!important;
+    line-height: 44px!important;
+  }
+  .el-menu-item{
+    height: 44px!important;
+    line-height: 44px!important;
+  }
+  .el-menu--dark .el-submenu .el-menu{
+    background-color: #2c3b41!important;
+  }
+  .el-menu--dark .el-menu-item, .el-menu--dark .el-submenu__title{
+    color: #b8c7ce;
+  }
+  .el-menu--horizontal.el-menu--dark .el-submenu .el-menu-item.is-active, .el-menu-item.is-active{
+    color:#fff;
+  }
 </style>