wm-fontis/wm-fontis-tibi-2023
3
0
Fork 0
generated from cms/tibi-docs
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

next session

Browse Source
This commit is contained in:
Robin Grenzdörfer
2023-07-15 16:15:17 +00:00
parent d4e21505ad
commit c6d43a95fa
28 changed files with 988 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
frontend/src/lib/components/Menu/Header.svelte
View File

@@ -1,10 +1,12 @@
<script lang="ts">
import { navigate } from "svelte-routing/src/history"
export let active = false
export let opened = false
</script>
<div class="header" class:fixed="{!opened}">
<div class="logo">
<div class="header" class:sticky="{!opened}">
<div class="logo" on:keydown on:click="{() => navigate('/')}">
<img src="/media/Logo Quer.svg" alt="Logo Quer" />
</div>
<button class="menu" on:click="{() => (active = !active)}">
@@ -19,8 +21,8 @@
<style lang="less">
@import "../../assets/css/main.less";
.fixed {
position: fixed;
.sticky {
position: sticky;
top: 0px;
z-index: 100;
}
@@ -37,6 +39,7 @@
gap: 25px;
.logo {
cursor: pointer;
flex-grow: 0;
flex-shrink: 1;

45
frontend/src/lib/components/Menu/Menu.svelte
View File

@@ -1,5 +1,8 @@
<script lang="ts">
import { navigate } from "svelte-routing/src/history"
import { navigation, pages } from "../../store"
import Header from "./Header.svelte"
$: console.log($navigation, "nav")
export let active = false
</script>
@@ -7,27 +10,35 @@
<div class="menu-container">
<Header bind:active="{active}" opened="{true}" />
<div class="menu-content">
<div class="container">
<div class="inner-container">
<div class="pages">
{#each ["Ihre Bedürfnisse", "Unsere Lösungen", "Über uns", "Kontakt"] as page}
<button class="page">
{page}
</button>
{/each}
</div>
<div class="footer-infos">
<div class="upper">
<button>Datenschutz</button>
<button>Impressum</button>
{#if $navigation}
<div class="container">
<div class="inner-container">
<div class="pages">
{#each $navigation.pages as page}
<button
class="page"
on:click="{() => {
active = false
navigate(Object.values($pages)?.find((o) => o.id == page.page)?.path || '/')
}}"
>
{page.name}
</button>
{/each}
</div>
<div class="lower">
<button>0711 644 700-0</button>
<button>info@fontis.de</button>
<div class="footer-infos">
<div class="upper">
<button>Datenschutz</button>
<button>Impressum</button>
</div>
<div class="lower">
<button>0711 644 700-0</button>
<button>info@fontis.de</button>
</div>
</div>
</div>
</div>
</div>
{/if}
</div>
</div>
</div>