TeaSanctuary/teasanctuary.ru
4
0
Fork 0
Code Issues 4 Pull requests Projects Releases Packages Wiki Activity Actions

Сделал панель навигации с ссылками-заглушками

Browse source
This commit is contained in:
Иван Кузьменко 2025-07-13 10:33:08 +03:00
parent 31d21b9c81
commit 00590e5823
3 changed files with 70 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

44
src/routes/+layout.svelte
View file

@ -1,20 +1,15 @@
<script lang="ts">
import '../app.css';
// import '../syntax-highlight.css'; // https://github.com/PrismJS/prism-themes
import { page } from '$app/state';
import { slide } from 'svelte/transition';
import { navigating } from '$app/state';
// import NavButton from '$lib/components/Nav-Button.svelte';
import Icon from '@iconify/svelte';
import NavBar from '$src/lib/components/NavBar.svelte';
const routes: App.Route[] = [
{ label: 'команда', icon: 'material-symbols:person', href: '/team' },
{ label: 'новости', icon: 'material-symbols:newspaper', href: '/blog' },
{ label: 'проекты', icon: 'material-symbols:work', href: '/projects' }
{ label: 'главная', icon: 'material-symbols:emoji-food-beverage', href: '/' },
{ label: 'команда', icon: 'material-symbols:groups', href: '/team' },
{ label: 'блог', icon: 'material-symbols:newspaper', href: '/blog' },
{ label: 'проекты', icon: 'material-symbols:work', href: '/projects' },
{ label: 'контакты', icon: 'material-symbols:chat', href: '/contact' }
];
let isMenuOpen = false;
$: if (navigating) isMenuOpen = false;
</script>
<svelte:head>
@ -25,16 +20,21 @@
<title>Tea Sanctuary</title>
</svelte:head>
<div class="relative flex flex-col min-h-lvh">
<slot />
</div>
<div class="flex h-screen w-screen flex-row portrait:flex-col-reverse">
<NavBar {routes} />
<div class="flex grow-1 flex-col overflow-auto">
<div class="relative grow-1">
<slot />
</div>
<footer class="bg-emerald-950">
<div
class="mx-auto w-full max-w-screen-xl justify-center px-2 py-6 text-center text-emerald-50 md:flex"
>
<p>
<span class="font-bold">&copy; 2025 Tea Sanctuary</span>
</p>
<footer class="bg-emerald-950">
<div
class="mx-auto w-full max-w-screen-xl justify-center px-2 py-6 text-center text-emerald-50 md:flex"
>
<p>
<span class="font-bold">&copy; 2025 Tea Sanctuary</span>
</p>
</div>
</footer>
</div>
</footer>
</div>

4
src/routes/+page.svelte
View file

@ -4,6 +4,10 @@
import { PUBLIC_TS_DISCORD } from '$env/static/public';
</script>
<svelte:head>
<title>Tea Sanctuary</title>
</svelte:head>
<section
class="flex shrink-0 flex-col items-center justify-center gap-5 overflow-hidden p-4 hero-background"
>