diff --git a/backend/src/main/java/com/openisle/config/SecurityConfig.java b/backend/src/main/java/com/openisle/config/SecurityConfig.java
index 852ea1c5c..5c9572837 100644
--- a/backend/src/main/java/com/openisle/config/SecurityConfig.java
+++ b/backend/src/main/java/com/openisle/config/SecurityConfig.java
@@ -77,8 +77,8 @@ public class SecurityConfig {
                 "http://127.0.0.1",
                 "http://localhost:8080",
                 "http://localhost",
-                "http://30.211.97.254:8080",
-                "http://30.211.97.254",
+                "http://30.211.98.193:8080",
+                "http://30.211.98.193",
                 "http://192.168.7.70",
                 "http://192.168.7.70:8080",
                 websiteUrl,
diff --git a/frontend/public/manifest.json b/frontend/public/manifest.json
index 5bc639a6d..4504e9927 100644
--- a/frontend/public/manifest.json
+++ b/frontend/public/manifest.json
@@ -2,7 +2,7 @@
   "name": "OpenIsle",
   "short_name": "OpenIsle",
   "start_url": "/",
-  "display": "standalone",
+  "display": "fullscreen",
   "icons": [
     {
       "src": "/icon-192.png",
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index f60db5054..01a02aef1 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -58,19 +58,21 @@ export default {
 
 <style>
 .header-container {
-  position: fixed;
+  position: sticky;
   top: 0;
-  left: 0;
-  right: 0;
   z-index: 1000;
 }
 
 .menu-container {}
 
 .content {
+  /* height: calc(100vh - var(--header-height)); */
+  /* padding-top: var(--header-height); */
   flex: 1;
   max-width: 100%;
   transition: max-width 0.3s ease;
+  background-color: var(--background-color);
+  min-height: calc(100vh - var(--header-height)); 
 }
 
 .content.menu-open {
diff --git a/frontend/src/assets/global.css b/frontend/src/assets/global.css
index 5f0786489..fd6eefb5e 100644
--- a/frontend/src/assets/global.css
+++ b/frontend/src/assets/global.css
@@ -8,7 +8,8 @@
   --header-text-color: black;
   --menu-background-color: white;
   --background-color: white;
-  --background-color-blur: rgba(255, 255, 255, 0.57);
+  /* --background-color-blur: rgba(255, 255, 255, 0.57); */
+  --background-color-blur: var(--background-color);
   --menu-border-color: lightgray;
   --normal-border-color: lightgray;
   --menu-selected-background-color: rgba(208, 250, 255, 0.659);
@@ -34,7 +35,8 @@
   --header-text-color: white;
   --menu-background-color: #333;
   --background-color: #333;
-  --background-color-blur: #333333a4;
+  /* --background-color-blur: #333333a4; */
+  --background-color-blur: var(--background-color);
   --menu-border-color: #555;
   --normal-border-color: #555;
   --menu-selected-background-color: rgba(255, 255, 255, 0.1);
@@ -54,10 +56,9 @@ body {
   font-family: 'Roboto', sans-serif;
   background-color: var(--normal-background-color);
   color: var(--text-color);
-  overflow: hidden; /* 禁止滚动 */
+  /* overflow: hidden; 禁止滚动 */
 }
 
-
 /*************************
  * Vditor 自定义皮肤覆写
  *************************/
diff --git a/frontend/src/components/CallbackPage.vue b/frontend/src/components/CallbackPage.vue
index 003d12a62..764b15a11 100644
--- a/frontend/src/components/CallbackPage.vue
+++ b/frontend/src/components/CallbackPage.vue
@@ -18,8 +18,6 @@ export default {
 <style scoped>
 .callback-page {
   background-color: var(--background-color);
-  height: calc(100vh - var(--header-height));
-  padding-top: var(--header-height);
   display: flex;
   flex-direction: column;
   align-items: center;
diff --git a/frontend/src/components/MenuComponent.vue b/frontend/src/components/MenuComponent.vue
index 0df7da8cf..a095b0dc9 100644
--- a/frontend/src/components/MenuComponent.vue
+++ b/frontend/src/components/MenuComponent.vue
@@ -268,6 +268,8 @@ export default {
 
 <style scoped>
 .menu {
+  position: sticky;
+  top: var(--header-height);
   width: 200px;
   background-color: var(--menu-background-color);
   height: calc(100vh - 20px - var(--header-height));
@@ -277,7 +279,6 @@ export default {
   padding: 10px;
   overflow-y: auto;
   scrollbar-width: none;
-  padding-top: calc(var(--header-height) + 10px);
 }
 
 .menu-item-container {
@@ -418,7 +419,6 @@ export default {
     top: calc(var(--header-height) + 10px);
     padding-top: 10px;
     background-color: var(--background-color-blur);
-    backdrop-filter: blur(10px);
   }
 
   .slide-enter-active,
diff --git a/frontend/src/utils/loadMore.js b/frontend/src/utils/loadMore.js
new file mode 100644
index 000000000..c4ffb9cb1
--- /dev/null
+++ b/frontend/src/utils/loadMore.js
@@ -0,0 +1,31 @@
+import { ref, onMounted, onUnmounted, onActivated, nextTick } from 'vue'
+
+export function useScrollLoadMore(loadMore, offset = 50) {
+  const savedScrollTop = ref(0)
+
+  const handleScroll = () => {
+    const scrollTop = window.scrollY || document.documentElement.scrollTop
+    const scrollHeight = document.documentElement.scrollHeight
+    const windowHeight = window.innerHeight
+    savedScrollTop.value = scrollTop
+    if (scrollHeight - (scrollTop + windowHeight) <= offset) {
+      loadMore()
+    }
+  }
+
+  onMounted(() => {
+    window.addEventListener('scroll', handleScroll, { passive: true })
+  })
+
+  onUnmounted(() => {
+    window.removeEventListener('scroll', handleScroll)
+  })
+
+  onActivated(() => {
+    nextTick(() => {
+      window.scrollTo({ top: savedScrollTop.value })
+    })
+  })
+
+  return { savedScrollTop }
+}
diff --git a/frontend/src/views/AboutPageView.vue b/frontend/src/views/AboutPageView.vue
index b1e2ae524..f36ba3489 100644
--- a/frontend/src/views/AboutPageView.vue
+++ b/frontend/src/views/AboutPageView.vue
@@ -75,8 +75,7 @@ export default {
   max-width: var(--page-max-width);
   background-color: var(--background-color);
   margin: 0 auto;
-  height: calc(100vh - var(--header-height));
-  padding-top: var(--header-height);
+  height: 100%;
   overflow-y: auto;
 }
 
@@ -85,7 +84,6 @@ export default {
   top: 1px;
   z-index: 200;
   background-color: var(--background-color-blur);
-  backdrop-filter: blur(10px);
   display: flex;
   flex-direction: row;
   border-bottom: 1px solid var(--normal-border-color);
diff --git a/frontend/src/views/ActivityListPageView.vue b/frontend/src/views/ActivityListPageView.vue
index 71493e201..c5054c293 100644
--- a/frontend/src/views/ActivityListPageView.vue
+++ b/frontend/src/views/ActivityListPageView.vue
@@ -73,9 +73,8 @@ export default {
 .activity-list-page {
   background-color: var(--background-color);
   padding: 20px;
-  height: calc(100vh - var(--header-height) - 40px);
+  height: calc(100% - 40px);
   overflow-y: auto;
-  padding-top: calc(var(--header-height) + 20px);
 }
 
 .activity-list-page-card {
diff --git a/frontend/src/views/EditPostPageView.vue b/frontend/src/views/EditPostPageView.vue
index 260ab9a36..a8f89a431 100644
--- a/frontend/src/views/EditPostPageView.vue
+++ b/frontend/src/views/EditPostPageView.vue
@@ -211,8 +211,7 @@ export default {
   display: flex;
   justify-content: center;
   background-color: var(--background-color);
-  height: calc(100vh - var(--header-height));
-  padding-top: var(--header-height);
+  height: 100%;
   padding-right: 20px;
   padding-left: 20px;
   overflow-y: auto;
diff --git a/frontend/src/views/ForgotPasswordPageView.vue b/frontend/src/views/ForgotPasswordPageView.vue
index 2a4191792..3afb2e8c5 100644
--- a/frontend/src/views/ForgotPasswordPageView.vue
+++ b/frontend/src/views/ForgotPasswordPageView.vue
@@ -131,8 +131,7 @@ export default {
   justify-content: center;
   align-items: center;
   background-color: var(--background-color);
-  height: calc(100vh - var(--header-height));
-  padding-top: var(--header-height);
+  height: 100%;
 }
 .forgot-content {
   display: flex;
diff --git a/frontend/src/views/HomePageView.vue b/frontend/src/views/HomePageView.vue
index fed9fc0bf..bbae20c0b 100644
--- a/frontend/src/views/HomePageView.vue
+++ b/frontend/src/views/HomePageView.vue
@@ -1,5 +1,5 @@
 <template>
-  <div ref="homePage" class="home-page" @scroll="handleScroll">
+  <div class="home-page">
     <div v-if="!isMobile" class="search-container">
       <div class="search-title">一切可能，从此刻启航</div>
       <div class="search-subtitle">愿你在此遇见灵感与共鸣。若有疑惑，欢迎发问，亦可在知识的海洋中搜寻答案。</div>
@@ -107,8 +107,9 @@
 </template>
 
 <script>
-import { ref, onMounted, watch, onActivated, nextTick } from 'vue'
+import { ref, onMounted, watch } from 'vue'
 import { useRoute } from 'vue-router'
+import { useScrollLoadMore } from '../utils/loadMore'
 import { stripMarkdown } from '../utils/markdown'
 import { API_BASE_URL } from '../main'
 import { getToken } from '../utils/auth'
@@ -134,8 +135,6 @@ export default {
   },
   setup() {
     const route = useRoute()
-    const homePage = ref(null)
-    const savedScrollTop = ref(0)
     const selectedCategory = ref('')
     if (route.query.category) {
       const c = decodeURIComponent(route.query.category)
@@ -167,14 +166,6 @@ export default {
     const pageSize = 10
     const allLoaded = ref(false)
 
-    onActivated(() => {
-      nextTick(() => {
-        if (homePage.value) {
-          homePage.value.scrollTop = savedScrollTop.value
-        }
-      })
-    })
-
     // Backend now returns comment counts directly
 
     const loadOptions = async () => {
@@ -366,13 +357,7 @@ export default {
         }
     }
 
-    const handleScroll = (e) => {
-      const el = e.target
-      savedScrollTop.value = el.scrollTop
-      if (el.scrollHeight - el.scrollTop <= el.clientHeight + 50) {
-        fetchContent()
-      }
-    }
+    useScrollLoadMore(fetchContent)
 
     onMounted(async () => {
       fetchContent()
@@ -389,7 +374,7 @@ export default {
 
     const sanitizeDescription = (text) => stripMarkdown(text)
 
-    return { topics, selectedTopic, articles, sanitizeDescription, isLoadingPosts, handleScroll, selectedCategory, selectedTags, tagOptions, categoryOptions, isMobile, homePage }
+    return { topics, selectedTopic, articles, sanitizeDescription, isLoadingPosts, selectedCategory, selectedTags, tagOptions, categoryOptions, isMobile }
   }
 }
 </script>
@@ -397,13 +382,9 @@ export default {
 <style scoped>
 .home-page {
   background-color: var(--background-color);
-  height: calc(100vh - var(--header-height));
-  padding-top: var(--header-height);
   display: flex;
   flex-direction: column;
   align-items: center;
-  overflow-y: auto;
-  /* enable container queries */
   container-type: inline-size;
   container-name: home-page;
 }
@@ -455,7 +436,6 @@ export default {
   top: 1px;
   z-index: 10;
   background-color: var(--background-color-blur);
-  backdrop-filter: blur(10px);
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -736,6 +716,10 @@ export default {
     font-size: 10px;
     opacity: 0.5;
   }
+
+  .topic-container {
+    position: initial;
+  }
 }
 
 </style>
diff --git a/frontend/src/views/LoginPageView.vue b/frontend/src/views/LoginPageView.vue
index 4a33fb508..26d926a90 100644
--- a/frontend/src/views/LoginPageView.vue
+++ b/frontend/src/views/LoginPageView.vue
@@ -125,8 +125,7 @@ export default {
   flex-direction: row;
   align-items: center;
   justify-content: center;
-  height: calc(100vh - var(--header-height));
-  padding-top: var(--header-height);
+  height: 100%;
   width: 100%;
   background-color: var(--background-color);
 }
diff --git a/frontend/src/views/MessagePageView.vue b/frontend/src/views/MessagePageView.vue
index 75c5a357c..03b79d59f 100644
--- a/frontend/src/views/MessagePageView.vue
+++ b/frontend/src/views/MessagePageView.vue
@@ -626,12 +626,8 @@ export default {
   height: 300px;
 }
 
-
 .message-page {
   background-color: var(--background-color);
-  height: calc(100vh - var(--header-height));
-  padding-top: var(--header-height);
-  overflow-y: auto;
 }
 
 .message-page-header {
@@ -639,7 +635,6 @@ export default {
   top: 1px;
   z-index: 200;
   background-color: var(--background-color-blur);
-  backdrop-filter: blur(10px);
   display: flex;
   flex-direction: row;
   justify-content: space-between;
diff --git a/frontend/src/views/NewPostPageView.vue b/frontend/src/views/NewPostPageView.vue
index 83aff279d..1038df159 100644
--- a/frontend/src/views/NewPostPageView.vue
+++ b/frontend/src/views/NewPostPageView.vue
@@ -261,8 +261,7 @@ export default {
   display: flex;
   justify-content: center;
   background-color: var(--background-color);
-  height: calc(100vh - var(--header-height));
-  padding-top: var(--header-height);
+  height: 100%;
   padding-right: 20px;
   padding-left: 20px;
   overflow-y: auto;
diff --git a/frontend/src/views/NotFoundPageView.vue b/frontend/src/views/NotFoundPageView.vue
index 86304faa9..5b623cafe 100644
--- a/frontend/src/views/NotFoundPageView.vue
+++ b/frontend/src/views/NotFoundPageView.vue
@@ -17,8 +17,7 @@ export default {
   display: flex;
   flex-direction: column;
   align-items: center;
-  height: calc(100vh - var(--header-height));
-  padding-top: var(--header-height);
+  height: 100%;
   text-align: center;
   background-color: var(--background-color);
 }
diff --git a/frontend/src/views/PostPageView.vue b/frontend/src/views/PostPageView.vue
index 5e16bdd72..cf113e1d0 100644
--- a/frontend/src/views/PostPageView.vue
+++ b/frontend/src/views/PostPageView.vue
@@ -650,7 +650,7 @@ export default {
   background-color: var(--background-color);
   display: flex;
   flex-direction: row;
-  height: 100vh;
+  height: 100%;
 }
 
 .loading-container {
@@ -662,16 +662,12 @@ export default {
 }
 
 .post-page-main-container {
-  overflow-y: auto;
   scrollbar-width: none;
   padding: 20px;
-  height: calc(100% - 40px - var(--header-height));
   width: calc(85% - 40px);
-  padding-top: calc(var(--header-height) + 20px);
 }
 
 .post-page-scroller-container {
-  padding-top: var(--header-height);
   display: flex;
   flex-direction: column;
   width: 15%;
@@ -974,7 +970,6 @@ export default {
   .post-page-main-container {
     width: calc(100% - 20px);
     padding: 10px;
-    padding-top: calc(var(--header-height) + 10px);
   }
 
   .article-title {
diff --git a/frontend/src/views/ProfileView.vue b/frontend/src/views/ProfileView.vue
index 3dd44c70f..4470100dd 100644
--- a/frontend/src/views/ProfileView.vue
+++ b/frontend/src/views/ProfileView.vue
@@ -497,8 +497,7 @@ export default {
 
 .profile-page {
   background-color: var(--background-color);
-  height: calc(100vh - var(--header-height));
-  padding-top: var(--header-height);
+  height: 100%;
   overflow-y: auto;
   overflow-x: hidden; 
 }
@@ -643,7 +642,6 @@ export default {
   top: 1px;
   z-index: 200;
   background-color: var(--background-color-blur);
-  backdrop-filter: blur(10px);
   display: flex;
   flex-direction: row;
   padding: 0 20px;
diff --git a/frontend/src/views/SettingsPageView.vue b/frontend/src/views/SettingsPageView.vue
index 74ef61422..089ef7a77 100644
--- a/frontend/src/views/SettingsPageView.vue
+++ b/frontend/src/views/SettingsPageView.vue
@@ -239,8 +239,7 @@ export default {
 .settings-page {
   background-color: var(--background-color);
   padding: 40px;
-  height: calc(100vh - var(--header-height) - 80px);
-  padding-top: calc(var(--header-height) + 40px);
+  height: calc(100% - 80px);
   overflow-y: auto;
 }
 
diff --git a/frontend/src/views/SignupPageView.vue b/frontend/src/views/SignupPageView.vue
index eea683ebd..0868b5923 100644
--- a/frontend/src/views/SignupPageView.vue
+++ b/frontend/src/views/SignupPageView.vue
@@ -222,8 +222,7 @@ export default {
   flex-direction: row;
   align-items: center;
   justify-content: center;
-  height: calc(100vh - var(--header-height));
-  padding-top: var(--header-height);
+  height: 100%;
   width: 100%;
   background-color: var(--background-color);
 }
diff --git a/frontend/src/views/SignupReasonPageView.vue b/frontend/src/views/SignupReasonPageView.vue
index 3f76bbea3..1bd4183e4 100644
--- a/frontend/src/views/SignupReasonPageView.vue
+++ b/frontend/src/views/SignupReasonPageView.vue
@@ -82,8 +82,7 @@ export default {
   justify-content: center;
   align-items: center;
   background-color: var(--background-color);
-  height: calc(100vh - var(--header-height));
-  padding-top: var(--header-height);
+  height: 100%;
 }
 
 .reason-title {
diff --git a/frontend/src/views/SiteStatsPageView.vue b/frontend/src/views/SiteStatsPageView.vue
index aab6bca2d..f0c1904b1 100644
--- a/frontend/src/views/SiteStatsPageView.vue
+++ b/frontend/src/views/SiteStatsPageView.vue
@@ -48,7 +48,6 @@ onMounted(loadData)
   max-width: var(--page-max-width);
   background-color: var(--background-color);
   margin: 0 auto;
-  height: calc(100vh - var(--header-height) - 40px);
-  padding-top: calc(var(--header-height) + 20px);
+  height: 100%;
 }
 </style>