Layout/Grid: WithOffset

Grid layout component with column control and alignment
View fullscreen
Source Code
1export const WithOffset = component(() => (
2 <Grid columns={12} gap="md">
3 <GridCol span={6}>
4 <Box>span 6</Box>
5 </GridCol>
6 <GridCol span={4} offset={2}>
7 <Box>span 4, offset 2</Box>
8 </GridCol>
9 <GridCol span={3}>
10 <Box>span 3</Box>
11 </GridCol>
12 <GridCol span={3} offset={6}>
13 <Box>span 3, offset 6</Box>
14 </GridCol>
15 </Grid>
16));