rowt/rot_app/src/routes/+page.svelte

<script lang="ts">
  import { loggedin } from '../store.js';
  import welcome from '$lib/images/svelte-welcome.webp';
	import welcome_fallback from '$lib/images/svelte-welcome.png';
	import Login from './Login.svelte';

  let isLoggedIn: Boolean;

	loggedin.subscribe(value => {
		isLoggedIn = value;
	});

  function login() {
    loggedin.set(true);
  }

  function logout() {
    loggedin.set(false);
  }
</script>

<svelte:head>
	<title>Ruderassistent - ASKÖ Ruderverein Donau Linz</title>
</svelte:head>

<section>
	<h1>
		<span class="welcome">
			<picture>
				<source srcset={welcome} type="image/webp" />
				<img src={welcome_fallback} alt="Welcome" />
			</picture>
		</span>
	</h1>

  {#if isLoggedIn}
    <p>Here comes the list</p>
    <button on:click={logout} class="btn btn-primary">
      Jetzt ausloggen
    </button>
  {:else}
    <p>Login</p>
    <button on:click={login} class="btn btn-primary">
      Jetzt einloggen
    </button>
  {/if}
</section>