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

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

    	// you can change theme of your project from here.
	let theme = 'tabler';
	// let theme = 'daisyui';
</script>

<svelte:head>
	{#if theme === 'tabler'}
		<link rel="stylesheet" href={tabler} />
	{:else}
		<link rel="stylesheet" href={daisyui} />
	{/if}
</svelte:head>

<nav>
    <a href="/">Web Services</a>
    <a href="/about">About</a>
</nav>

<!-- 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>