From d76c6c70b9afcfcb97a7bba6afb7b8351f76d777 Mon Sep 17 00:00:00 2001 From: John McLear Date: Thu, 23 Apr 2026 20:06:47 +0100 Subject: [PATCH] fix(userlist): stop username input from overlapping the Log out button Fixes #7593. In the pad's Users popup, #myusernameform had no width set and the inside it took its natural content width, pushing past the Log out button and making the button overflow the popup at common widths. Constrain #myusernameform to 75px and make the input fill its container with box-sizing: border-box so the text field stays inside the form and the Log out button sits visibly next to it rather than getting covered or clipped off-screen. Low-risk, CSS-only change. No test plan beyond visual verification because the affected control is in the users popup UI. --- src/static/css/pad/popup_users.css | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/src/static/css/pad/popup_users.css b/src/static/css/pad/popup_users.css index c36da0ef77f..c146dc8072f 100644 --- a/src/static/css/pad/popup_users.css +++ b/src/static/css/pad/popup_users.css @@ -58,6 +58,10 @@ #myusernameform { margin-left: 10px; + /* Constrain the username input so the adjacent Log out button does not + get pushed off the Users popup — previously the input expanded to its + natural default width and overlapped the button. Fixes #7593. */ + width: 75px; } input#myusernameedit { height: 26px; @@ -66,6 +70,11 @@ input#myusernameedit { border: 1px solid #ccc; background-color: transparent; margin: 0; + /* Keep the input inside its 75px container (border + padding included). + Without these the text field renders wider than the container on its + natural content width and overlaps the Log out button. */ + width: 100%; + box-sizing: border-box; } input#myusernameedit:not(.editable) { color: grey;