refactor: ♻️ hamburger 组件样式优化

src/components/Hamburger/index.vue

@@ -1,9 +1,5 @@
-<!-- 汉堡按钮组件：展开/收缩菜单  -->
 <template>
-  <div
+  <div class="hamburger-wrapper" @click="toggleClick">
-    class="px-[15px] flex items-center justify-center color-[var(--el-text-color-regular)]"
-    @click="toggleClick"
-  >
     <div :class="['i-svg:collapse', { hamburger: true, 'is-active': isActive }]" />
   </div>
 </template>
@@ -25,6 +21,12 @@ function toggleClick() {
 </script>
 
 <style scoped lang="scss">
+.hamburger-wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0 15px;
+
   .hamburger {
     vertical-align: middle;
     cursor: pointer;
@@ -34,4 +36,10 @@ function toggleClick() {
   .hamburger.is-active {
     transform: scaleX(1);
   }
+}
+.layout-mix {
+  .hamburger-wrapper {
+    color: #fff;
+  }
+}
 </style>