[BUG] Atlaskit Modal Dialog stops being full screen on viewports below 320px

Atlassian Ecosystem Design
, , ,
1

Hi there,

AtlasKit Modal renders the modal is meant to render in full screen on small viewports (below 480px). However, the CSS also seems to have a min-width of 320px which means it breaks on super small viewports (such as the new in-meeting side-panel iframe in Ms Teams).

You can reproduce it by opening an example on https://atlassian.design/components/modal-dialog/examples and changing browser width to below 320px via responsive (and compare it to e.g. 321px).

Thanks!
Nik

2

Hi there,

The Modal Dialog component has no designs for < 320px but there is no clear downside from removing this restriction so I’m happy to look into it.

Alex

1 Like
3

Great, thanks Alex. As long as it works consistently below 480px (i.e. it opens full screen as per docs) rather than revert to not being full screen screen below 320px then IMO it’s good enough.

Granted the use cases are edge case, but perhaps with Zoom and Ms Teams allowing 3rd party apps in side panels it may become more common…