Changeset 7d81265 in Klonkt for src/views/pages/post-edit.ejs

Timestamp:

06/19/2026 12:24:21 PM (3 months ago)

Author:

roboburr <roboburr@…>

Branches:

main

Children:

9217e4e

Parents:

859bace0

Message:

fix(editor): toolbar sticky inside the scroll box on mobile

The frame is now the scroll box (max-height 70vh, overflow auto); the
text scrolls inside it and the formatting toolbar (position:sticky top:0)
stays pinned at the top of the box. Caret scroll stays within the box →
no page jump. Fullscreen is excluded.

Co-Authored-By: Claude <noreply@…>

File:

• src/views/pages/post-edit.ejs (modified) (1 diff)

src/views/pages/post-edit.ejs

@@ -469 +469 @@
 }
 .pe-editor:focus { outline: none; }
-/* Mobiel: begrens het schrijfveld tot een box met EIGEN interne scroll. Zo blijft
-   de caret-scroll (die mobiel Chrome forceert bij een opmaak-commando) binnen de
-   box i.p.v. de hele pagina te laten verspringen. De toolbar staat er sticky boven.
-   In fullscreen vult het veld de hele pagina (regel hierboven wint via .pe-fs). */
+/* Mobiel: het FRAME is de scroll-box. De opmaak-toolbar plakt sticky aan de
+   bovenkant ervan en de tekst scrollt eronder → de toolbar blijft altijd in beeld
+   binnen de box, én de caret-scroll (die mobiel Chrome forceert) blijft binnen de
+   box i.p.v. de hele pagina te laten verspringen. Fullscreen (.pe-fs) is
+   uitgezonderd: daar scrollt het veld zelf en vult het de pagina. */
 @media (max-width: 768px) {
-  .pe-editor { min-height: 240px; max-height: 62vh; }
+  .pe-editor-frame:not(.pe-fs) { max-height: 70vh; overflow-y: auto; }
+  .pe-editor-frame:not(.pe-fs) .pe-editor { min-height: 240px; max-height: none; overflow: visible; }
 }
 .pe-editor.is-dragover {