content-split-block
Description
A split block is a common layout where two pieces of content are shown side by side. This is similar to a grid layout, but with the ability to reverse the columns per breakpoint. On smaller screens stacks into a tout layout.
Benefits
Split blocks can optionally reverse the display of conten, and stack to single column on small screens. This may be useful to reverse the content in situations where the order of HTML output is hard to control, such as a CMS driven template. A "column1" / "column2" slot can be reversed with this component based on the breakpoint.
Properties
| Property |
Attribute |
Description |
Type |
Default |
class |
class |
|
string |
undefined |
columns |
columns |
|
string |
'1|2' |
reverse |
reverse |
|
boolean | string |
false |
Slots
| Slot |
Description |
"column1" |
This will be column 1. |
"column2" |
This will be column 2. |
Dependencies
Depends on
Graph
graph TD;
content-split-block --> content-grid-formatter
style content-split-block fill:#f9f,stroke:#333,stroke-width:4px