Skip to content

fix(ratewise): 內容頁錨點 safe-area 連動與修復 @font-face 被 Beasties 剝除 - #616

Merged
s123104 merged 1 commit into
experiment/ratewise-product-2026h2from
hotfix/content-nav-safe-area-h7
Jul 5, 2026
Merged

fix(ratewise): 內容頁錨點 safe-area 連動與修復 @font-face 被 Beasties 剝除#616
s123104 merged 1 commit into
experiment/ratewise-product-2026h2from
hotfix/content-nav-safe-area-h7

Conversation

@s123104

@s123104 s123104 commented Jul 5, 2026

Copy link
Copy Markdown
Contributor

Refs #600(safe-area 主修已由 #605 完成並併入 base;本 PR 保留 #600 的兩件獨有價值)

摘要

  • 錨點 scroll-mt 連動(fix(ratewise): 內容頁 sticky 返回列補 safe-area-inset-top 適配 #605 未涵蓋):sticky 返回列在 PWA standalone 下因 safe-area 變高(+59px),錨點目標的 scroll-mt-20(固定 80px)不足,隱私頁目錄與使用指南步驟跳轉後被返回列遮蔽。三處(Privacy 目錄、Guide 步驟、ContentSections)改 scroll-mt-[calc(5rem+env(safe-area-inset-top,0px))]
  • 字體根因修復(PM 裁定採本方案):品牌字體 @font-face 原在 index.html 內嵌樣式,Beasties 逐 sheet 判定 critical fonts 時因該 sheet 無使用者而整條剝除並注入重複 preload → 全站「unused preload」console warning、頁首 wordmark 永遠回落系統字體(正式站取證:HTML 無任何 @font-face)。修法:@font-face 移至 src/index.css(與 .brand-wordmark 同 sheet)+ ssgOptions.beastiesOptions = { inlineFonts: true, preloadFonts: false }fix(ratewise): manifest 網域改由 VITE_SITE_URL 環境驅動 #613 縮窄為 manifest 專用,不再碰字體。

錨點跳轉量測(CDP inset top 59px、390×844、build preview)

頁面 錨點 targetTop headerBottom 不被遮蔽
/privacy/ #overview 139 124
/guide/ #step-1 139.25 124

(修復前 scroll-mt-20 僅預留 80px,sticky 列實高 124px,target 會被壓在列下。)

字體前後證據

修復前(正式站/staging 取證)

  • HTML 經 Beasties 處理後無任何 @font-face(剝除);同時被注入第二個 font preload
  • 全站 console:The resource ...nunito-wordmark-900.woff2 was preloaded using link preload but not used within a few seconds...
  • wordmark 一直以 fallback 系統字體渲染

修復後(build dist + preview 驗證)

  • dist HTML critical CSS 與外部 CSS 均保留 @font-face(URL 帶 base:/ratewise/fonts/nunito-wordmark-900.woff2
  • preload 單一化(preloadCount === 1),字體請求 200
  • document.fonts.check('900 16px "Nunito Wordmark"') === true(首頁與 FAQ 頁)
  • preload/React 警告歸零

#605 的分工

附帶取證(沿用先前調查)

審查收斂(APPROVE 後)

閘門

@chatgpt-codex-connector

Copy link
Copy Markdown

You have reached your Codex usage limits for code reviews. You can see your limits in the Codex usage dashboard.
To continue using code reviews, you can upgrade your account or add credits to your account and enable them for code reviews in your settings.

s123104 pushed a commit that referenced this pull request Jul 5, 2026
- generate-manifest 的 scope/start_url 改由 VITE_SITE_URL 環境變數驅動+trailing-slash 正規化,
  未設定時回退 APP_INFO.siteUrl,committed manifest 預設輸出零 diff(已實證)
- staging 等替代網域部署設 VITE_SITE_URL 即可脫離跨網域 scope,不硬編任何 staging 網域;
  id 維持 /ratewise/ 不破壞既有安裝更新連續性
- build-scripts 測試同步改斷言 env 驅動寫法;002 與 changeset 對齊 manifest 專用範圍
- 字體 @font-face 被 Beasties 修剪部分經 PM 裁決移交 #616(inlineFonts 方案)處理

測試:pnpm vitest run、pnpm typecheck、pnpm build:ratewise、
generate:deterministic 冪等+committed manifest 零 diff、verify:artifacts 通過

Co-authored-by: Cursor <cursoragent@cursor.com>
@s123104
s123104 force-pushed the hotfix/content-nav-safe-area-h7 branch from aff889f to c416914 Compare July 5, 2026 21:27
@github-actions

github-actions Bot commented Jul 5, 2026

Copy link
Copy Markdown
Contributor

⚠️ Deprecation Warning: The deny-licenses option is deprecated for possible removal in the next major release. For more information, see issue 997.

Dependency Review

✅ No vulnerabilities or license issues or OpenSSF Scorecard issues found.

Scanned Files

None

@s123104 s123104 changed the title fix(ratewise): 內容頁 sticky 返回列疊加 safe-area-inset-top 修復 PWA 狀態列遮蔽 fix(ratewise): 內容頁錨點 safe-area 連動與修復 @font-face 被 Beasties 剝除 Jul 5, 2026
@github-actions

github-actions Bot commented Jul 5, 2026

Copy link
Copy Markdown
Contributor

✅ SEO 審計通過!所有 2026 標準驗證項目都符合要求。

  • ✅ Sitemap 2026 標準
  • ✅ Breadcrumb Schema
  • ✅ JSON-LD 結構化數據
  • ✅ 內部連結結構

s123104 pushed a commit that referenced this pull request Jul 5, 2026
- generate-manifest 的 scope/start_url 改由 VITE_SITE_URL 環境變數驅動+trailing-slash 正規化,
  未設定時回退 APP_INFO.siteUrl,committed manifest 預設輸出零 diff(已實證)
- staging 等替代網域部署設 VITE_SITE_URL 即可脫離跨網域 scope,不硬編任何 staging 網域;
  id 維持 /ratewise/ 不破壞既有安裝更新連續性
- build-scripts 測試同步改斷言 env 驅動寫法;002 與 changeset 對齊 manifest 專用範圍
- 字體 @font-face 被 Beasties 修剪部分經 PM 裁決移交 #616(inlineFonts 方案)處理

測試:pnpm vitest run、pnpm typecheck、pnpm build:ratewise、
generate:deterministic 冪等+committed manifest 零 diff、verify:artifacts 通過

Co-authored-by: Cursor <cursoragent@cursor.com>
- 錨點 scroll-mt(隱私目錄、Guide 步驟、ContentSections)疊加 env(safe-area-inset-top)
- sticky 列於 standalone 變高(PR 605)後,錨點跳轉不再被遮蔽(issue 600 連動項)
- 品牌字體 @font-face 由 index.html 內嵌樣式移至 src/index.css(與 .brand-wordmark 同 sheet)
- beastiesOptions 設 inlineFonts:true/preloadFonts:false,SSG 不再剝除 @font-face 與重複 preload
- ContentPageLayout 補錨點斷言;index.html 測試改斷言 @font-face 居於 index.css

測試:vitest 3324 passed;typecheck 綠;build 綠;CDP inset 59px 錨點量測與 fonts.check 複驗通過

Co-authored-by: Cursor <cursoragent@cursor.com>
@s123104
s123104 force-pushed the hotfix/content-nav-safe-area-h7 branch from c416914 to edfe2ef Compare July 5, 2026 22:04
@github-actions

github-actions Bot commented Jul 5, 2026

Copy link
Copy Markdown
Contributor

✅ SEO 審計通過!所有 2026 標準驗證項目都符合要求。

  • ✅ Sitemap 2026 標準
  • ✅ Breadcrumb Schema
  • ✅ JSON-LD 結構化數據
  • ✅ 內部連結結構

@s123104
s123104 merged commit 3a85c1c into experiment/ratewise-product-2026h2 Jul 5, 2026
11 checks passed
@s123104
s123104 deleted the hotfix/content-nav-safe-area-h7 branch July 5, 2026 22:18
s123104 pushed a commit that referenced this pull request Jul 5, 2026
- generate-manifest 的 scope/start_url 改由 VITE_SITE_URL 環境變數驅動+trailing-slash 正規化,
  未設定時回退 APP_INFO.siteUrl,committed manifest 預設輸出零 diff(已實證)
- staging 等替代網域部署設 VITE_SITE_URL 即可脫離跨網域 scope,不硬編任何 staging 網域;
  id 維持 /ratewise/ 不破壞既有安裝更新連續性
- build-scripts 測試同步改斷言 env 驅動寫法;002 與 changeset 對齊 manifest 專用範圍
- 字體 @font-face 被 Beasties 修剪部分經 PM 裁決移交 #616(inlineFonts 方案)處理

測試:pnpm vitest run、pnpm typecheck、pnpm build:ratewise、
generate:deterministic 冪等+committed manifest 零 diff、verify:artifacts 通過

Co-authored-by: Cursor <cursoragent@cursor.com>
s123104 added a commit that referenced this pull request Jul 5, 2026
- generate-manifest 的 scope/start_url 改由 VITE_SITE_URL 環境變數驅動+trailing-slash 正規化,
  未設定時回退 APP_INFO.siteUrl,committed manifest 預設輸出零 diff(已實證)
- staging 等替代網域部署設 VITE_SITE_URL 即可脫離跨網域 scope,不硬編任何 staging 網域;
  id 維持 /ratewise/ 不破壞既有安裝更新連續性
- build-scripts 測試同步改斷言 env 驅動寫法;002 與 changeset 對齊 manifest 專用範圍
- 字體 @font-face 被 Beasties 修剪部分經 PM 裁決移交 #616(inlineFonts 方案)處理

測試:pnpm vitest run、pnpm typecheck、pnpm build:ratewise、
generate:deterministic 冪等+committed manifest 零 diff、verify:artifacts 通過

Co-authored-by: haotool <haotool.org@gmail.com>
Co-authored-by: Cursor <cursoragent@cursor.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant