<script lang="ts">
  import '../app.css';
  import favicon from '$lib/assets/favicon.svg';
  import { page } from '$app/state';

  let { children } = $props();
</script>

<svelte:head>
  <link rel="icon" href={favicon} />
</svelte:head>

<div id="app">
  <nav class="header">
    <h1 class="text-4xl">crunched</h1>
    <p>
      <a href="/home" data-sveltekit-preload-code="viewport">home</a> - {#if page.data.session}<a
          href="/vms"
          data-sveltekit-preload-code="viewport">vms</a
        >
        -
        <a
          href="/login/undo?next={encodeURIComponent(
            page.url.pathname + page.url.search
          )}">logout</a
        >{:else}<a
          href="/login?scope=default&next={encodeURIComponent(
            page.url.pathname + page.url.search
          )}">login</a
        >{/if}
    </p>
    <div class="my-2">
      <hr />
    </div>
  </nav>
  {@render children?.()}
</div>

<footer class="-mb-3 mt-3">
  <p class="text-xs">
    <span class="opacity-60 hover:opacity-100 transition-opacity">
      Copyright (c) 2025 Neobot Verein.
    </span><br />
    <span class="opacity-60 hover:opacity-100 transition-opacity">
      <a href="https://git.estrogen.zone/crunched.git/">Source Code</a>
      <small>AGPL3</small>
    </span>
    <span class="opacity-60"> - </span>
    <span class="opacity-60 hover:opacity-100 transition-opacity"
      ><a href="/aup">Acceptable Use Policy</a></span
    >
  </p>
</footer>
