perf: modify menu style

src/layout/components/NavLeft/Item.vue

@@ -18,8 +18,12 @@ export default {
     const vNodes = []
 
     if (icon) {
+      if (icon.startsWith('fa')) {
+        vNodes.push(<i class={`fa ${icon}`} />)
+      } else {
         vNodes.push(<svg-icon icon-class={icon}/>)
       }
+    }
 
     if (title) {
       vNodes.push(<span slot='title'>{title}</span>)

src/styles/default-theme.scss

@@ -6,6 +6,7 @@
   --color-danger: #ed5565;
   --color-link: #1c84c6;
   --color-text-primary: #292827;
+  --color-text-secondry: #9b9b9b;
   --color-icon-primary: #605e5c;
   --color-border: #e9ecef;
   --color-input-border: #BBBFC4;

src/styles/index.scss

@@ -35,6 +35,7 @@ body {
   height: calc(100% - 50px);
   overflow: hidden;
   -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: auto;
   color: var(--color-text-primary);
   font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
   font-size: 13px;

src/styles/menu.scss

@@ -31,6 +31,7 @@ $single-menu-height: 38px;
     align-items: center;
     height: $single-menu-height;
     color: var(--color-text-primary);
+    letter-spacing: 0.02em;
   }
 
   .submenu-title-noDropdown.level0 {
@@ -55,6 +56,7 @@ $single-menu-height: 38px;
   }
 
   .group-title {
+    margin-top: 5px;
     // 分组的 title 样式
     & > span {
       padding-left: 20px;
@@ -106,7 +108,6 @@ $single-menu-height: 38px;
           // 此处若不显示给出 line-height 则默认继承 ElUI 默认 56px 行高
           padding-left: 10px;
           line-height: 100%;
-          color: var(--color-text-primary);
         }
 
         // 处于选中状态的高亮样式