Shallie/src/routes/+layout.svelte

70 lines
1.8 KiB
Svelte

<script lang="ts">
import { navigating } from '$app/stores';
import { goto } from '$app/navigation';
import { browseSettings } from '$lib/content/contentApi';
import Base from '@damillora/plachta/components/Base/Base.svelte';
import Footer from '@damillora/plachta/components/Footer/Footer.svelte';
import Header from '@damillora/plachta/components/Header/Header.svelte';
import NavDarkMode from '@damillora/plachta/components/Nav/NavDarkMode.svelte';
import NavMenu from '@damillora/plachta/components/Nav/NavMenu.svelte';
import NavSearch from '@damillora/plachta/components/Nav/NavSearch.svelte';
import NavigationLoading from '@damillora/plachta/components/NavigationLoading/NavigationLoading.svelte';
import type { Load } from '@sveltejs/kit';
const doSearch = (e: any) => {
if (e.detail.query) {
goto('/search?q=' + e.detail.query, { replaceState: true, keepfocus: true });
} else {
goto('/', { replaceState: true, keepfocus: true });
}
};
export let data;
let loading = true;
navigating.subscribe((x) => (loading = x != null));
</script>
<svelte:head>
{@html data.header}
</svelte:head>
<Base>
<Header>
<svelte:fragment slot="title">
<a href="/"> <strong>Damillora</strong>'s Virtual Memoir </a>
</svelte:fragment>
<svelte:fragment slot="nav">
<NavMenu label="nanao.moe" url="https://nanao.moe" />
<NavDarkMode />
<NavSearch on:search={doSearch} />
</svelte:fragment>
</Header>
<slot />
{@html data.footer}
<Footer>
<p>Copyright (c) 2023 Damillora</p>
</Footer>
</Base>
<NavigationLoading {loading} />
<style lang="scss">
// Responsive embeds
:global(.fluid-width-video-wrapper) {
width: 100%;
position: relative;
padding: 0;
:global(iframe),
:global(object),
:global(embed) {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
}
</style>