Changeset c0e00a2 in Klonkt

Timestamp:

06/26/2026 02:38:00 PM (2 months ago)

Author:

Robin Genis <roboburr@…>

Branches:

main

Children:

f46f2be

Parents:

fdd0d61

Message:

fix(ios): safe-area top for fullscreen editor toolbar + fedi tabs on mobile

1. Fullscreen post-editor toolbar (Done + format icons) sat under the camera/Dynamic Island -> padding-top with env(safe-area-inset-top).
2. Fediverse tabs on mobile (no desktop top-nav there) sat under the notch -> margin-top with safe-area inset + extra headroom.

Location:

src/views

Files:

• pages/post-edit.ejs (modified) (1 diff)
• partials/fedi-tabs.ejs (modified) (1 diff)

src/views/pages/post-edit.ejs

@@ -638 +638 @@
   flex: 1 1 auto; min-height: 0; height: auto; max-height: none;
 }
+/* iOS: in fullscreen the toolbar sits at the very top → push it below the
+   camera / Dynamic Island with the top safe-area inset. */
+.pe-editor-frame.pe-fs .pe-toolbar { padding-top: calc(.4rem + env(safe-area-inset-top, 0px)); }
 /* NB: deliberately NO overflow:hidden on html/body in fullscreen — that could get
    stuck (e.g. leaving fullscreen via navigation) and would block scrolling on the

src/views/partials/fedi-tabs.ejs

@@ -30 +30 @@
 .fedi-tab-badge { flex: 0 0 auto; min-width: 1.15em; padding: 0 .3em; border-radius: 999px;
   background: var(--accent, #e8b04b); color: #fff; font-size: .66rem; line-height: 1.5; text-align: center; }
+/* Mobile: no desktop top-nav here, so clear the camera/notch + give headroom. */
+@media (max-width: 767px) { .fedi-tabs { margin-top: calc(1.5rem + env(safe-area-inset-top, 0px)); } }
 @media (max-width: 520px) { .fedi-tab { padding: .55rem .25rem; font-size: .82rem; } }
 @media (max-width: 380px) { .fedi-tab { font-size: .74rem; } }