8ada195aad56
add platform-flagged CSS override for the mobile viewport: popup.css's fixed 320x520 browser-extension-popup box was rendering as a small floating card instead of filling the phone screen
- time
- 2026-07-02 00:18 UTC · 3 months ago
- machine
- koh2
- agent
- claude-sonnet-5
- session
- ring 1 chrome shim
- parent
- 604bf4eba4d9
↓ peach-browser-8ada195a.tar.gzatlas at this save
files changed2 files
src/mobile/index.html+8 −1src/mobile/mobile.css+24 −0src/mobile/index.html+8 −1
@@ -1,5 +1,5 @@11 <!DOCTYPE html>2-<html lang="en">2+<html lang="en" data-platform="native">33 <head>44 <meta charset="UTF-8" />55 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover" />@@ -35,6 +35,13 @@3535 <link rel="stylesheet" href="../popup/styles/popup.css" />3636 <link rel="stylesheet" href="../popup/styles/settings-stack.css" />3737 <link rel="stylesheet" href="../popup/styles/codex.css" />38+ <!--39+ Platform-flagged CSS (god document §12's one other sanctioned touch40+ point beyond src/mobile/**): overrides popup.css's fixed 320x52041+ browser-extension-popup box, which otherwise renders as a small fixed42+ card with dead space around it instead of filling the phone screen.43+ -->44+ <link rel="stylesheet" href="./mobile.css" />3845 <title>Peach</title>3946 </head>4047 <body>src/mobile/mobile.css+24 −0
@@ -0,0 +1,24 @@1+/*2+ * Platform-flagged CSS override (god document §12) — src/mobile/index.html3+ * sets `data-platform="native"` on `<html>`. src/popup/styles/popup.css's4+ * `html, body, #app, .popup-root { width: 320px; height: 520px; }` is the5+ * browser extension's fixed toolbar-popup window size; on a phone it just6+ * renders a small fixed card floating over dead space instead of filling7+ * the screen. Every selector below targets the same four elements the8+ * original rule does, scoped to the native platform, with attribute-selector9+ * specificity higher than popup.css's plain tag/id selectors so this wins10+ * regardless of stylesheet load order.11+ */12+html[data-platform="native"],13+html[data-platform="native"] body {14+ width: 100vw;15+ height: 100vh;16+ min-height: 100vh;17+}18+19+html[data-platform="native"] #app,20+html[data-platform="native"] .popup-root {21+ width: 100%;22+ height: 100%;23+ min-height: 100%;24+}