← Back to Components
Grid
layoutCSS Grid layout
Parameters
colsgapclassNamePreview
1
2
3
Example
{
"kind": "component",
"name": "Grid",
"props": {
"cols": { "expr": "lit", "value": "3" },
"gap": { "expr": "lit", "value": "md" }
},
"children": [
{ "kind": "element", "tag": "div", "children": [{ "kind": "text", "value": { "expr": "lit", "value": "Item 1" } }] },
{ "kind": "element", "tag": "div", "children": [{ "kind": "text", "value": { "expr": "lit", "value": "Item 2" } }] },
{ "kind": "element", "tag": "div", "children": [{ "kind": "text", "value": { "expr": "lit", "value": "Item 3" } }] }
]
}Installation
Copy component files from:
node_modules/@constela/ui/components/grid/