swaf/views/home.svelte

<script>
    import HomeDep from "./home_dep.svelte";
    import Layout from "./layout.svelte";

    export let swaf = {};

    let count = 5;

    function handleClick() {
        count++;
    }
    let depTest;
</script>

<style lang="scss">
	p:last-of-type {
		color: blueviolet;
	}

	.style-test {
		p {
			color: blue;
		}
	}
</style>

<Layout title="Home"/>

<h1>Hello {count}!</h1>

<button on:click={handleClick}>More hellos!!</button>

<p>Direct access: {swaf.direct}</p>

{#if swaf.route('auth') === '/'}
    We're home!
{:else}
    We're somewhere else... {swaf.route('auth')}
{/if}

<p>The route to auth is {swaf.route('auth')}</p>

<p>\swaf.notcode</p>

<p>{`{\\swaf.escaped}`}</p>

<div class="style-test">
    <p>Blue!</p>
</div>

<HomeDep swaf={swaf} bind:depTest={depTest}/>

<p>Dependency test: {depTest}</p>