for developers
Welcome
Boilerplates
Code Linting
Github Actions
Private Registry
Styled
Getting StartedGridGrid.ItemInstallationProps tableUsageModalResponsiveUtils
🔒  Local Setup
🔒  Server Setup
🔒  Code Challenge

Grid.Item

Grid item component, it must be used as direct children of Grid.

Installation

yarn add @madebywild/styled-grid
import { Grid } from '@madebywild/styled-grid'

Props table

area
string | undefined
row
string | number | ReactText[] | undefined
column
string | number | ReactText[] | undefined
alignSelf
"start" | "center" | "end" | "stretch" | "baseline" | undefined

Row Column

<Grid.Item row={[1, 3]} /> // grid-row: 1 / 3
<Grid.Item column={[1, 4]} /> // grid-column: 1 / 4
<Grid.Item column={2} /> // grid-column: 2

Alignment

<Grid.Item alignSelf={"start"} /> // align-self: flex-start
<Grid.Item alignSelf={"end"} /> // align-self: flex-end

Usage