{"id":"69c5c65158cf8c0f2d83c94d","title":"2026 03 26","path":"how-to/committee/release-notes/2026-03-26","contentMarkdown":"# 26-Mar-2026 — add column resizer and blockquote styling [#198](https://github.com/nbarrett/ngx-ramblers/issues/198)\n\n## [build 565](https://github.com/nbarrett/ngx-ramblers/actions/runs/23623442347) — [commit f41fc79](https://github.com/nbarrett/ngx-ramblers/commit/f41fc79b86b5e3c4b24a2dc1c37d47a4ba3c0277)\n\n_____\n\n### Column resizer (splitter bar)\nNew `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.\nSee the [how-to article](https://www.ngx-ramblers.org.uk/how-to/committee/editing-content/column-resizer)\nfor a user guide with an animated demo.\n\n![](https://ngx-ramblers.org.uk/api/aws/s3/site-content/a799486e-6574-4568-8e89-d72b9551723c.gif)\n\n\n#### How it works\n- A thin vertical handle appears at the boundary between adjacent columns\n- Hovering highlights the handle in green to indicate it is interactive\n- Clicking and dragging redistributes width between the two adjacent columns\n- A live tooltip displays the current column distribution during the drag\n(e.g. \"6 | 6\" or \"8 | 4\")\n- Releasing the mouse or lifting the finger sets the new widths\n- Minimum column width is 1 grid unit — columns cannot be dragged to zero\n- The combined width of both columns is always preserved\n#### Technical details\n- Placed at the right edge of each column (except the last) via\n`dynamic-content-site-edit-text-row.ts`\n- Calculates grid unit size dynamically from the row's pixel width\n- Supports both mouse and touch events (desktop and tablet)\n- Hidden when a column is in expanded/focus mode\n- Only visible in edit mode — not rendered on the published page\n- Follows the same pattern as the existing `HeightResizerComponent`\n### Blockquote styling\n- Adds styled blockquote rendering to CMS content\n> for instance the first line looks like this \nthe next line can be forced onto the next line as long as the line above has two spaces\n\n > This is the first line
\n > This will be on a new line because the line above ended with `
`\n\nWrapping also works with long text:\n\n> 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.\n\nthis is what was entered above:\n```\n> for instance the first line looks like this \nthe next line can be forced onto the next line as long as the line above has two spaces\n\n > This is the first line
\n > This will be on a new line because the line above ended with `
`\n\nWrapping also works with long text:\n\n> 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.\n```","contentHtml":"

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

\n

build 565 — commit f41fc79

\n
\n

Column resizer (splitter bar)

\n

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.\nSee the how-to article\nfor a user guide with an animated demo.

\n

\"\"

\n

How it works

\n\n

Technical details

\n\n

Blockquote styling

\n\n
\n

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

\n
\n
\n

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

\n
\n

Wrapping also works with long text:

\n
\n

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.

\n
\n

this is what was entered above:

\n
> for instance the first line looks like this  \nthe next line can be forced onto the next line as long as the line above has two spaces\n\n  > This is the first line<br>\n  > This will be on a new line because the line above ended with `<br>`\n\nWrapping also works with long text:\n\n> 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.\n
\n"}