Container
A centered content wrapper with max-width size variants.
Loading preview…
1<script lang="ts">
2 import Container from './container.svelte';
3</script>
4
5<Container
6 size="thin"
7 class="flex items-center justify-center rounded-2xl border border-dashed bg-background p-4"
8>
9 Content goes here...
10</Container>
11Installation
1. Install dependencies
2. Copy these files into your project
- ~/components/container/container.svelte
- ~/components/container/container.types.ts
- ~/components/container/container.variants.ts
Usage
Use the container to constrain page or section content. Set size to base, contained, thin,
or full.
1<script lang="ts">
2 import Container from '~/components/container/container.svelte';
3</script>
4
5<Container size="thin">
6 <p>Content goes here...</p>
7</Container>