From fdc533aba4b44ef6c5b09caba5dfb7fe25dcb922 Mon Sep 17 00:00:00 2001 From: Sergey Kozyrenko Date: Wed, 8 Jul 2026 13:22:06 +0700 Subject: [PATCH] docs(markdown-editor): trim the height comment to the two load-bearing gotchas Co-Authored-By: Claude Opus 4.8 --- .../shared/markdown-editor/markdown-editor-field.tsx | 9 +++------ 1 file changed, 3 insertions(+), 6 deletions(-) diff --git a/frontend/src/components/shared/markdown-editor/markdown-editor-field.tsx b/frontend/src/components/shared/markdown-editor/markdown-editor-field.tsx index acf99dad..0f793802 100644 --- a/frontend/src/components/shared/markdown-editor/markdown-editor-field.tsx +++ b/frontend/src/components/shared/markdown-editor/markdown-editor-field.tsx @@ -80,12 +80,9 @@ export function MarkdownEditorField({ [mode, onChange, disabled], ); - // The field owns its height so no consumer repeats it: it fills its flex parent on desktop (the split-view - // panes) and takes a FIXED near-viewport height on mobile/tablet (the stacked forms). Fixed, not `min-h`, so a - // long doc scrolls inside the editor instead of stretching the page to its full content height — the mobile - // stack has no flex parent to cap it. Keyed off the SAME breakpoint hook the surrounding layouts switch on so - // the two never disagree; a plain CSS media-query variant would drift from that JS breakpoint. `className` is - // last, so a consumer can still override the height. + // `h-`, not `min-h`: the mobile/tablet stack has no flex parent to cap the box, so `min-h` would let a long + // doc stretch the editor (and the page) to full content height instead of scrolling inside it. Height tracks + // useBreakpoint, not a CSS variant, because the layouts split at 1200px — which is no Tailwind breakpoint. const { isDesktop } = useBreakpoint(); const boxClassName = cn(isDesktop ? 'min-h-0 flex-1' : 'h-[calc(100dvh-5rem)]', className);