fix: add page header padding for mobile layout (#1056)

* fix: add page header padding for mobile layout

* fix: limit page header padding to mobile layout

* docs: update changelog for mobile header fix

---------

Co-authored-by: dreamhunter2333 <dreamhunter2333@gmail.com>

CHANGELOG.md

@@ -13,6 +13,7 @@
 ### Bug Fixes
 
 - fix: |AI 提取| HTML-only 邮件在发送给 Workers AI 前会先压缩为可读文本，避免样式模板过长导致验证码位于 4000 字截断之后而无法识别
+- fix: |Frontend| 移动端 Header 增加页头内边距，避免标题、菜单按钮与屏幕边缘过近
 
 ### Improvements
 

CHANGELOG_EN.md

@@ -13,6 +13,7 @@
 ### Bug Fixes
 
 - fix: |AI Extract| Convert HTML-only mail bodies into compact readable text before sending them to Workers AI, preventing long templates from pushing verification codes past the 4000-character truncation window
+- fix: |Frontend| Add mobile Header page padding so the title and menu button no longer sit too close to the screen edge
 
 ### Improvements
 

frontend/src/views/Header.vue

@@ -435,6 +435,10 @@ onMounted(async () => {
 }
 
 @media (max-width: 640px) {
+    :deep(.n-page-header) {
+        padding: 10px;
+    }
+
     :deep(.n-page-header__title) {
         min-width: 0;
     }