UI: tg-fullscreen header gap +10px (was +20) + font-scale regression test
CI / changes (pull_request) Successful in 1s
CI / unit (pull_request) Has been skipped
CI / integration (pull_request) Has been skipped
CI / ui (pull_request) Successful in 39s
CI / gate (pull_request) Successful in 0s
CI / deploy (pull_request) Successful in 55s

The +20px gap was too far; use +10px (padding-top safe-top+16). The gap is
fixed px, so the clearance from Telegram's native nav stays constant when
the user scales the font up — the title grows downward and the bar with it,
no overflow. Locked by a new e2e test that asserts the title top is
unchanged across font sizes and never overflows the bar.
This commit is contained in:
Ilia Denisov
2026-06-11 15:37:06 +02:00
parent 1b3d7dc256
commit 29f655aacd
2 changed files with 35 additions and 2 deletions
+4 -2
View File
@@ -109,12 +109,14 @@
back chevron is hidden), so min-height (the nav-band height) doesn't bind. Without the
(removed) hamburger that content shrank and the bar sat flush under Telegram's native nav
band. So **padding-top** is the lever: it drops the title clear of the band — the notch
plus a **+20px** gap (was +6). (Owner-tunable: bump the +20px.) */
plus a **10px** gap (was 6). A fixed px (not rem/em) gap so the clearance from Telegram's
native controls stays constant if the user scales up the font (the title then grows
downward and the bar with it). (Owner-tunable: the 10px.) */
min-height: var(--tg-content-top);
box-sizing: border-box;
align-items: center;
justify-content: center;
padding-top: calc(var(--tg-safe-top) + 26px);
padding-top: calc(var(--tg-safe-top) + 16px);
padding-bottom: 6px;
}
:global(html.tg-fullscreen) .spacer {