fix(mobile): deep-audit structural fixes — dialogs, toasts, call bar (N1)
From the 6-agent deep per-feature audit. Mobile-gated / consistency fixes; desktop unchanged except two intentional dialog-width normalizations noted below. - In-call control bar: wrap="Wrap" on the SequenceCard so the compact two-group row wraps on the narrowest phones (<=390px) instead of pushing End off-screen (M1 fixed the 500-750px band; this covers narrower). Desktop stays one row. - In-call soundboard popout: clamp maxWidth to the viewport (like M5's screenshare popover) so it can't overflow a narrow phone. - Report-Message dialog + "Seen by" (EventReaders) modals (Message.tsx x2 + RoomViewFollowing): add useModalStyle so they go full-screen on mobile like their sibling report/receipt modals (they floated as fixed cards before). - In-app toast container: full-width toasts inset from both edges on mobile (ScreenSize.Mobile); a fixed 280-340px card previously overflowed a narrow phone. Desktop byte-identical (bottom-right floating card). - Policy-list tabs + audio-controls rows: wrap="Wrap" (inert on desktop). Intentional desktop deltas (normalizing to existing sibling modals, verified by two review passes as consistent, not regressions): Report dialog max-width 380->480px; EventReaders modals 460->360px. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -387,6 +387,7 @@ export function CallControls({ callEmbed }: CallControlsProps) {
|
||||
radii="500"
|
||||
alignItems="Center"
|
||||
justifyContent="SpaceBetween"
|
||||
wrap="Wrap"
|
||||
>
|
||||
<Box alignItems="Center" gap="Inherit" grow="Yes" direction={compact ? 'Column' : 'Row'}>
|
||||
<Box shrink="No" alignItems="Inherit" justifyContent="Inherit" gap="200">
|
||||
|
||||
@@ -135,7 +135,12 @@ export function CallSoundboard({ callEmbed }: CallSoundboardProps) {
|
||||
escapeDeactivates: stopPropagation,
|
||||
}}
|
||||
>
|
||||
<Menu style={{ maxWidth: manage ? toRem(420) : toRem(340), maxHeight: '70vh' }}>
|
||||
<Menu
|
||||
style={{
|
||||
maxWidth: `min(${manage ? toRem(420) : toRem(340)}, calc(100vw - 2 * ${config.space.S400}))`,
|
||||
maxHeight: '70vh',
|
||||
}}
|
||||
>
|
||||
<Box direction="Column" style={{ maxHeight: '70vh' }}>
|
||||
<Box
|
||||
shrink="No"
|
||||
|
||||
Reference in New Issue
Block a user