RMWC Grid component
npm install @rmwc/gridMaterial design’s responsive UI is based on a column-variate grid layout. It has 12 columns on desktop, 8 columns on tablet and 4 columns on phone.
- Module @rmwc/grid
- Import styles:
- Using CSS Loader
- import '@rmwc/grid/styles';
- Or include stylesheets
- '@material/layout-grid/dist/mdc.layout-grid.css'
- MDC Docs: https://material.io/develop/web/components/layout-grid/
``jsx`
`jsx`
{/ If you need additional control over height of your grid, or need to add SubGrids, you can add your own GridRow components. /}
| Name | Type | Description |
|------|------|-------------|
| align | "left" \| "right" | Specifies the alignment of the whole grid. |children
| | ReactNode | Children for the Grid |fixedColumnWidth
| | boolean | Specifies the grid should have fixed column width. |
| Name | Type | Description |
|------|------|-------------|
| align | "middle" \| "top" \| "bottom" | Specifies the alignment of cell |desktop
| | number | Number of columns to span on a desktop. |order
| | number | Specifies the order of the cell. |phone
| | number | Number of columns to span on a phone. |span
| | number | Default number of columns to span. |tablet
| | number` | Number of columns to span on a tablet. |