Responsive design is incredibly easy in Breakdance thanks to the various responsive design features.
Viewport widths or device sizes are often referred to as “breakpoints” in web design & development.
To preview your design at a specific breakpoint, click the breakpoints dropdown near the top middle of the Breakdance interface.
There, you’ll find a number of default breakpoints to choose from. If you’ve designated any custom breakpoints, they’ll appear as well.
By choosing a breakpoint, the Breakdance design preview panel will adjust its size to the size of that breakpoint, allowing you to see how your design will look at various viewport widths.
If a setting needs to be adjusted at a certain breakpoint, you can do that by either selecting the appropriate breakpoint and then making changes, or by using the breakpoint dropdown next to the setting’s label in the Properties panel.
Note that not all settings can be set responsively. To determine which ones can be set responsively on a per-breakpoint basis, look for the breakpoint dropdown next to the setting’s label in the Properties panel. If this isn’t present, the setting cannot be set responsively.
If you want to hide an element only on specific breakpoints, you can do that in the Advanced (gear icon) tab in the Properties panel, under “Hide On Breakpoint.”
There, you can set which specific breakpoints you want the element to be hidden at.