Skip to main content
← 03 — Call to Action Variants
Design System
05 — Cards, Stats & Key Benefits →

Bard Set — Row (2 Column, 50/50)

The Row set creates a responsive column grid inside a bard_text block. type: row, columns array. Each column has: width (12), width_md, width_lg, content (nested bard nodes), mobile_order. Common splits: 50/50 (6+6), 60/40 (7+5), 70/30 (8+4). Columns stack on mobile. Supports gap, align_items, justify_content settings.

Coordinated from Day One

This is the left column of a 50/50 row layout. It spans 6 of 12 grid columns on desktop and stacks to full width on mobile. Use this for text + image or text + text compositions.

One Team, One Model

This is the right column. Both columns are equal width. On tablet they may collapse to a single column depending on content size. Configure in the column settings panel.

Bard Set — Row with Image (Asymmetric 7/5)

Asymmetric column split with an inline image set in one column. The image set (type: image) supports: image (asset path), size (full · auto), aspect (4_3 · 16_9 · 1_1 · none), alignment (left · center · right), show_shadow (boolean). mobile_order can be used to reorder columns on mobile.

Multi-Discipline Engineering Under One Roof

This wider column holds editorial copy at 7/12 grid width. Greenview brings structural, civil, mechanical, electrical, hydraulics, fire protection, ESD and BIM coordination together in a single coordinated team. The result is fewer clashes, fewer variations, and faster approvals through council and certifiers.

Learn about our approach

Bard Set — Icon List

type: icon_list. Replaces standard bullet points with custom icons. Each item has: icon (icon slug from the icon set), text. Ideal for feature lists, key-point callouts, or service summaries. Icons must match slugs available in the icon partial.

Item 1

Item 1 description

Item 2

Item 2 description

Bard Set — Accordion (Inline)

type: accordion. Creates collapsible FAQ-style content inline within a bard_text block. Each item has: question, answer. For a full-width accordion section, use the standalone accordion block instead (type: accordion at page builder level). color_scheme: mid shown here.

Replaces standard bullet points with custom icons. Each item has: icon (icon slug from the icon set), text. Ideal for feature lists, key-point callouts, or service summaries. Icons must match slugs available in the icon partial.

Bard Set — Spacer (Inline)

type: spacer. Adds configurable vertical whitespace within a bard_text block. Options: spacing_size (xsmall · small · medium · large · xlarge · xxlarge). Below: a small spacer, then a large spacer between paragraphs.

Paragraph above a small spacer.

Paragraph between small and large spacer.

Paragraph after large spacer.

Bard Set — Inline Testimonial Quote

type: testimonial. A single testimonial quote embedded inline within bard content. Fields: quote, name, role, company. Use to break up long-form editorial copy with a credibility signal. For a full carousel of testimonials, use the standalone testimonials block. color_scheme: dark shown here.

Supporting editorial copy before the testimonial quote. This is a normal paragraph that sets context for the quote below.

The incubator allowed us [on the] areas that are critical to the success of our social enterprise both from an operational and impact perspective. It has helped us develop and implement improvements that have assisted us in dramatically strengthening what we offer, improving our processes and become more sustainable
Photo of Andrea Comastri
Andrea Comastri
Co-founder and CEO of Hotel Etico

Editorial copy continues after the testimonial, maintaining the reading flow.