style: 样式优化

src/layout/components/navbar.vue

@@ -99,7 +99,7 @@ const { t, locale, translationCh, translationEn } = useTranslationLang();
         </template>
       </el-dropdown>
       <span
-        class="el-icon-setting navbar-bg-hover"
+        class="set-icon navbar-bg-hover"
         :title="t('buttons.hssystemSet')"
         @click="onPanel"
       >
@@ -149,15 +149,6 @@ const { t, locale, translationCh, translationEn } = useTranslationLang();
         border-radius: 50%;
       }
     }
-
-    .el-icon-setting {
-      height: 48px;
-      width: 38px;
-      padding: 12px;
-      display: flex;
-      cursor: pointer;
-      align-items: center;
-    }
   }
 
   .breadcrumb-container {

src/layout/components/panel/index.vue

@@ -22,9 +22,13 @@ emitter.on("openPanel", () => {
       <div class="right-panel-items">
         <div class="project-configuration">
           <h3 class="dark:text-white">项目配置</h3>
-          <el-icon title="关闭配置" class="el-icon-close" @click="show = !show">
-            <IconifyIconOffline icon="close" />
-          </el-icon>
+          <span title="关闭配置">
+            <IconifyIconOffline
+              class="dark:text-white"
+              icon="close"
+              @click="show = !show"
+            />
+          </span>
         </div>
         <div
           class="border-b-[1px] border-solid border-[#dcdfe6] dark:border-[#303030]"
@@ -121,7 +125,7 @@ emitter.on("openPanel", () => {
   top: 15px;
   margin-left: 10px;
 
-  i {
+  svg {
     font-size: 20px;
     margin-right: 20px;
 

src/layout/components/sidebar/horizontal.vue

@@ -109,7 +109,7 @@ watch(
         </template>
       </el-dropdown>
       <span
-        class="el-icon-setting navbar-bg-hover"
+        class="set-icon navbar-bg-hover"
         :title="t('buttons.hssystemSet')"
         @click="onPanel"
       >

src/layout/components/sidebar/mixNav.vue

@@ -141,7 +141,7 @@ watch(
         </template>
       </el-dropdown>
       <span
-        class="el-icon-setting navbar-bg-hover"
+        class="set-icon navbar-bg-hover"
         :title="t('buttons.hssystemSet')"
         @click="onPanel"
       >

src/style/sidebar.scss

@@ -22,6 +22,15 @@
     margin-right: 5px;
   }
 
+  .set-icon {
+    height: 48px;
+    width: 40px;
+    display: flex;
+    cursor: pointer;
+    align-items: center;
+    justify-content: center;
+  }
+
   .main-container {
     height: 100vh;
     min-height: 100%;
@@ -231,7 +240,7 @@
       /* 登录名 */
       .el-dropdown-link,
       /* 设置 */
-      .el-icon-setting {
+      .set-icon {
         &:hover {
           background: $menuHover;
         }
@@ -270,15 +279,6 @@
           border-radius: 50%;
         }
       }
-
-      .el-icon-setting {
-        height: 48px;
-        width: 40px;
-        padding: 12px;
-        display: flex;
-        cursor: pointer;
-        align-items: center;
-      }
     }
 
     .el-menu {
@@ -594,7 +594,7 @@ body[layout="vertical"] {
   /* 登录名 */
   .el-dropdown-link,
   /* 设置 */
-  .el-icon-setting {
+  .set-icon {
     &:hover {
       background: #f6f6f6;
     }

src/views/guide/index.vue

@@ -24,7 +24,7 @@ const steps = [
     }
   },
   {
-    element: ".el-icon-setting",
+    element: ".set-icon",
     popover: {
       title: "项目配置",
       description: "你可以在这里查看项目配置",