28 lines
720 B
Svelte
28 lines
720 B
Svelte
<script>
|
|
import {fly} from "svelte/transition";
|
|
import {swipe} from "svelte-gestures";
|
|
import Button from './navbutton.svelte';
|
|
import { browser } from '$app/env';
|
|
export /**
|
|
* @type {any}
|
|
*/
|
|
let open;
|
|
$: if (browser) document.body.classList[open ? 'add' : 'remove']('overflow-hidden');
|
|
</script>
|
|
|
|
{#if open}
|
|
<div
|
|
on:click={() => {
|
|
open = !open;
|
|
}}
|
|
transition:fly={{x: -600}}
|
|
class="z-10 bg-gradient-to-tr dark:bg-gradient-to-tr absolute top-0 left-0 h-screen w-screen flex flex-col gap-4 text-center pt-16
|
|
{open ? "translate-x-0" : "-translate-x-full"}
|
|
"
|
|
>
|
|
<Button link="/" text="Home" />
|
|
<Button link="/about" text="About" />
|
|
<Button link="/galaxies" text="Galaxies" />
|
|
</div>
|
|
{/if}
|