eleven / ocho Public

web: lift the composer label above the rich composer's input (#915)

The inset label ('Your name:') is position:absolute with no z-index; it
painted above the classic textarea (in-flow) but the ProseMirror
contenteditable (#888) is position:relative, so its opaque input pill
paints over the label in DOM order — the text indent applied but the
pill was buried. z-index:1 restores it over both backends.

Co-authored-by: Claude Fable 5 <noreply@anthropic.com>

Paul Campbell 3 months ago 98282bff00eff0e267abcbeeaacdd12a94a9b990 parent 948bc70

1 file changed, +4 −0

web/static/style.css +4 −0

diff --git a/web/static/style.css b/web/static/style.css

index d7d459b..85022f0 100644

--- a/web/static/style.css

+++ b/web/static/style.css

@@ -1573,6 +1573,10 @@ input:focus, textarea:focus { outline: 2px solid var(--accent); border-color: tr

height and keeps it on line one as the box grows. */

.composer-label {

position: absolute;

+ /* Above the input: the rich composer's contenteditable is position:relative

+ (unlike the classic textarea), so without a z-index its opaque pill paints

+ over this label in DOM order. */

+ z-index: 1;

left: 12px;

top: 9px;

padding: 1px 9px;