From 9a0488628ab1b60cd1a35a1424498d4dccd08808 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=98=AD?= <81747598+lan-yonghui@users.noreply.github.com>
Date: Fri, 16 May 2025 11:57:06 +0800
Subject: [PATCH] style: Mobile style optimization (#8689)

---
 frontend/src/global/mimetype.ts                 | 4 ++++
 frontend/src/layout/components/MobileHeader.vue | 6 +++---
 frontend/src/layout/index.vue                   | 2 +-
 frontend/src/views/home/index.vue               | 7 +++++++
 4 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/frontend/src/global/mimetype.ts b/frontend/src/global/mimetype.ts
index 38135d36d..34bc8cf45 100644
--- a/frontend/src/global/mimetype.ts
+++ b/frontend/src/global/mimetype.ts
@@ -95,6 +95,10 @@ export const Languages = [
         label: 'css',
         value: ['css'],
     },
+    {
+        label: 'ini',
+        value: ['ini'],
+    },
 ];
 
 export const Rewrites = [
diff --git a/frontend/src/layout/components/MobileHeader.vue b/frontend/src/layout/components/MobileHeader.vue
index aded39f1e..7dbc3e16c 100644
--- a/frontend/src/layout/components/MobileHeader.vue
+++ b/frontend/src/layout/components/MobileHeader.vue
@@ -4,7 +4,7 @@ const menuStore = MenuStore();
 </script>
 <template>
     <div class="mobile-header">
-        <svg-icon class="caidan" iconName="p-caidan" @click="menuStore.setCollapse()"></svg-icon>
+        <svg-icon class="mobile-menu" iconName="p-caidan" @click="menuStore.setCollapse()"></svg-icon>
     </div>
 </template>
 
@@ -14,8 +14,8 @@ const menuStore = MenuStore();
     box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.2);
     padding: 10px;
     text-align: left;
-    z-index: 999;
-    .caidan {
+    z-index: 99;
+    .mobile-menu {
         margin-left: 10px;
         font-size: 10px;
         cursor: pointer;
diff --git a/frontend/src/layout/index.vue b/frontend/src/layout/index.vue
index 2de2c8b92..15ed0c873 100644
--- a/frontend/src/layout/index.vue
+++ b/frontend/src/layout/index.vue
@@ -7,7 +7,7 @@
         fullscreen
     >
         <div v-if="classObj.mobile && classObj.openSidebar" class="drawer-bg" @click="handleClickOutside" />
-        <el-affix :offset="classObj.openMenuTabs ? 8 : 15" class="affix">
+        <el-affix v-if="!classObj.mobile" :offset="classObj.openMenuTabs ? 8 : 15" class="affix">
             <el-tooltip :content="menuStore.isCollapse ? $t('commons.button.expand') : $t('commons.button.collapse')">
                 <el-button
                     size="small"
diff --git a/frontend/src/views/home/index.vue b/frontend/src/views/home/index.vue
index ae5093e62..076d73998 100644
--- a/frontend/src/views/home/index.vue
+++ b/frontend/src/views/home/index.vue
@@ -578,6 +578,13 @@ onBeforeUnmount(() => {
         color: var(--el-text-color-regular);
     }
 
+    @media only screen and (max-width: 1300px) {
+        span:first-child {
+            font-size: 12px;
+            color: var(--el-text-color-regular);
+        }
+    }
+
     .count {
         margin-top: 10px;
         span {