Changeset 859bace0 in Klonkt for src/views/pages

Timestamp:

06/19/2026 12:20:35 PM (3 months ago)

Author:

roboburr <roboburr@…>

Branches:

main

Children:

7d81265

Parents:

2d596cf

Message:

fix(editor): mobile writing field as bounded box with internal scroll

The field grew with the text → the whole page scrolled to the caret on a
formatting command. On mobile now min-height 240 / max-height 62vh +
overflow auto: caret scroll stays within the box, the page does not jump,
and the toolbar sits sticky above it. Fullscreen resets max-height to none
(fills the page).

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

File:

• src/views/pages/post-edit.ejs (modified) (2 diffs)

src/views/pages/post-edit.ejs

@@ -446 +446 @@
   background: var(--paper);
 }
-/* In fullscreen vult het schrijfveld de resterende ruimte en scrollt het zelf. */
+/* In fullscreen vult het schrijfveld de resterende ruimte en scrollt het zelf
+   (max-height: none overschrijft de mobiele box-begrenzing hieronder). */
 .pe-editor-frame.pe-fs .pe-editor {
-  flex: 1 1 auto; min-height: 0; height: auto;
+  flex: 1 1 auto; min-height: 0; height: auto; max-height: none;
 }
 body.pe-fs-open { overflow: hidden; }
@@ -468 +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). */
+@media (max-width: 768px) {
+  .pe-editor { min-height: 240px; max-height: 62vh; }
+}
 .pe-editor.is-dragover {
   outline: 2px dashed var(--accent);