webservices-app/src/routes/+layout.svelte

<script>
   	import tabler from 'yesvelte/css/tabler.min.css?url';

 	import { Navbar, NavbarItem } from 'yesvelte';

	let theme = 'tabler';

	import '../app.css';
</script>

<svelte:head>
	<link rel="stylesheet" href={tabler} />
</svelte:head>

<Navbar theme='light' style="margin-bottom: 2em;">
    <a href="/"><NavbarItem title="Web Services" /></a>
    <a href="/about"><NavbarItem title="About" /></a>
</Navbar>

<!-- content provided by the +page.svelte file in this directory - and sub-directories -->
<slot />

<footer>
    <div class="repo"><a href="https://forge.magnificent.nz/lightweight/webservices-app" title="Access the source code repository for this site">Code for this site</a></div>
    <div class="copyright">Copyleft 2024 by <a href="https://davelane.nz">Dave Lane</a></div>
    <div class="attribution"><a href="/attribution" title="All images used on this site are made available by their authors under a Creative Commons license">Attribution</a></div>
</footer>

<style>
    /* global styles are in ../app.css */
    nav { margin: auto; }
    nav a { margin-right: 20px; }
    nav a:hover {
        color: #000;
        text-decoration: underline;
    }
    footer {
        display: inline-grid;
        margin: 4em auto 0 auto;
        grid-template-columns: 2fr 3fr 1fr;
    }
    footer div {
        text-align: left;
        margin-left: 1em;
    }
</style>