fix(build): serve Bootstrap + FA statically from public/assets/vendor — fixes tofu icons (#818) #861

Merged
jmiller merged 1 commits from feat/mobile-retheme into dev 2026-07-21 21:08:49 +00:00
Owner

Real root cause of the tofu FA icons (previous .gitattributes theory was wrong): Vite's asset file-emission corrupts the binary woff2 during make frontend — served magic bytes d46b6c0e, 512 bytes short of valid wOF2; the inlined data-URI regular font worked, the file-emitted solid font didn't. git checkout + nginx were both ruled out (server working-tree font + committed blob are valid wOF2; Content-Length header even reports the correct 113152 while the body is corrupt).

Fix + reorg (vendored tools now live in a vendor folder, per request): move Font Awesome and Bootstrap into public/assets/vendor/{fontawesome,bootstrap}, which Gitea embeds and serves byte-exact (same mechanism as public/assets/img, proven by the working favicon). head.tmpl <link>s the CSS (Bootstrap before the Fomantic bundle) and <script defer>s Bootstrap JS; removed the FA/Bootstrap imports from the Vite entry. <body data-bs-no-jquery> still prevents the Fomantic jQuery-plugin clobber.

Verified diagnosis on dev via document.fonts (fa-solid-900 face status: "error") + magic-byte diff of served vs source. After this, the FA CSS resolves url(../webfonts/…) to the static byte-exact fonts.

https://claude.ai/code/session_01D5Zxu4xRRGoh9etzgShP4P

Real root cause of the tofu FA icons (previous `.gitattributes` theory was wrong): **Vite's asset file-emission corrupts the binary woff2** during `make frontend` — served magic bytes `d46b6c0e`, 512 bytes short of valid `wOF2`; the inlined data-URI regular font worked, the file-emitted solid font didn't. git checkout + nginx were both ruled out (server working-tree font + committed blob are valid `wOF2`; Content-Length header even reports the correct 113152 while the body is corrupt). Fix + reorg (vendored tools now live in a vendor folder, per request): move Font Awesome and Bootstrap into `public/assets/vendor/{fontawesome,bootstrap}`, which Gitea embeds and serves **byte-exact** (same mechanism as `public/assets/img`, proven by the working favicon). `head.tmpl` `<link>`s the CSS (Bootstrap before the Fomantic bundle) and `<script defer>`s Bootstrap JS; removed the FA/Bootstrap imports from the Vite entry. `<body data-bs-no-jquery>` still prevents the Fomantic jQuery-plugin clobber. Verified diagnosis on dev via `document.fonts` (`fa-solid-900` face `status: "error"`) + magic-byte diff of served vs source. After this, the FA CSS resolves `url(../webfonts/…)` to the static byte-exact fonts. https://claude.ai/code/session_01D5Zxu4xRRGoh9etzgShP4P
jmiller added 1 commit 2026-07-21 21:08:26 +00:00
fix(build): serve Bootstrap + Font Awesome statically from public/assets/vendor (#818 #719)
Universal: PR Check / Branch Policy (pull_request) Successful in 2s
Universal: PR Check / Require Docs Update (pull_request) Has been skipped
Universal: PR Check / Wiki Update Reminder (pull_request) Has been skipped
Generic: Project CI / Tests (pull_request) Successful in 38s
Generic: Project CI / Lint & Validate (pull_request) Successful in 40s
Branch Cleanup / Delete merged branch (pull_request) Successful in 2s
RC Revert / Rename rc/ back to dev/ (pull_request) Has been skipped
Universal: PR Check / Validate PR (pull_request) Successful in 10s
Universal: PR Check / Secret Scan (pull_request) Successful in 57s
Universal: PR Check / Build RC Package (pull_request) Has been cancelled
Universal: PR Check / Report Issues (pull_request) Has been cancelled
c2a8894eee
Real root cause of the tofu icons: Vite's asset FILE-emission corrupts the binary woff2
during `make frontend` (served font magic bytes `d46b6c0e`, 512 bytes short of the valid
`wOF2`; the inlined data-URI regular font worked, the file-emitted solid font did not).
git checkout and nginx were ruled out (server working-tree font + committed blob are valid
wOF2; Content-Length header even reports the correct 113152 while the body is corrupt).

Fix + reorg (per request: vendored tools live in a vendor folder): move Font Awesome and
Bootstrap out of the Vite pipeline into public/assets/vendor/{fontawesome,bootstrap}, which
Gitea embeds and serves byte-exact (like public/assets/img, verified by the working favicon).
- head.tmpl <link>s the vendored CSS (Bootstrap before the Fomantic bundle so Reboot is
  overridden on desktop) and <script defer>s Bootstrap's JS bundle.
- Remove the FA + Bootstrap @import from web_src/css/index.css and the Bootstrap JS import
  from web_src/js/index.ts.
- <body data-bs-no-jquery> still prevents Bootstrap clobbering Fomantic's jQuery plugins.

mokoonyx stays under web_src/css/vendor (pure CSS tokens that must be bundled, no binary).

Authored-by: Moko Consulting
Claude-Session: https://claude.ai/code/session_01D5Zxu4xRRGoh9etzgShP4P
jmiller merged commit 34f9ae6119 into dev 2026-07-21 21:08:49 +00:00
jmiller deleted branch feat/mobile-retheme 2026-07-21 21:08:50 +00:00
Sign in to join this conversation.