diff options
Diffstat (limited to 'apps/kit/src/routes/book')
| -rw-r--r-- | apps/kit/src/routes/book/+layout.svelte | 6 | ||||
| -rw-r--r-- | apps/kit/src/routes/book/toggles/+page.svelte | 27 |
2 files changed, 33 insertions, 0 deletions
diff --git a/apps/kit/src/routes/book/+layout.svelte b/apps/kit/src/routes/book/+layout.svelte index fc55d9d..02d03b6 100644 --- a/apps/kit/src/routes/book/+layout.svelte +++ b/apps/kit/src/routes/book/+layout.svelte @@ -17,6 +17,12 @@ class:active={$page.url.pathname.startsWith("/book/buttons")} >Buttons</a > + <a + href="/book/toggles" + class="link" + class:active={$page.url.pathname.startsWith("/book/toggles")} + >Toggles</a + > </nav> <main> <slot /> diff --git a/apps/kit/src/routes/book/toggles/+page.svelte b/apps/kit/src/routes/book/toggles/+page.svelte new file mode 100644 index 0000000..94228b4 --- /dev/null +++ b/apps/kit/src/routes/book/toggles/+page.svelte @@ -0,0 +1,27 @@ +<script> + import Switch from "$lib/components/switch.svelte"; +</script> + +<section> + <h2>Default</h2> + <Switch /> +</section> +<section> + <h2>Short</h2> + <Switch type="short" /> +</section> +<section> + <h2>Icon</h2> + <Switch type="icon" /> +</section> +<section> + <h2>Label / Description</h2> + <div class="max-w-md"> + <Switch label="Label" description="Some text" /> + </div> +</section> + +<section> + <h2>Label / Description (right aligned)</h2> + <Switch label="Label" description="Some text" rightAlignedLabelDescription /> +</section>
\ No newline at end of file |