vndangkhoa/open-design
1
0
Fork 0
mirror of https://github.com/nexu-io/open-design.git synced 2026-06-01 03:14:35 +07:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

fix(web): wrap long note text inside picker/comment popover so it cannot push the layout sideways (#782) (#830)

Browse source 
The .board-note-item flex container holds a span (note text) and a
Remove button. The span had no width hints, so an unbroken long string
(URL, hash, base64, etc.) tried to fit on one line and pushed the row
wider than the 320px popover, distorting the overlay's right edge and
the surrounding picker UI.

Added flex: 1 + min-width: 0 + overflow-wrap: anywhere to the note
span. flex: 1 lets the span take remaining width next to the Remove
button; min-width: 0 lifts the default flex-item min-content floor so
shrinking actually works; overflow-wrap: anywhere allows the long
string to break at any character when natural word boundaries aren't
enough. No layout change for normal-length notes.

Co-authored-by: Nagendhra <nagendhra405@gmail.com>
This commit is contained in:
Nagendhra Madishetti 2026-05-07 10:35:14 -04:00 committed by GitHub
parent c3c1b7c7b9
commit 9c64ef1b2b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 8 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
apps/web/src/index.css
View file

@ -5865,7 +5865,15 @@ button.connector-action.is-loading {
font-size: 12px;
}
.board-note-item span {
/* The note span sits next to a Remove button inside a fixed-width
~300px popover. Without flex: 1 + min-width: 0 + overflow-wrap an
unbroken long string (URL, hash, base64) refuses to break and
pushes the popover layout sideways past its 320px boundary.
Issue #782. */
flex: 1;
min-width: 0;
color: var(--text);
overflow-wrap: anywhere;
}
.comment-popover textarea {
min-height: 78px;