UNPKG

@workday/canvas-kit-docs

Version:

Documentation components of Canvas Kit components

github.com/workday/canvas-kit

workday/canvas-kit

12 lines (11 loc) • 806 B
1
2
3
4
5
6
7
8
9
10
11
12
import * as React from 'react'; import { Grid } from '@workday/canvas-kit-react/layout'; const baseStyles = { color: 'blackPepper500', padding: 'xs', }; export const GridExample = () => (React.createElement(Grid, { gridGap: "xs", gridTemplateAreas: "'head head' 'nav main' 'nav foot'", gridTemplateColumns: "1fr 3fr", gridTemplateRows: "2.5rem minmax(10rem, auto) 2.5rem" }, React.createElement(Grid.Item, { gridArea: "head", backgroundColor: "cinnamon300", ...baseStyles }), React.createElement(Grid.Item, { gridArea: "nav", backgroundColor: "sourLemon300", ...baseStyles }), React.createElement(Grid.Item, { gridArea: "main", backgroundColor: "blueberry300", ...baseStyles }), React.createElement(Grid.Item, { gridArea: "foot", backgroundColor: "cinnamon300", ...baseStyles })));