Layout contains three components to help build 12-column responsive flexbox grids.
Please see these Storybook examples for Layout until this documentation is updated.
Work in progress...
Example
Properties
"Container" Component
"Row" Component
"Col" Component
Usage
Layouts can be oriented horizontal or vertical, fixed or fluid, responsive or not — it's a very flexible 12-column grid.
Other props to talk about...
Considerations
Responsive
A designer should specify the type of grid used in a given layout, and whether it's responsive or not, how it should reflow at breakpoints, etc.
Custom Layouts
When in doubt, consult the design team about how to best tackle converting an existing layout as there could be old conventions we no longer want to carry forward into new layouts.
Best Practices
Do
Make as many columns sortable as possible.
Pick a logical default sort, like "Date Created."
Keep table headers consistent.
Don't
Use different data types in the same column. Keep them consistent.
Add too many columns. Choose the most important information and allow users to dig deeper.
Have too many controls. Limit to one or two actions per row.