diff --git a/ui/src/components/Header.svelte b/ui/src/components/Header.svelte index 559e974..3467414 100644 --- a/ui/src/components/Header.svelte +++ b/ui/src/components/Header.svelte @@ -105,15 +105,16 @@ is unchanged) and centres the title within it, BELOW the notch — lining it up vertically with Telegram's own back/menu controls, which sit in the band's corners. */ :global(html.tg-fullscreen) .bar { - /* The bar spans the Telegram nav band and then **+20px** past --tg-content-top, so the - native controls aren't flush against our content. Without the (removed) hamburger the - title alone left the bar sitting right on the band; the extra height restores the gap. - padding-top clears the notch; the title centres in the band. (Owner-tunable height.) */ - min-height: calc(var(--tg-content-top) + 20px); + /* The bar is sized by its content + padding — in Telegram the title is the only child (the + 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.) */ + min-height: var(--tg-content-top); box-sizing: border-box; align-items: center; justify-content: center; - padding-top: calc(var(--tg-safe-top) + 6px); + padding-top: calc(var(--tg-safe-top) + 26px); padding-bottom: 6px; } :global(html.tg-fullscreen) .spacer {