diff options
Diffstat (limited to 'src/routes/index.svelte')
| -rw-r--r-- | src/routes/index.svelte | 59 |
1 files changed, 59 insertions, 0 deletions
diff --git a/src/routes/index.svelte b/src/routes/index.svelte new file mode 100644 index 0000000..68311dd --- /dev/null +++ b/src/routes/index.svelte @@ -0,0 +1,59 @@ +<script context="module" lang="ts"> + export const prerender = true; +</script> + +<script lang="ts"> + import Counter from '$lib/Counter.svelte'; +</script> + +<svelte:head> + <title>Home</title> +</svelte:head> + +<section> + <h1> + <div class="welcome"> + <picture> + <source srcset="svelte-welcome.webp" type="image/webp" /> + <img src="svelte-welcome.png" alt="Welcome" /> + </picture> + </div> + + to your new<br />SvelteKit app + </h1> + + <h2> + try editing <strong>src/routes/index.svelte</strong> + </h2> + + <Counter /> +</section> + +<style> + section { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + flex: 1; + } + + h1 { + width: 100%; + } + + .welcome { + position: relative; + width: 100%; + height: 0; + padding: 0 0 calc(100% * 495 / 2048) 0; + } + + .welcome img { + position: absolute; + width: 100%; + height: 100%; + top: 0; + display: block; + } +</style> |