Grid

Grid layout that will adjust number columns depending on the space available.

The props gridColumnSpace and gridRowSpace can be used to define separate gutters widths between columns and rows.

This will only come into effect if gridSpace is not applied or is an empty string - otherwise the gridSpace value will be used.

Usage

<script>
	import { Grid } from 'creditdesign-svelte-components';
</script>

<Grid
	gridSpace="var(--s-1)"
	gridColumnSpace=""
	gridRowSpace=""
	minWidth="var(--measure-small)"
	list={false}
	className="test"
>
	<span>Item</span>
	<span>Item</span>
	<span>Item</span>
	...
</Grid>

Props

Examples