feat: add menu font size variable and update related components

- Introduced a new CSS variable `--menu-font-size` calculated from the base font size.
- Updated `PreferenceManager` to trigger CSS variable updates when `fontSize` is modified.
- Adjusted `updateCSSVariables` to set the new `--menu-font-size` based on the theme's font size.
- Ensured that the menu components utilize the updated font size with `!important` to maintain styling consistency.

packages/@core/preferences/src/preferences.ts

@@ -141,7 +141,10 @@ class PreferenceManager {
   private handleUpdates(updates: DeepPartial<Preferences>) {
     const themeUpdates = updates.theme || {};
     const appUpdates = updates.app || {};
-    if (themeUpdates && Object.keys(themeUpdates).length > 0) {
+    if (
+      (themeUpdates && Object.keys(themeUpdates).length > 0) ||
+      Reflect.has(themeUpdates, 'fontSize')
+    ) {
       updateCSSVariables(this.state);
     }
 

packages/@core/preferences/src/update-css-variables.ts

@@ -69,9 +69,14 @@ function updateCSSVariables(preferences: Preferences) {
 
   // 更新字体大小
   if (Reflect.has(theme, 'fontSize')) {
+    const fontSize = theme.fontSize;
     document.documentElement.style.setProperty(
       '--font-size-base',
-      `${theme.fontSize}px`,
+      `${fontSize}px`,
+    );
+    document.documentElement.style.setProperty(
+      '--menu-font-size',
+      `calc(${fontSize}px * 0.875)`,
     );
   }
 }