From 54c130a1b0fa5866cc6569f80f18ce9aaef49db6 Mon Sep 17 00:00:00 2001
From: iczer <1126263215@qq.com>
Date: Sun, 21 Jun 2020 20:07:59 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=EF=BC=9A=E8=B0=83=E6=95=B4?=
 =?UTF-8?q?=E9=A1=B6=E9=83=A8=E5=B0=8F=E7=BB=84=E4=BB=B6=E6=A0=B7=E5=BC=8F?=
 =?UTF-8?q?=EF=BC=8C=E8=A7=A3=E5=86=B3=E7=BB=84=E4=BB=B6=E5=9E=82=E7=9B=B4?=
 =?UTF-8?q?=E5=AF=B9=E9=BD=90=E7=9A=84=E9=97=AE=E9=A2=98=EF=BC=9B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layouts/GlobalHeader.vue  | 23 +++++++++++------------
 src/layouts/HeaderlAvatar.vue | 30 ++++++++++++++++--------------
 2 files changed, 27 insertions(+), 26 deletions(-)

diff --git a/src/layouts/GlobalHeader.vue b/src/layouts/GlobalHeader.vue
index b80179a..203a5cd 100644
--- a/src/layouts/GlobalHeader.vue
+++ b/src/layouts/GlobalHeader.vue
@@ -68,17 +68,6 @@ export default {
       color: #1890ff;
     }
   }
-  .header-item{
-    padding: 0 12px;
-    display: inline-block;
-    height: 100%;
-    cursor: pointer;
-    vertical-align: middle;
-    i{
-      font-size: 16px;
-      color: rgba(0,0,0,.65);
-    }
-  }
   .global-header{
     padding: 0 12px 0 0;
     -webkit-box-shadow: 0 1px 4px rgba(0,21,41,.08);
@@ -129,10 +118,20 @@ export default {
       }
       .global-header-right{
         float: right;
+        display: flex;
         &.dark{
           color: #fff;
+          a, i{
+            color: #fff !important;
+          }
+        }
+        .header-item{
+          padding: 0 12px;
+          cursor: pointer;
+          align-self: center;
           i{
-            color: #fff;
+            font-size: 16px;
+            color: rgba(0,0,0,.65);
           }
         }
       }
diff --git a/src/layouts/HeaderlAvatar.vue b/src/layouts/HeaderlAvatar.vue
index 2a880d2..de7757a 100644
--- a/src/layouts/HeaderlAvatar.vue
+++ b/src/layouts/HeaderlAvatar.vue
@@ -1,9 +1,9 @@
 <template>
-  <a-dropdown class="header-avatar">
-    <span style="cursor: pointer">
-      <a-avatar class="avatar" size="small" shape="circle" :src="user.avatar"/>
-      <span>{{user.name}}</span>
-    </span>
+  <a-dropdown>
+    <div class="header-avatar" style="cursor: pointer">
+      <a-avatar class="avatar" :size="30" shape="circle" :src="user.avatar"/>
+      <span class="name">{{user.name}}</span>
+    </div>
     <a-menu :class="['avatar-menu']" slot="overlay">
       <a-menu-item>
         <a-icon type="user" />
@@ -38,17 +38,19 @@ export default {
 
 <style lang="less">
   .header-avatar{
-    display: inline-block;
-    height: 100%;
-    vertical-align: initial;
-  }
-  .avatar{
-    margin: 20px 4px 20px 0;
-    color: #1890ff;
-    background: hsla(0,0%,100%,.85);
-    vertical-align: middle;
+    display: inline-flex;
+    .avatar, .name{
+      align-self: center;
+    }
+    .avatar{
+      margin-right: 8px;
+    }
+    .name{
+      font-weight: 500;
+    }
   }
   .avatar-menu{
     width: 150px;
   }
+
 </style>