generated from cms/tibi-docs
next session
This commit is contained in:
parent
d4e21505ad
commit
c6d43a95fa
@ -35,7 +35,7 @@
|
||||
id: boxlist
|
||||
|
||||
- name: Ausfahrbare Box
|
||||
id: extendableBox
|
||||
id: extendableBoxes
|
||||
|
||||
- name: Text mit Link
|
||||
id: textLink
|
||||
@ -46,11 +46,11 @@
|
||||
- name: Seitenlinks
|
||||
id: pageLinkBlocks
|
||||
|
||||
- name: networkEvents
|
||||
- name: Netzwerk Veranstaltungen
|
||||
id: networkEvents
|
||||
|
||||
- name: publication
|
||||
id: publication
|
||||
- name: Veröffentlichungen
|
||||
id: publications
|
||||
|
||||
- name: networkEvents
|
||||
type: object[]
|
||||
@ -79,17 +79,18 @@
|
||||
meta:
|
||||
label: downloadDatei
|
||||
|
||||
- name: publication
|
||||
type: object
|
||||
- name: publications
|
||||
type: object[]
|
||||
meta:
|
||||
label: Publikationen
|
||||
dependsOn:
|
||||
eval: $parent.contentType == 'publication'
|
||||
eval: $parent.contentType == 'publications'
|
||||
subFields:
|
||||
- name: content
|
||||
type: string
|
||||
meta:
|
||||
label: Inhalt
|
||||
widget: richtext
|
||||
|
||||
- name: file
|
||||
type: file
|
||||
@ -262,7 +263,7 @@
|
||||
meta:
|
||||
label: Beschreibung
|
||||
- name: personPreview
|
||||
type: object
|
||||
type: object[]
|
||||
meta:
|
||||
label: Personenvorschau
|
||||
dependsOn:
|
||||
@ -284,6 +285,22 @@
|
||||
meta:
|
||||
label: Name
|
||||
|
||||
- name: link
|
||||
type: string
|
||||
meta:
|
||||
label:
|
||||
de: Seite
|
||||
en: page
|
||||
widget: select
|
||||
choices:
|
||||
endpoint: page
|
||||
params:
|
||||
sort: path
|
||||
projection: navigation
|
||||
mapping:
|
||||
id: id
|
||||
name: path
|
||||
|
||||
- name: boxList
|
||||
type: object
|
||||
meta:
|
||||
@ -301,12 +318,12 @@
|
||||
meta:
|
||||
label: Name
|
||||
|
||||
- name: extendableBox
|
||||
type: object
|
||||
- name: extendableBoxes
|
||||
type: object[]
|
||||
meta:
|
||||
label: Ausklappbare Box
|
||||
dependsOn:
|
||||
eval: $parent.contentType == 'extendableBox'
|
||||
eval: $parent.contentType == 'extendableBoxes'
|
||||
subFields:
|
||||
- name: title
|
||||
type: string
|
||||
@ -318,6 +335,17 @@
|
||||
meta:
|
||||
widget: richtext
|
||||
label: Text
|
||||
- name: emailButton
|
||||
type: boolean
|
||||
meta:
|
||||
label: E-Mail Button Anzeigen
|
||||
|
||||
- name: emailSubject
|
||||
type: string
|
||||
meta:
|
||||
label: E-Mail default Betreff
|
||||
dependsOn:
|
||||
eval: $parent.emailButton == true
|
||||
|
||||
- name: textLink
|
||||
type: object
|
||||
|
||||
3
frontend/media/arrow-l.svg
Normal file
3
frontend/media/arrow-l.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M44 24c0 .69-.56 1.25-1.25 1.25H10.304l12.822 12.609a1.251 1.251 0 1 1-1.752 1.782L6.386 24.903a1.245 1.245 0 0 1-.379-1.035c.032-.3.171-.58.393-.785L21.374 8.359a1.25 1.25 0 1 1 1.752 1.782L10.304 22.75H42.75c.69 0 1.25.56 1.25 1.25z" fill="#333"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 366 B |
3
frontend/media/arrow-r.svg
Normal file
3
frontend/media/arrow-r.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M15.268 4.21a.75.75 0 0 0-1.04 1.08l8.275 7.96H3.75a.75.75 0 1 0 0 1.5h18.752l-8.273 7.96a.75.75 0 0 0 1.04 1.08l9.428-9.07a1 1 0 0 0 0-1.44l-9.428-9.07h-.001z" fill="#000"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 291 B |
3
frontend/media/calendar.svg
Normal file
3
frontend/media/calendar.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M45.5 7.875h-6.125V5.25a.875.875 0 0 0-1.75 0v2.625h-19.25V5.25a.875.875 0 0 0-1.75 0v2.625H10.5A2.625 2.625 0 0 0 7.875 10.5v35a2.625 2.625 0 0 0 2.625 2.625h35a2.625 2.625 0 0 0 2.625-2.625v-35A2.625 2.625 0 0 0 45.5 7.875zm-35 1.75h6.125v2.625a.875.875 0 1 0 1.75 0V9.625h19.25v2.625a.875.875 0 1 0 1.75 0V9.625H45.5a.875.875 0 0 1 .875.875v7.875H9.625V10.5a.875.875 0 0 1 .875-.875zm35 36.75h-35a.875.875 0 0 1-.875-.875V20.125h36.75V45.5a.875.875 0 0 1-.875.875z" fill="#000"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 599 B |
10
frontend/media/down.svg
Normal file
10
frontend/media/down.svg
Normal file
@ -0,0 +1,10 @@
|
||||
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#kvekca80oa)">
|
||||
<path d="m30.797 7.297 1.406 1.406L16.5 24.406.797 8.703l1.406-1.406L16.5 21.594 30.797 7.297z" fill="#000"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="kvekca80oa">
|
||||
<path fill="#fff" transform="translate(.5)" d="M0 0h32v32H0z"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 421 B |
4
frontend/media/file.svg
Normal file
4
frontend/media/file.svg
Normal file
@ -0,0 +1,4 @@
|
||||
<svg width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M10.208 47.65a.875.875 0 0 0 .875-.874V11.958a.875.875 0 0 1 .875-.875h20.125v11.375a.875.875 0 0 0 .875.875h11.375v23.334a.875.875 0 0 0 1.75 0V22.458a.875.875 0 0 0-.256-.619L33.577 9.59a.875.875 0 0 0-.619-.256h-21a2.625 2.625 0 0 0-2.625 2.625v34.818c0 .232.256.618.256.618s.387.257.619.257zm23.625-35.33 9.262 9.263h-9.262V12.32z" fill="#000"/>
|
||||
<path d="M10.102 48.523a2.625 2.625 0 0 1-.769-1.856h1.75a.875.875 0 0 0 .875.875h31.5a.875.875 0 0 0 .875-.875h1.75a2.625 2.625 0 0 1-2.625 2.625h-31.5a2.625 2.625 0 0 1-1.856-.77z" fill="#000"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 667 B |
10
frontend/media/up.svg
Normal file
10
frontend/media/up.svg
Normal file
@ -0,0 +1,10 @@
|
||||
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#3k3057tu3a)">
|
||||
<path d="M31.047 23.953 16.5 9.422 1.953 23.953.547 22.547 16.5 6.578l15.953 15.969-1.406 1.406z" fill="#000"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="3k3057tu3a">
|
||||
<path fill="#fff" transform="translate(.5)" d="M0 0h32v32H0z"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 423 B |
@ -4,7 +4,7 @@
|
||||
import Menu from "./lib/components/Menu/Menu.svelte"
|
||||
import NotFound from "./lib/components/NotFound.svelte"
|
||||
import Rows from "./lib/components/Pagebuilder/Rows.svelte"
|
||||
import { location, navigation, pages, serviceNavigation } from "./lib/store"
|
||||
import { location, navigation, pages, serviceNavigation, rerender } from "./lib/store"
|
||||
import { Route, Router } from "svelte-routing"
|
||||
import { loadPages } from "./lib/functions/getPages"
|
||||
import { loadNavigation } from "./lib/functions/loadNavigation"
|
||||
@ -55,13 +55,16 @@
|
||||
|
||||
<main class="">
|
||||
<Header bind:active="{activeMenu}" />
|
||||
|
||||
<div class="content-container" id="siteContainer" data-url="{url}">
|
||||
<Router url="{url}">
|
||||
<Route path="/">
|
||||
<Rows path="/" homepage="{true}" />
|
||||
</Route>
|
||||
<Route path="/*path" let:params>
|
||||
<Rows path="/{params?.path}" homepage="{false}" />
|
||||
{#key $rerender}
|
||||
<Rows path="/{params?.path}" homepage="{false}" />
|
||||
{/key}
|
||||
</Route>
|
||||
<Route>
|
||||
<NotFound />
|
||||
@ -91,14 +94,17 @@
|
||||
transform: scale(0.5);
|
||||
transform-origin: bottom !important;
|
||||
}
|
||||
|
||||
.swiper-button-prev {
|
||||
right: 18%;
|
||||
left: initial !important;
|
||||
}
|
||||
|
||||
.swiper-button-next {
|
||||
right: 3%;
|
||||
transform-origin: right;
|
||||
}
|
||||
|
||||
@media @tablet {
|
||||
.swiper-button-prev,
|
||||
.swiper-button-next {
|
||||
@ -127,7 +133,6 @@
|
||||
}
|
||||
h1,
|
||||
h2 {
|
||||
|
||||
font-family: "Libre Caslon Text", serif;
|
||||
}
|
||||
|
||||
@ -135,7 +140,6 @@
|
||||
overflow: hidden !important;
|
||||
}
|
||||
main {
|
||||
overflow: hidden;
|
||||
min-height: 100vh;
|
||||
background-color: @bg-color;
|
||||
display: flex;
|
||||
@ -143,6 +147,14 @@
|
||||
justify-content: space-between;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
|
||||
.content-container {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
@media @mobile {
|
||||
font-size: @bodyfontsize;
|
||||
line-height: 1.4;
|
||||
|
||||
@ -21,6 +21,7 @@
|
||||
<style lang="less">
|
||||
@import "../assets/css/main.less";
|
||||
.footer {
|
||||
margin-top: 80px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
|
||||
@ -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;
|
||||
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -23,7 +23,6 @@
|
||||
}
|
||||
})
|
||||
|
||||
$: console.log(teasers, "teasers")
|
||||
let teaser = teasers[0]
|
||||
</script>
|
||||
|
||||
@ -41,7 +40,7 @@
|
||||
class="relative"
|
||||
>
|
||||
{#each teasers as teaser}
|
||||
{#if teaser.teaser.showTeaser}
|
||||
{#if teaser?.teaser?.showTeaser}
|
||||
<swiper-slide class="relative">
|
||||
<div class="inner-container">
|
||||
<div class="titles">
|
||||
@ -65,7 +64,7 @@
|
||||
@import "../../assets/css/main.less";
|
||||
|
||||
.container {
|
||||
padding: 150px 0px;
|
||||
padding: 20px 0px 150px 0px;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@ -1,18 +1,54 @@
|
||||
<script lang="ts">
|
||||
import { navigate } from "svelte-routing/src/history"
|
||||
import Boxlist from "../widgets/boxlist.svelte"
|
||||
import Events from "../widgets/events.svelte"
|
||||
import ExtendableBox from "../widgets/extendableBox.svelte"
|
||||
import IconBlock from "../widgets/iconBlock.svelte"
|
||||
import Image from "../widgets/image.svelte"
|
||||
import InfoBoard from "../widgets/infoBoard.svelte"
|
||||
import NestedCard from "../widgets/nestedCard.svelte"
|
||||
import PageLinkBlocks from "../widgets/pageLinkBlocks.svelte"
|
||||
import Persons from "../widgets/persons.svelte"
|
||||
import Publications from "../widgets/publications.svelte"
|
||||
import Text from "../widgets/text.svelte"
|
||||
import TextLink from "../widgets/textLink.svelte"
|
||||
import TopDown from "../widgets/topDown.svelte"
|
||||
import { rerender } from "../../store"
|
||||
|
||||
export let row: Row
|
||||
export let pageId: string
|
||||
console.log(row, "row")
|
||||
console.log(row.columns)
|
||||
export let bright: boolean
|
||||
|
||||
function checkNestedPath() {
|
||||
const pathSegments = location.pathname.split("/").filter((segment) => segment.length)
|
||||
|
||||
if (pathSegments.length > 1) {
|
||||
pathSegments.pop() // remove the last segment
|
||||
return "/" + pathSegments.join("/")
|
||||
}
|
||||
|
||||
return ""
|
||||
}
|
||||
|
||||
let nestedPath = checkNestedPath()
|
||||
</script>
|
||||
|
||||
{#if Object.keys(row).length}
|
||||
{#if row.topTitle}
|
||||
<h3>{row.topTitle}</h3>
|
||||
{/if}
|
||||
{#if nestedPath}
|
||||
<h3
|
||||
style="cursor: pointer;"
|
||||
on:keydown
|
||||
on:click="{() => {
|
||||
$rerender = $rerender + 1
|
||||
navigate(nestedPath)
|
||||
}}"
|
||||
>
|
||||
<img src="/media/arrow-l.svg" alt="arrow" /> Zurück zur Übersicht
|
||||
</h3>
|
||||
{/if}
|
||||
{#if row.pageTitle}
|
||||
<h1>{row.pageTitle}</h1>
|
||||
{/if}
|
||||
@ -28,9 +64,29 @@
|
||||
{#if col?.contentType == "text"}
|
||||
<Text text="{col?.text}" />
|
||||
{:else if col?.contentType == "textLink"}
|
||||
<TextLink description="{col?.textLink?.text}" path="{col?.textLink?.link}" />
|
||||
<TextLink description="{col?.textLink?.text}" path="{col?.textLink?.link}" bright="{bright}" />
|
||||
{:else if col.contentType == "image"}
|
||||
<Image image="{col?.image}" pageId="{pageId}" />
|
||||
{:else if col.contentType == "iconBlocks"}
|
||||
<IconBlock pageId="{pageId}" col="{col}" />
|
||||
{:else if col.contentType == "pageLinkBlocks"}
|
||||
<PageLinkBlocks col="{col}" />
|
||||
{:else if col.contentType == "networkEvents"}
|
||||
<Events col="{col}" pageId="{pageId}" />
|
||||
{:else if col.contentType == "publications"}
|
||||
<Publications col="{col}" pageId="{pageId}" />
|
||||
{:else if col.contentType == "topDown"}
|
||||
<TopDown col="{col}" />
|
||||
{:else if col.contentType == "infoBoard"}
|
||||
<InfoBoard col="{col}" pageId="{pageId}" />
|
||||
{:else if col.contentType == "nestedCard"}
|
||||
<NestedCard col="{col}" />
|
||||
{:else if col.contentType == "boxlist"}
|
||||
<Boxlist col="{col}" />
|
||||
{:else if col.contentType == "extendableBoxes"}
|
||||
<ExtendableBox col="{col}" />
|
||||
{:else if col.contentType == "personPreview"}
|
||||
<Persons col="{col}" pageId="{pageId}" />
|
||||
{/if}
|
||||
</div>
|
||||
{/each}
|
||||
@ -39,24 +95,45 @@
|
||||
|
||||
<style lang="less">
|
||||
@import "../../assets/css/main.less";
|
||||
h3 {
|
||||
font-size: 1.2rem;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
h2 {
|
||||
font-size: 3.2rem;
|
||||
}
|
||||
h1 {
|
||||
font-size: 5rem;
|
||||
@media @tablet {
|
||||
h3 {
|
||||
font-size: 1.2rem;
|
||||
padding-bottom: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
img {
|
||||
width: 40px;
|
||||
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
h2 {
|
||||
font-size: 3.2rem;
|
||||
}
|
||||
h1 {
|
||||
font-size: 5rem;
|
||||
}
|
||||
}
|
||||
h1,
|
||||
h2 {
|
||||
line-height: 1;
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
flex-wrap: wrap;
|
||||
@media (max-width: 640px) {
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
& > .col {
|
||||
min-width: 40% !important;
|
||||
|
||||
@media @desktop {
|
||||
min-width: 30% !important;
|
||||
}
|
||||
padding: 10px;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
|
||||
@ -2,10 +2,11 @@
|
||||
import { pages } from "../../store"
|
||||
import Homepage from "./Homepage.svelte"
|
||||
import Pagebuilder from "./Pagebuilder.svelte"
|
||||
import { apiBaseURL } from "../../../config"
|
||||
|
||||
export let path
|
||||
export let homepage = false
|
||||
|
||||
export let image: FileField
|
||||
let page: Page
|
||||
function initPage() {
|
||||
page = $pages[path]
|
||||
@ -23,7 +24,14 @@
|
||||
{#if path == "/"}<Homepage />{/if}
|
||||
{#each page.rows as row}
|
||||
<div class="row">
|
||||
<Pagebuilder row="{row.row}" pageId="{page.id}" />
|
||||
{#if row.row.backgroundImage}
|
||||
<div class="background-image">
|
||||
<img src="{`${apiBaseURL}page/${page.id}/${row.row.backgroundImage?.src}`}" alt="img" />
|
||||
</div>
|
||||
{/if}
|
||||
<div class="content" class:bright="{row.row.backgroundImage}">
|
||||
<Pagebuilder row="{row.row}" pageId="{page.id}" bright="{!!row.row.backgroundImage}" />
|
||||
</div>
|
||||
</div>
|
||||
{/each}
|
||||
{/if}
|
||||
@ -35,6 +43,45 @@
|
||||
.rows {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 80px;
|
||||
justify-content: flex-start;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
|
||||
overflow-x: hidden;
|
||||
gap: 10px;
|
||||
& > .row {
|
||||
padding: 10px;
|
||||
padding-top: 80px;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
.background-image {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
z-index: 1;
|
||||
top: 0px;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
img {
|
||||
object-fit: cover;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
& > .content {
|
||||
width: 100%;
|
||||
max-width: 1600px;
|
||||
padding: 0px 2.5vw;
|
||||
position: relative;
|
||||
&.bright {
|
||||
color: @font-color-secondary !important;
|
||||
}
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
27
frontend/src/lib/components/widgets/boxlist.svelte
Normal file
27
frontend/src/lib/components/widgets/boxlist.svelte
Normal file
@ -0,0 +1,27 @@
|
||||
<script lang="ts">
|
||||
export let col: Column
|
||||
</script>
|
||||
|
||||
<div class="boxList">
|
||||
{#each col.boxList.boxes as name}
|
||||
<div class="box">
|
||||
{name.name}
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
<style lang="less">
|
||||
@import "../../assets/css/main.less";
|
||||
|
||||
.boxList {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 20px;
|
||||
.box {
|
||||
padding: 5px 10px;
|
||||
background-color: @bg-color-secondary;
|
||||
color: @font-color-secondary;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
143
frontend/src/lib/components/widgets/events.svelte
Normal file
143
frontend/src/lib/components/widgets/events.svelte
Normal file
@ -0,0 +1,143 @@
|
||||
<script lang="ts">
|
||||
import { apiBaseURL } from "../../../config"
|
||||
|
||||
export let col: Column
|
||||
export let pageId: string
|
||||
|
||||
let months = [
|
||||
"Januar",
|
||||
"Februar",
|
||||
"März",
|
||||
"April",
|
||||
"Mai",
|
||||
"Juni",
|
||||
"Juli",
|
||||
"August",
|
||||
"September",
|
||||
"Oktober",
|
||||
"November",
|
||||
"Dezember",
|
||||
]
|
||||
|
||||
let displayedItems = 4
|
||||
const itemsPerPage = 4
|
||||
|
||||
function showMore() {
|
||||
displayedItems += itemsPerPage
|
||||
}
|
||||
|
||||
console.log("col:", col)
|
||||
</script>
|
||||
|
||||
<div class="events">
|
||||
{#each col.networkEvents.slice(0, displayedItems) as nE}
|
||||
<div class="event">
|
||||
<div class="calendar">
|
||||
<div class="calendar-icon"><img src="/media/calendar.svg" alt="calendar" /></div>
|
||||
<div class="date">
|
||||
<div class="month">{months[new Date(nE.beginDate).getMonth()]}</div>
|
||||
<div class="day">
|
||||
{new Date(nE.beginDate).getDate()}
|
||||
{#if nE.endDate}
|
||||
- {new Date(nE.endDate).getDate()}
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="details">
|
||||
<em>{nE.title}</em>
|
||||
<a href="{apiBaseURL}page/{pageId}/{nE.file.src}" download="{apiBaseURL}page/{pageId}/{nE.file.src}">
|
||||
<button class="more">mehr</button></a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
{/each}
|
||||
{#if displayedItems < col.networkEvents.length}
|
||||
<button on:click="{showMore}">Weitere Events</button>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<style lang="less">
|
||||
@import "../../assets/css/main.less";
|
||||
|
||||
.events {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
button {
|
||||
padding: 2px 15px;
|
||||
border: 2px solid @bg-color-secondary;
|
||||
margin-top: 40px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.event {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
.details {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
padding: 24px 20px;
|
||||
gap: 10px;
|
||||
@media @tablet {
|
||||
padding: 0px 0px 0px 20px;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
em {
|
||||
font-weight: bold;
|
||||
}
|
||||
.more {
|
||||
background-color: @bg-color-secondary;
|
||||
color: @font-color-secondary;
|
||||
border: none;
|
||||
height: 36px;
|
||||
padding: 2px 15px;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.calendar {
|
||||
width: 110px;
|
||||
min-width: 110px;
|
||||
display: flex;
|
||||
border-right: @bg-color-secondary 2px solid;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
@media @tablet {
|
||||
flex: 1;
|
||||
gap: 10px;
|
||||
padding: 32px 35px 0px 0px;
|
||||
max-width: 210px;
|
||||
flex-direction: row;
|
||||
}
|
||||
.calendar-icon {
|
||||
width: 56px;
|
||||
height: 56px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
}
|
||||
.date {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
width: fit-content;
|
||||
.month {
|
||||
font-size: 0.7rem;
|
||||
}
|
||||
.day {
|
||||
font-size: 1.2rem;
|
||||
font-family: "Libre Caslon Text", serif;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
81
frontend/src/lib/components/widgets/extendableBox.svelte
Normal file
81
frontend/src/lib/components/widgets/extendableBox.svelte
Normal file
@ -0,0 +1,81 @@
|
||||
<script lang="ts">
|
||||
export let col: Column
|
||||
export let opened = -1
|
||||
</script>
|
||||
|
||||
<div class="boxes">
|
||||
{#each col.extendableBoxes as box, i}
|
||||
<div class="box" class:opened="{i == opened}">
|
||||
<div
|
||||
class="upper"
|
||||
on:keydown
|
||||
on:click="{() => {
|
||||
if (opened == i) opened = -1
|
||||
else opened = i
|
||||
}}"
|
||||
>
|
||||
<h4>
|
||||
{box.title}
|
||||
</h4>
|
||||
<div>
|
||||
{#if i !== opened}<img src="/media/down.svg" alt="arrow" />{:else}<img
|
||||
src="/media/up.svg"
|
||||
alt="arrow"
|
||||
/>{/if}
|
||||
</div>
|
||||
</div>
|
||||
<div class="content" class:closed="{i !== opened}">
|
||||
{@html box.text}
|
||||
{#if box.emailButton}
|
||||
<a href="mailto:info@fontis.de?subject={box.emailSubject || 'Bewerbung'}" class="button">
|
||||
<button> bewerben </button>
|
||||
</a>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
<style lang="less">
|
||||
@import "../../assets/css/main.less";
|
||||
button {
|
||||
margin-top: 20px;
|
||||
background-color: @bg-color-secondary;
|
||||
color: @font-color-secondary;
|
||||
border: 2px solid @bg-color-secondary;
|
||||
padding: 2px 15px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.boxes {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.box {
|
||||
border-bottom: 2px dotted @bg-color-secondary;
|
||||
display: flex;
|
||||
transition: padding-bottom 1s;
|
||||
padding-bottom: 0px;
|
||||
flex-direction: column;
|
||||
padding-top: 20px;
|
||||
gap: 20px;
|
||||
&.opened {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
.upper {
|
||||
font-size: 1.6rem;
|
||||
font-weight: 500;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.content {
|
||||
max-height: 1000px;
|
||||
overflow: hidden;
|
||||
transition: max-height 1s ease-in-out;
|
||||
&.closed {
|
||||
max-height: 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
52
frontend/src/lib/components/widgets/iconBlock.svelte
Normal file
52
frontend/src/lib/components/widgets/iconBlock.svelte
Normal file
@ -0,0 +1,52 @@
|
||||
<script lang="ts">
|
||||
import { apiBaseURL } from "../../../config"
|
||||
|
||||
export let pageId: string
|
||||
export let col: Column
|
||||
</script>
|
||||
|
||||
<div class="iconBlock">
|
||||
{#each col.iconBlocks as icon}
|
||||
<div class="icon">
|
||||
<img src="{`${apiBaseURL}page/${pageId}/${icon.icon?.src}`}" alt="img" />
|
||||
<div class="text">
|
||||
<em>{icon.bigText}</em>
|
||||
<p>{icon.smallText}</p>
|
||||
</div>
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
<style lang="less">
|
||||
.iconBlock {
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
flex-wrap: wrap;
|
||||
.icon {
|
||||
margin: 30px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 140px;
|
||||
gap: 20px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
.text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
em {
|
||||
text-align: center;
|
||||
font-size: 2.2rem;
|
||||
font-family: "Libre Caslon Text", serif;
|
||||
}
|
||||
p {
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
57
frontend/src/lib/components/widgets/infoBoard.svelte
Normal file
57
frontend/src/lib/components/widgets/infoBoard.svelte
Normal file
@ -0,0 +1,57 @@
|
||||
<script lang="ts">
|
||||
import { apiBaseURL } from "../../../config"
|
||||
|
||||
export let col: Column
|
||||
export let pageId: string
|
||||
</script>
|
||||
|
||||
<div class="infoBoard">
|
||||
<div class="header">
|
||||
<div class="icon">
|
||||
<img src="{`${apiBaseURL}page/${pageId}/${col.infoBoard.icon?.src}`}" alt="img" />
|
||||
</div>
|
||||
<div class="title">
|
||||
{col.infoBoard.title}
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
{@html col.infoBoard.text}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style lang="less">
|
||||
@import "../../assets/css/main.less";
|
||||
.infoBoard {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 15px;
|
||||
gap: 40px;
|
||||
.header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 20px;
|
||||
.icon {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
}
|
||||
.title {
|
||||
font-size: 1.5rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
div {
|
||||
border-bottom: 1px solid @bg-color-secondary;
|
||||
width: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.content {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -2,9 +2,10 @@
|
||||
import { navigate } from "svelte-routing"
|
||||
|
||||
export let path: string
|
||||
export let bright
|
||||
</script>
|
||||
|
||||
<button class="more" on:click="{() => navigate(path)}"> mehr </button>
|
||||
<button class="more" class:bright="{bright}" on:click="{() => navigate(path)}">mehr</button>
|
||||
|
||||
<style lang="less">
|
||||
@import "../../assets/css/main.less";
|
||||
@ -16,6 +17,8 @@
|
||||
padding: 2px 15px;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
.bright {
|
||||
border: 2px solid @bg-color;
|
||||
}
|
||||
</style>
|
||||
|
||||
67
frontend/src/lib/components/widgets/nestedCard.svelte
Normal file
67
frontend/src/lib/components/widgets/nestedCard.svelte
Normal file
@ -0,0 +1,67 @@
|
||||
<script lang="ts">
|
||||
export let col: Column
|
||||
</script>
|
||||
|
||||
<div class="cards">
|
||||
{#each col.nestedCard as card}
|
||||
<div class="card">
|
||||
<div class="title">{card.title}</div>
|
||||
<div class="description">{@html card.description}</div>
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
<style lang="less">
|
||||
@import "../../assets/css/main.less";
|
||||
.cards {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
flex-wrap: wrap;
|
||||
|
||||
gap: 40px;
|
||||
@media @desktop {
|
||||
gap: 50px;
|
||||
flex-direction: row;
|
||||
.card {
|
||||
min-width: 35%;
|
||||
max-width: 50%;
|
||||
margin-bottom: 50px !important;
|
||||
padding: 64px 0px 0px 80px !important;
|
||||
.title {
|
||||
padding: 13px 20px !important;
|
||||
}
|
||||
.description {
|
||||
padding: 10px 20px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.card {
|
||||
overflow: hidden;
|
||||
flex: 1;
|
||||
margin-bottom: 40px;
|
||||
position: relative;
|
||||
padding: 54px 0px 0px 70px;
|
||||
|
||||
.title {
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
padding: 7px 10px;
|
||||
color: @font-color-secondary;
|
||||
font-family: "LibreCaslonText";
|
||||
font-size: 1.2rem;
|
||||
top: 0px;
|
||||
height: 100px;
|
||||
width: 320px;
|
||||
z-index: 9;
|
||||
background-color: @bg-color-secondary;
|
||||
}
|
||||
.description {
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
padding: 5px 10px;
|
||||
background-color: @bg-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
60
frontend/src/lib/components/widgets/pageLinkBlocks.svelte
Normal file
60
frontend/src/lib/components/widgets/pageLinkBlocks.svelte
Normal file
@ -0,0 +1,60 @@
|
||||
<script lang="ts">
|
||||
import { navigate } from "svelte-routing/src/history"
|
||||
import { pages } from "../../store"
|
||||
export let col: Column
|
||||
</script>
|
||||
|
||||
<div class="link-container">
|
||||
{#each col.pageLinkBlocks as link}
|
||||
{#if isNaN(link.rowNr)}
|
||||
<button
|
||||
class="page-ref"
|
||||
on:click="{() => navigate(Object.values($pages)?.find((o) => o.id == link.page)?.path || '/')}"
|
||||
>
|
||||
{link.name}
|
||||
</button>
|
||||
{:else}
|
||||
<button
|
||||
class="row-ref"
|
||||
on:click="{() => navigate(Object.values($pages)?.find((o) => o.id == link.page)?.path || '/')}"
|
||||
>
|
||||
{link.name} <img src="/media/arrow-r.svg" alt="arrow" />
|
||||
</button>
|
||||
{/if}
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
<style lang="less">
|
||||
@import "../../assets/css/main.less";
|
||||
.link-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 20px;
|
||||
button {
|
||||
background-color: @bg-color;
|
||||
color: @font-color;
|
||||
padding: 2px 15px;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.row-ref {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
border: 2px solid @bg-color-secondary;
|
||||
img {
|
||||
width: 20px;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.page-ref {
|
||||
background-color: @bg-color-secondary;
|
||||
color: @font-color-secondary;
|
||||
border: 2px solid @bg-color-secondary;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
64
frontend/src/lib/components/widgets/persons.svelte
Normal file
64
frontend/src/lib/components/widgets/persons.svelte
Normal file
@ -0,0 +1,64 @@
|
||||
<script lang="ts">
|
||||
import { apiBaseURL } from "../../../config"
|
||||
import { pages, rerender } from "../../store"
|
||||
import { navigate } from "svelte-routing/src/history"
|
||||
export let pageId: string
|
||||
export let col: Column
|
||||
let hover = -1
|
||||
</script>
|
||||
|
||||
<div class="persons">
|
||||
{#each col.personPreview as pp, i}
|
||||
<button
|
||||
class="person"
|
||||
on:click="{() => {
|
||||
$rerender = $rerender + 1
|
||||
navigate(Object.values($pages)?.find((o) => o.id == pp.link)?.path || '/')
|
||||
}}"
|
||||
>
|
||||
<div class="image" on:mouseover="{() => (hover = i)}" on:focus on:blur on:mouseout="{() => (hover = -1)}">
|
||||
{#if hover == i}
|
||||
<img src="{`${apiBaseURL}page/${pageId}/${pp.hoverImage?.src}`}" alt="img" />
|
||||
{:else}
|
||||
<img src="{`${apiBaseURL}page/${pageId}/${pp.initialImage?.src}`}" alt="img" />
|
||||
{/if}
|
||||
</div>
|
||||
<div class="text">
|
||||
{pp.name}
|
||||
</div>
|
||||
</button>
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
<style lang="less">
|
||||
@import "../../assets/css/main.less";
|
||||
.persons {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
gap: 80px;
|
||||
.person {
|
||||
cursor: pointer;
|
||||
margin: 40px 0px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.image {
|
||||
width: 290px;
|
||||
height: 368px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
}
|
||||
.text {
|
||||
width: 100%;
|
||||
background-color: @bg-color-secondary;
|
||||
color: @font-color-secondary;
|
||||
border: 2px solid @bg-color-secondary;
|
||||
padding: 2px 15px;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
77
frontend/src/lib/components/widgets/publications.svelte
Normal file
77
frontend/src/lib/components/widgets/publications.svelte
Normal file
@ -0,0 +1,77 @@
|
||||
<script lang="ts">
|
||||
import { apiBaseURL } from "../../../config"
|
||||
|
||||
export let col: Column
|
||||
export let pageId: string
|
||||
|
||||
let displayedItems = 3
|
||||
const itemsPerPage = 3
|
||||
|
||||
function showMore() {
|
||||
displayedItems += itemsPerPage
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="publications">
|
||||
{#each col.publications.slice(0, displayedItems) as publication}
|
||||
<div class="publication">
|
||||
<div class="left"><img src="/media/file.svg" alt="file" /></div>
|
||||
<div class="right">
|
||||
<div class="content">{@html publication.content}</div>
|
||||
<div class="download">
|
||||
<a
|
||||
href="{apiBaseURL}page/{pageId}/{publication.file.src}"
|
||||
download="{apiBaseURL}page/{pageId}/{publication.file.src}"
|
||||
>
|
||||
<button class="download-button">zur Publikation</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
{#if displayedItems < col.publications.length}
|
||||
<button on:click="{showMore}">Weitere Publikationen</button>
|
||||
{/if}
|
||||
|
||||
<style lang="less">
|
||||
@import "../../assets/css/main.less";
|
||||
|
||||
button {
|
||||
padding: 2px 15px;
|
||||
border: 2px solid @bg-color-secondary;
|
||||
margin-top: 40px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.publications {
|
||||
gap: 60px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@media @tablet {
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.publication {
|
||||
max-width: 370px;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
.left {
|
||||
max-width: 75px;
|
||||
flex: 1;
|
||||
}
|
||||
.right {
|
||||
padding-left: 20px;
|
||||
border-left: 2px solid @bg-color-secondary;
|
||||
flex: 1;
|
||||
button {
|
||||
background-color: @bg-color-secondary;
|
||||
color: @font-color-secondary;
|
||||
border: 2px solid @bg-color-secondary;
|
||||
padding: 2px 15px;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -3,11 +3,12 @@
|
||||
import Text from "../widgets/text.svelte"
|
||||
export let description = ""
|
||||
export let path = ""
|
||||
export let bright = false
|
||||
</script>
|
||||
|
||||
<div class="textLink">
|
||||
<Text text="{description}" />
|
||||
<MoreBtn path="{path}" />
|
||||
<MoreBtn path="{path}" bright="{bright}" />
|
||||
</div>
|
||||
|
||||
<style lang="less">
|
||||
|
||||
66
frontend/src/lib/components/widgets/topDown.svelte
Normal file
66
frontend/src/lib/components/widgets/topDown.svelte
Normal file
@ -0,0 +1,66 @@
|
||||
<script lang="ts">
|
||||
export let col: Column
|
||||
</script>
|
||||
|
||||
<div class="topDown">
|
||||
{#each col.topDown.rows as row}
|
||||
<div class="row">
|
||||
<div class="capital">{row.inital}</div>
|
||||
<div class="details">
|
||||
<div class="upper">{row.rest}</div>
|
||||
<div class="lower">{row.description}</div>
|
||||
</div>
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
<style lang="less">
|
||||
@import "../../assets/css/main.less";
|
||||
.topDown {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
gap: 20px;
|
||||
.row {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
.capital {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
min-width: 60px;
|
||||
min-height: 100px;
|
||||
padding: 10px;
|
||||
background-color: @bg-color-secondary;
|
||||
color: @font-color-secondary;
|
||||
font-family: "LibreCaslonText";
|
||||
font-size: 1.7rem;
|
||||
@media @desktop {
|
||||
font-size: 2.3rem;
|
||||
min-width: 80px;
|
||||
height: 120px;
|
||||
}
|
||||
}
|
||||
.details {
|
||||
min-height: 100px;
|
||||
padding-top: 35px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.upper {
|
||||
line-height: 1;
|
||||
font-family: "LibreCaslonText";
|
||||
font-size: 1.7rem;
|
||||
}
|
||||
.lower {
|
||||
}
|
||||
@media @desktop {
|
||||
height: 120px;
|
||||
padding-top: 40px;
|
||||
.upper {
|
||||
font-size: 2.3rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -13,3 +13,4 @@ export const location = writable(initLoc)
|
||||
export let navigation = writable<Navigation>()
|
||||
export let pages = writable<Pages>({})
|
||||
export let serviceNavigation = writable<Navigation>()
|
||||
export let rerender = writable(0)
|
||||
|
||||
36
types/global.d.ts
vendored
36
types/global.d.ts
vendored
@ -12,7 +12,7 @@ interface Page {
|
||||
path: string
|
||||
teaser: teaserHomepage
|
||||
sectionHomepage: Row
|
||||
rows: Row[]
|
||||
rows: outerRow[]
|
||||
id: string
|
||||
}
|
||||
|
||||
@ -22,7 +22,9 @@ interface teaserHomepage {
|
||||
teaserTitle: string
|
||||
teaserDescription: string
|
||||
}
|
||||
|
||||
interface outerRow {
|
||||
row: Row
|
||||
}
|
||||
interface Row {
|
||||
topTitle: string
|
||||
subTitle: string
|
||||
@ -43,12 +45,13 @@ interface Column {
|
||||
| "nestedCard"
|
||||
| "topDown"
|
||||
| "personPreview"
|
||||
| "boxList"
|
||||
| "extendableBox"
|
||||
| "boxlist"
|
||||
| "extendableBoxes"
|
||||
| "textLink"
|
||||
| "iconBlock"
|
||||
| "iconBlocks"
|
||||
| "pageLinkBlocks"
|
||||
| "publication"
|
||||
| "publications"
|
||||
| "networkEvents"
|
||||
|
||||
image?: FileField
|
||||
iconCycleSquare?: IconCycleSquare
|
||||
@ -57,15 +60,15 @@ interface Column {
|
||||
textLink: TextLink
|
||||
infoBoard: InfoBoard
|
||||
worldCard: WorldCard
|
||||
nestedCard: NestedCard
|
||||
nestedCard: NestedCard[]
|
||||
topDown: TopDown
|
||||
personPreview: PersonPreview
|
||||
personPreview: PersonPreview[]
|
||||
boxList: BoxList
|
||||
extendableBox: ExtendableBox
|
||||
extendableBoxes: ExtendableBox[]
|
||||
iconBlocks: iconBlock[]
|
||||
pageLinkBlocks: pageLinkBlock[]
|
||||
networkEvents: NetworkEvent[]
|
||||
publication: Publication
|
||||
publications: Publication[]
|
||||
}
|
||||
|
||||
interface Publication {
|
||||
@ -74,7 +77,7 @@ interface Publication {
|
||||
}
|
||||
|
||||
interface NetworkEvent {
|
||||
beginnDate: Date
|
||||
beginDate: Date
|
||||
endDate: Date
|
||||
title: string
|
||||
file: FileField
|
||||
@ -133,19 +136,20 @@ interface TopDown {
|
||||
}
|
||||
|
||||
interface TopDownRow {
|
||||
initial: string
|
||||
inital: string
|
||||
rest: string
|
||||
description: string
|
||||
}
|
||||
|
||||
interface PersonPreview {
|
||||
initalImage: FileField
|
||||
initialImage: FileField
|
||||
hoverImage: FileField
|
||||
name: string
|
||||
link: string
|
||||
}
|
||||
|
||||
interface BoxList {
|
||||
names: {
|
||||
boxes: {
|
||||
name: string
|
||||
}[]
|
||||
}
|
||||
@ -153,6 +157,8 @@ interface BoxList {
|
||||
interface ExtendableBox {
|
||||
title: string
|
||||
text: string
|
||||
emailButton: boolean
|
||||
emailSubject: string
|
||||
}
|
||||
|
||||
interface FileField {
|
||||
@ -168,7 +174,7 @@ interface TextLink {
|
||||
|
||||
interface Navigation {
|
||||
tree: number
|
||||
elemente: NavElement[]
|
||||
pages: NavElement[]
|
||||
}
|
||||
|
||||
interface NavElement {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user