The screen layout of the Storefront is driven by configurable breakpoints.
The breakpoints have a configurable screen size (i.e. < 576px), and associated screen name can be used to further define the layout.
A good example is the page template slot configuration, which can be adjusted per screen name, so that the layout differs per screen size (i.e. mobile vs desktop).
Other features can however also use the screen names to further enhance rendering of the feature. A good example is the table component, which has a configurable list of headers, based on the screen.
The creation of screen specific DOM is what we call adaptive design. This design is optimized for small screens, but is also optimized for accessibility.
