refactor: 更新组件样式，优化全屏、通知下拉和大小选择器的触发区域

src/components/Fullscreen/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div @click="toggle">
+  <div class="fullscreen-trigger" @click="toggle">
     <div :class="`i-svg:` + (isFullscreen ? 'fullscreen-exit' : 'fullscreen')" />
   </div>
 </template>
@@ -8,4 +8,12 @@
 const { isFullscreen, toggle } = useFullscreen();
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.fullscreen-trigger {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+}
+</style>

src/components/NoticeDropdown/index.vue

@@ -1,10 +1,12 @@
 <template>
-  <el-dropdown trigger="click">
+  <el-dropdown class="notice__dropdown" trigger="click">
-    <el-badge v-if="list.length > 0" :value="list.length" :max="99">
+    <div class="notice__trigger">
-      <div class="i-svg:bell" />
+      <el-badge v-if="list.length > 0" :value="list.length" :max="99">
-    </el-badge>
+        <div class="i-svg:bell" />
+      </el-badge>
 
-    <div v-else class="i-svg:bell" />
+      <div v-else class="i-svg:bell" />
+    </div>
 
     <template #dropdown>
       <div class="p-5">
@@ -79,4 +81,22 @@ import { useNotice } from "./useNotice";
 const { list, detail, dialogVisible, read, readAll, goMore } = useNotice();
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.notice {
+  &__dropdown {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    height: 100%;
+  }
+
+  &__trigger {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    height: 100%;
+  }
+}
+</style>

src/components/SizeSelect/index.vue

@@ -2,7 +2,9 @@
   <!-- 布局大小 -->
   <el-tooltip :content="t('sizeSelect.tooltip')" effect="dark" placement="bottom">
     <el-dropdown trigger="click" @command="handleSizeChange">
-      <div class="i-svg:size" />
+      <div class="size-trigger">
+        <div class="i-svg:size" />
+      </div>
       <template #dropdown>
         <el-dropdown-menu>
           <el-dropdown-item
@@ -38,3 +40,13 @@ function handleSizeChange(size: string) {
   ElMessage.success(t("sizeSelect.message.success"));
 }
 </script>
+
+<style lang="scss" scoped>
+.size-trigger {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+}
+</style>

src/layouts/components/LayoutToolbar.vue

@@ -182,7 +182,7 @@ function handleSettingsClick() {
 .navbar-actions {
   display: flex;
   align-items: center;
-  height: 100%;
+  min-height: 44px;
 
   &__item {
     position: relative;
@@ -190,8 +190,7 @@ function handleSettingsClick() {
     align-items: center;
     justify-content: center;
     min-width: 44px; /* 增加最小点击区域到44px，符合人机交互标<E4BA92>?*/
-    height: 100%;
+    height: 44px;
-    min-height: 44px;
     padding: 0 8px;
     text-align: center;
     cursor: pointer;
@@ -211,7 +210,16 @@ function handleSettingsClick() {
       align-items: center;
       justify-content: center;
       width: 100%;
-      height: 100%;
+      height: 44px;
+    }
+
+    :deep(.i-svg\:language) {
+      flex-shrink: 0;
+      width: 18px;
+      height: 18px;
+      font-size: 18px;
+      line-height: 18px;
+      background-size: 18px 18px;
     }
 
     // 图标样式
@@ -235,7 +243,7 @@ function handleSettingsClick() {
     display: flex;
     align-items: center;
     justify-content: center;
-    height: 100%;
+    height: 44px;
     padding: 0 8px;
 
     &__avatar {