Grid system

The website layout uses a 12 column grid system. The CSS for this resides in src/Css/Base, which utilises flexbox.

The React components <Row> and <Col> hook into these styles, and supply props for customising layout. Please see the code for these components for options.

For example:

<Row

center={['t']} // At tiny breakpoint, center row

>

<Col

md={12} // At medium breakpoint, span 12 columns

lg={6} // At medium breakpoint, span 6 columns

>

Column content goes here

</Col>

<Col

md={12} // At medium breakpoint, span 12 columns

lg={6} // At medium breakpoint, span 6 columns

>

Column content goes here

</Col>

</Row>