From 078392728b646f3fd77e145a54770d0747af283d Mon Sep 17 00:00:00 2001
From: haoxr <1490493387@qq.com>
Date: Sun, 26 Mar 2023 10:38:16 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E5=AF=BC=E8=88=AA=E6=A0=8F?=
 =?UTF-8?q?=E5=8F=B3=E4=BE=A7=E6=A0=B7=E5=BC=8F=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Former-commit-id: af72114efdff31af2d385b1be2f7a19ca2045c3d
---
 src/layout/components/Navbar.vue | 43 +++++++++++++-------------------
 src/styles/dark.scss             |  3 +++
 2 files changed, 20 insertions(+), 26 deletions(-)

diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue
index ead99bcc..7bf14c33 100644
--- a/src/layout/components/Navbar.vue
+++ b/src/layout/components/Navbar.vue
@@ -49,25 +49,19 @@ function logout() {
       <breadcrumb />
     </div>
 
-    <!-- 右侧导航 -->
-    <div class="navbar-right">
+    <!-- 右侧导航设置 -->
+    <div class="flex">
       <!-- 导航栏设置(窄屏隐藏)-->
-      <div v-if="device !== 'mobile'" class="navbar-setting-wrapper">
+
+      <div v-if="device !== 'mobile'" class="flex items-center">
         <!--全屏 -->
-        <screenfull
-          class="navbar-setting-item hover:bg-gray-50 dark:hover:bg-[var(--el-fill-color-light)]"
-          id="screenfull"
-        />
+        <screenfull class="navbar-setting-item" />
         <!-- 布局大小 -->
         <el-tooltip content="布局大小" effect="dark" placement="bottom">
-          <size-select
-            class="navbar-setting-item hover:bg-gray-50 dark:hover:bg-[var(--el-fill-color-light)]"
-          />
+          <size-select class="navbar-setting-item" />
         </el-tooltip>
         <!--语言选择-->
-        <lang-select
-          class="navbar-setting-item hover:bg-gray-50 dark:hover:bg-[var(--el-fill-color-light)]"
-        />
+        <lang-select class="navbar-setting-item" />
       </div>
 
       <!-- 用户头像 -->
@@ -112,19 +106,16 @@ function logout() {
   justify-content: space-between;
   box-shadow: 0 0 1px #0003;
 
-  .navbar-right {
-    display: flex;
-    .navbar-setting-wrapper {
-      display: flex;
-      align-items: center;
-      .navbar-setting-item {
-        height: 50px;
-        line-height: 50px;
-        padding: 0 8px;
-        display: inline-block;
-        cursor: pointer;
-        color: #5a5e66;
-      }
+  .navbar-setting-item {
+    height: 50px;
+    line-height: 50px;
+    width: 30px;
+    display: inline-block;
+    cursor: pointer;
+    text-align: center;
+    color: #5a5e66;
+    &:hover {
+      background: rgba(249, 250, 251, 1);
     }
   }
 }
diff --git a/src/styles/dark.scss b/src/styles/dark.scss
index 33c6bb80..21defe6d 100644
--- a/src/styles/dark.scss
+++ b/src/styles/dark.scss
@@ -12,6 +12,9 @@ html.dark{
   .navbar {
     background-color: var(--el-bg-color);
     color: var(--el-text-color-regular);
+    .navbar-setting-item:hover{
+      background: var(--el-fill-color-light);
+    }
   }
 
   .right-panel-btn{