Responsive

As mentioned in Content Block, content items exist at all times on all breakpoints. There are 3 key responsive features in Nyla:
  1. Change Visibility specific to each device
  2. Change the order of content items separately on mobile and desktop
  3. Change a content or design setting separately on mobile and desktop

Breakpoints supported

Nyla sites are fully responsive, however Nyla currently only supports specific settings for mobile and desktop breakpoints. Mobile settings are activated at a screen width of 1000px.  

Device visibility

Hide or show a content item on mobile, desktop, or both.
See Device visibility for more details

Content item order

Item order can be set separately on each device. By default, device order will be linked until it is changed on mobile.
Responsive alt layout.png

Content or design settings

You can unlink content or design settings by clicking on the devices icon on the right of an input. This will allow you to individually edit settings. Fields that do not have the devices icon on the right will be linked on all devices.
An example of how text can be different on mobile and desktop
Responsive diff cont.png
An example of how you could use different images on mobile and desktop
Responsive images.png