From c0d0493ec0adfe423f461938b78674bf115504d1 Mon Sep 17 00:00:00 2001
From: Frost-ZX <30585462+Frost-ZX@users.noreply.github.com>
Date: Thu, 11 Feb 2021 15:53:39 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=94=B9=E4=B8=8B=E6=8B=89=E8=8F=9C?=
 =?UTF-8?q?=E5=8D=95=E5=9B=BE=E6=A0=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue | 22 ++++++++++++++++++----
 1 file changed, 18 insertions(+), 4 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index ac3afbb..c549306 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -22,8 +22,10 @@
                     >{{ item.label }}</el-menu-item>
 
                     <!-- 切换下拉菜单 -->
-                    <el-menu-item class="item-dropdown" @click="showHeaderDropdown = !showHeaderDropdown">
-                        <i class="el-icon-s-fold"></i>
+                    <el-menu-item :class="['item-dropdown', { active: showHeaderDropdown }]"
+                        @click="showHeaderDropdown = !showHeaderDropdown"
+                    >
+                        <i class="el-icon-menu"></i>
                     </el-menu-item>
 
                 </el-menu>
@@ -205,6 +207,12 @@ export default {
     }
 }
 
+.main-container {
+    height: calc(100vh - @headerHeight);
+}
+</style>
+
+<style lang="less" scoped>
 .header-dropdown {
     position: absolute !important;
     z-index: 150;
@@ -220,7 +228,13 @@ export default {
     }
 }
 
-.main-container {
-    height: calc(100vh - @headerHeight);
+.menu .item-dropdown {
+    i {
+        transition: color @transitionTime;
+    }
+
+    &.active i {
+        color: @colorPrimary;
+    }
 }
 </style>