Breakpoints

Breakpoints are frames

Verstka does not use a separate “breakpoint list” for responsiveness. Each breakpoint is a frame on the canvas whose role is set to Breakpoint. A normal Frame role does not take part in viewport-based layout switching.

Why it works this way

Several breakpoint frames are different versions of the article for different viewport widths (e.g. mobile vs desktop). In the editor you see them side by side and edit each variant. On the live site, the reader sees the one variant whose width range matches the current article container width.

Frame role

In the properties panel for a selected frame:

• Frame — a regular frame: a layout container, not used for viewport switching.
• Breakpoint — this frame is a responsive variant: it is included in the breakpoint set and is eligible to become the active version for a given width.

The frame’s width on the canvas is the design width used for scaling and, when you don’t set boundaries manually, for default split points between ranges.

Width ranges

Each breakpoint frame is active for a range of article container width:

• Min / max scale width define that interval. Adjacent breakpoints should share boundaries (one frame’s max equals the next’s min) so there are no gaps or overlaps.
• If those values are not set, the system falls back to midpoints between neighboring frame widths as dividers.

In the editor you can adjust boundaries on a visual scale (drag dividers between breakpoint segments) in the breakpoint frame’s properties.

Scalable

Breakpoint frames expose a Scalable option:

• On — content inside the frame scales with viewport width within the min/max range (scale is derived from effective width vs frame width). One variant can stretch smoothly between hard boundaries.
• Off — no scaling; only switching to another breakpoint frame changes the layout as width changes.

Summary: define multiple frames with role Breakpoint, tune width ranges and Scalable as needed — that is how breakpoints are modeled in Verstka.