fix(web): stop the conversation column from scrolling sideways

The hero's backdrop ellipse is sized 1051/776 of the hero box so its blur
scales with the input card, which means it reaches past the column whenever
the column is narrower than the glow. `[data-conversation-scroll]` declared
only `overflow-y: auto`, and a box that scrolls in one axis computes the
other axis's initial `visible` to `auto` — so that bleed came back as a real
horizontal scrollbar, 24–95px of range across ordinary laptop widths.

Declare `overflow-x: hidden` on the column instead of leaving the second axis
to be derived. Clipping is unchanged (the box already clipped both axes); the
declaration withdraws only the bar and the user gesture.
This commit is contained in:
creatixchu
2026-08-04 15:02:17 +08:00
parent edabb3c2dc
commit d7a162fc66
8 changed files with 384 additions and 0 deletions

View File

@@ -191,6 +191,14 @@
flex-direction: column;
min-height: 0;
overflow-y: auto;
/* The column scrolls on ONE axis. Stating `hidden` rather than leaving the
initial `visible` is what removes the horizontal bar: a box that scrolls in
one axis computes `visible` to `auto` in the other, so any bleed becomes
user-scrollable. `.heroGlow` bleeds by construction (1051/776 of the hero
box), which put a horizontal scrollbar under every center column narrower
than the glow. Clipping is unchanged — `overflow-y: auto` already made this
a scroll container that clips both axes, so this only takes away the bar. */
overflow-x: hidden;
/* Reserved unconditionally: the composer seat rides this box's content box in
Chat and its padding box under a view's composer overlay, so an `auto`
gutter moves the input card sideways by the bar's width whenever the two