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

icon cycle circle

Browse Source
This commit is contained in:
Robin Grenzdörfer
2023-07-16 06:21:49 +00:00
parent c6d43a95fa
commit bfa53f6b95
15 changed files with 423 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,6 +1,6 @@
<script lang="ts">
import { navigate } from "svelte-routing/src/history"
import { navigation, pages } from "../../store"
import { navigation, pages, rerender } from "../../store"
import Header from "./Header.svelte"
$: console.log($navigation, "nav")
export let active = false
@@ -16,9 +16,10 @@
<div class="pages">
{#each $navigation.pages as page}
<button
class="page"
class="page underline"
on:click="{() => {
active = false
$rerender = $rerender + 1
navigate(Object.values($pages)?.find((o) => o.id == page.page)?.path || '/')
}}"
>
@@ -28,11 +29,11 @@
</div>
<div class="footer-infos">
<div class="upper">
<button>Datenschutz</button>
<button>Impressum</button>
<button class="underline">Datenschutz</button>
<button class="underline">Impressum</button>
</div>
<div class="lower">
<button>0711 644 700-0</button>
<button>0711&nbsp;644&nbsp;700-0</button>
<button>info@fontis.de</button>
</div>
</div>
@@ -74,29 +75,60 @@
.container {
display: flex;
flex-direction: column;
justify-content: flex-end;
justify-content: flex-start;
align-items: flex-end;
width: 80%;
margin: 10vw 0px;
@media @tablet {
justify-content: flex-end;
}
.inner-container {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
height: 100%;
justify-content: space-between;
@media @tablet {
justify-content: initial;
height: initial;
}
.footer-infos {
width: 100%;
display: flex;
flex-direction: column;
flex-wrap: wrap;
@media @tablet {
flex-wrap: initial;
flex-direction: column;
height: 100%;
}
justify-content: space-between;
text-align: start;
.upper {
display: flex;
flex-direction: column;
align-items: flex-end;
align-items: flex-start;
gap: 15px;
margin-top: 15px;
@media @tablet {
margin-top: 0px;
align-items: flex-start;
}
@media @desktop {
align-items: flex-end;
}
}
.lower {
margin-top: 15px;
display: flex;
flex-direction: column;
align-items: flex-end;
align-items: flex-start;
@media @tablet {
align-items: flex-start;
}
@media @desktop {
flex-direction: row;
justify-content: flex-end;
@@ -104,7 +136,6 @@
gap: 20px;
}
button {
font-size: 1.6rem;
color: @font-color-secondary;
}
@media @desktop {
@@ -118,6 +149,7 @@
display: flex;
align-items: flex-start;
flex-direction: column;
font-family: "Libre Caslon Text", serif;
gap: 20px;
.page {
font-size: 1.6rem;