#16593: fix: mobile compose row layout
app: web-ui
stale
size: XS
Cluster:
Web UI Enhancements and Fixes
On narrow screens (<600px), the chat compose row was cramped with the textarea, 'New session' button, and 'Send' button all in one line.
This wraps the compose row so the textarea takes full width and the action buttons sit below, right-aligned.
**Before:** Everything squeezed into one row on mobile, input area barely usable
**After:** Textarea full-width, buttons wrap below and align right
<!-- greptile_comment -->
<h3>Greptile Summary</h3>
Improved mobile compose layout by wrapping textarea full-width with actions below and right-aligned on screens <600px.
- Added `flex-wrap: wrap` to `.chat-compose__row` to enable row wrapping
- Set `.chat-compose__field` to full width (`width: 100%`, `flex: 1 1 100%`)
- Right-aligned action buttons using `margin-left: auto` on `.chat-compose__actions`
Note: `openclaw-2026-02-14.log` should not be committed (already flagged in previous review comments).
<h3>Confidence Score: 4/5</h3>
- Safe to merge after removing the log file
- The CSS changes are minimal, well-scoped to mobile breakpoints, and follow standard flexbox patterns for responsive layout. The implementation correctly wraps the compose row and allocates full width to the textarea while right-aligning action buttons. The only issue is the accidentally committed log file which has already been flagged.
- `openclaw-2026-02-14.log` must be removed before merge
<sub>Last reviewed commit: f4756ba</sub>
<!-- greptile_other_comments_section -->
<!-- /greptile_comment -->
Most Similar PRs
#11167: style(chat): UI: add mobile layout for chat compose actions
by junyiz · 2026-02-07
84.3%
#6521: fix: addressed style issue for chat compose and thread on mobile
by spencer-rafada · 2026-02-01
84.2%
#9432: fix(ui): improve Firefox/Gecko compatibility for chat layout
by dbottme · 2026-02-05
74.1%
#9122: fix(webchat): constrain .chat-new-messages to button size
by ridermw · 2026-02-04
73.9%
#16742: fix: prevent iOS Safari zoom on input focus and fix outer shell scr...
by alewcock · 2026-02-15
73.9%
#21940: style(layout): change content display to flex
by homfarnam · 2026-02-20
72.7%
#22263: fix: send button hidden by long node names or small screens
by SimonSchubert · 2026-02-20
72.5%
#9411: Fix: Web UI long message overflow causing unreadable text
by vishaltandale00 · 2026-02-05
71.9%
#18668: feat(ui/chat): chat UX overhaul
by jasonkneen · 2026-02-16
71.5%
#9175: Fix: Constrain webchat 'New messages' icon size to prevent massive ...
by vishaltandale00 · 2026-02-04
71.1%