26-Mar-2026 — add column resizer and blockquote styling #198

build 565 — commit f41fc79

Column resizer (splitter bar)

New ColumnResizerComponent adds a draggable splitter bar between adjacent columns in the CMS page editor, allowing visual adjustment of Bootstrap grid column widths (1–12) by dragging rather than typing values manually. See the how-to article for a user guide with an animated demo.

How it works

• A thin vertical handle appears at the boundary between adjacent columns
• Hovering highlights the handle in green to indicate it is interactive
• Clicking and dragging redistributes width between the two adjacent columns
• A live tooltip displays the current column distribution during the drag (e.g. "6 | 6" or "8 | 4")
• Releasing the mouse or lifting the finger sets the new widths
• Minimum column width is 1 grid unit — columns cannot be dragged to zero
• The combined width of both columns is always preserved

Technical details

• Placed at the right edge of each column (except the last) via dynamic-content-site-edit-text-row.ts
• Calculates grid unit size dynamically from the row's pixel width
• Supports both mouse and touch events (desktop and tablet)
• Hidden when a column is in expanded/focus mode
• Only visible in edit mode — not rendered on the published page
• Follows the same pattern as the existing HeightResizerComponent

Blockquote styling

• Adds styled blockquote rendering to CMS content

for instance the first line looks like this
the next line can be forced onto the next line as long as the line above has two spaces

This is the first line
This will be on a new line because the line above ended with <br>

Wrapping also works with long text:

New ColumnResizerComponent adds a draggable splitter bar between adjacent columns in the CMS page editor, allowing visual adjustment of Bootstrap grid column widths (1–12) by dragging rather than typing values manually.

this is what was entered above:

> for instance the first line looks like this  
the next line can be forced onto the next line as long as the line above has two spaces

  > This is the first line<br>
  > This will be on a new line because the line above ended with `<br>`

Wrapping also works with long text:

> New `ColumnResizerComponent` adds a draggable splitter bar between adjacent columns in the CMS page editor, allowing visual adjustment of Bootstrap grid column widths (1–12) by dragging rather than typing values manually.