Starter Projekt angefangen, etwas aufzubohren und ein paar grundlegend benötigte Collections, Teheming-Styles und Komponenten hinzugefügt. (WIP)
This commit is contained in:
parent
f4b6bb17ca
commit
47fdee2396
Binary file not shown.
@ -1,364 +0,0 @@
|
|||||||
name: article
|
|
||||||
type: tabs
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Einstellungen zum Artikel
|
|
||||||
en: Article Setings
|
|
||||||
activeTab: 0
|
|
||||||
subFields:
|
|
||||||
- name: general
|
|
||||||
type: object
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Allgemein
|
|
||||||
en: General
|
|
||||||
css:
|
|
||||||
subFields:
|
|
||||||
- name: public
|
|
||||||
type: boolean
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Veröffentlicht
|
|
||||||
en: Public
|
|
||||||
helperText:
|
|
||||||
de: "Der Artikel wird auf der Seite angezeigt."
|
|
||||||
en: "This article is displayed on the page."
|
|
||||||
- name: publish_date
|
|
||||||
type: object
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Datum der Veröffentlichung
|
|
||||||
en: Release Date
|
|
||||||
css: "grid grid-50"
|
|
||||||
subFields:
|
|
||||||
- name: public_from
|
|
||||||
type: date
|
|
||||||
meta:
|
|
||||||
inputProps:
|
|
||||||
type: "datetime-local"
|
|
||||||
label:
|
|
||||||
de: Datum (ab)
|
|
||||||
en: Date (from)
|
|
||||||
- name: public_until
|
|
||||||
type: date
|
|
||||||
meta:
|
|
||||||
inputProps:
|
|
||||||
type: "datetime-local"
|
|
||||||
label:
|
|
||||||
de: Datum (bis)
|
|
||||||
en: Date (until)
|
|
||||||
- name: position
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
widget: select
|
|
||||||
label:
|
|
||||||
de: Position auf der Seite
|
|
||||||
en: Position on page
|
|
||||||
defaultValue: []
|
|
||||||
choices:
|
|
||||||
- { id: "content", name: "Inhaltsbereich" }
|
|
||||||
- { id: "sidebar", name: "Sidebar" }
|
|
||||||
- name: sort
|
|
||||||
type: number
|
|
||||||
meta:
|
|
||||||
inputProps:
|
|
||||||
type: number
|
|
||||||
placeholder: 0
|
|
||||||
label: { de: "Sortierung", en: "Sorting" }
|
|
||||||
helperText:
|
|
||||||
de: "1...5...10...100"
|
|
||||||
en: "1...5...10...100"
|
|
||||||
- name: content
|
|
||||||
type: object
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Inhalt
|
|
||||||
en: Content
|
|
||||||
css:
|
|
||||||
subFields:
|
|
||||||
- name: slug
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Permalink", en: "Permalink" }
|
|
||||||
- name: title
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Titel", en: "Title" }
|
|
||||||
- name: subtitle
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Untertitel", en: "Subtitle" }
|
|
||||||
- name: types
|
|
||||||
type: tabs
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Inhalt dieses Artikel
|
|
||||||
en: Article Content
|
|
||||||
activeTab: 0
|
|
||||||
subFields:
|
|
||||||
- name: teaser
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
widget: richtext
|
|
||||||
label: { de: "Teaser-Text des Artikel", en: "Article Teaser Text" }
|
|
||||||
- name: details
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
widget: richtext
|
|
||||||
label: { de: "Detail-Text des Artikel", en: "Article Detail Text" }
|
|
||||||
- name: contentMedia
|
|
||||||
type: object
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Medien
|
|
||||||
en: Media
|
|
||||||
css:
|
|
||||||
subFields:
|
|
||||||
- name: mediaFiles
|
|
||||||
type: object[]
|
|
||||||
meta:
|
|
||||||
label: { de: "Bilder", en: "Images" }
|
|
||||||
subFields:
|
|
||||||
- name: title
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Datei-Titel", en: "File Title" }
|
|
||||||
- name: alternateText
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Alternativer Text", en: "Alternate Text" }
|
|
||||||
- name: id
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Technischer Name / ID", en: "Technical name / ID" }
|
|
||||||
- name: file
|
|
||||||
type: file
|
|
||||||
meta:
|
|
||||||
label: { de: "Datei", en: "File" }
|
|
||||||
- name: caption
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Bildunterschrift", en: "Caption" }
|
|
||||||
- name: contentAttachments
|
|
||||||
type: object
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Anhänge / Downloads
|
|
||||||
en: Attachments / Downloads
|
|
||||||
css:
|
|
||||||
subFields:
|
|
||||||
- name: attachments
|
|
||||||
type: object[]
|
|
||||||
meta:
|
|
||||||
label: { de: "Anhänge", en: "Attachments" }
|
|
||||||
subFields:
|
|
||||||
- name: title
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Datei-Titel", en: "File Title" }
|
|
||||||
- name: id
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Technischer Name / ID", en: "Technical name / ID" }
|
|
||||||
- name: file
|
|
||||||
type: file
|
|
||||||
meta:
|
|
||||||
label: { de: "", en: "" }
|
|
||||||
- name: layout
|
|
||||||
type: tabs
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Layout
|
|
||||||
en: Layout
|
|
||||||
css:
|
|
||||||
subFields:
|
|
||||||
- name: variant
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
widget: select
|
|
||||||
label:
|
|
||||||
de: Erscheinungsbild
|
|
||||||
en: Appearance
|
|
||||||
defaultValue: ["_self"]
|
|
||||||
choices:
|
|
||||||
- {
|
|
||||||
id: "top",
|
|
||||||
name: { de: "Artikelbild oben (volle Breite)", en: "Article picture top (full width)" },
|
|
||||||
}
|
|
||||||
- {
|
|
||||||
id: "right",
|
|
||||||
name: { de: "Artikelbild rechts (volle Höhe)", en: "Article picture right (full height)" },
|
|
||||||
}
|
|
||||||
- {
|
|
||||||
id: "bottom",
|
|
||||||
name: { de: "Artikelbild unten (volle Breite)", en: "Article picture left (full width)" },
|
|
||||||
}
|
|
||||||
- {
|
|
||||||
id: "left",
|
|
||||||
name: { de: "Artikelbild links (volle Höhe)", en: "Article picture left (full height)" },
|
|
||||||
}
|
|
||||||
- {
|
|
||||||
id: "after-teaser",
|
|
||||||
name:
|
|
||||||
{
|
|
||||||
de: "Artikelbild unter Teaser (volle Breite)",
|
|
||||||
en: "Article picture under teaser (full width)",
|
|
||||||
},
|
|
||||||
}
|
|
||||||
- { id: "top-left", name: { de: "Artikelbild oben links", en: "Article picture above left" } }
|
|
||||||
- { id: "top-right", name: { de: "Artikelbild oben rechts", en: "Article picture above right" } }
|
|
||||||
- { id: "bottom-left", name: { de: "Artikelbild unten links", en: "Article picture below left" } }
|
|
||||||
- {
|
|
||||||
id: "bottom-right",
|
|
||||||
name: { de: "Artikelbild unten rechts", en: "Article picture below right" },
|
|
||||||
}
|
|
||||||
- name: margin
|
|
||||||
type: object
|
|
||||||
meta:
|
|
||||||
label: { de: "Abstand nach außen (Margin)", en: "Distance to the outside (Margin)" }
|
|
||||||
subFields:
|
|
||||||
- name: top
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
widget: select
|
|
||||||
label:
|
|
||||||
de: Oben
|
|
||||||
en: Top
|
|
||||||
choices:
|
|
||||||
- { id: "", name: "Kein Abstand" }
|
|
||||||
- { id: "mt-xs", name: "Sehr kleiner Abstand" }
|
|
||||||
- { id: "mt-sm", name: "Kleiner Abstand" }
|
|
||||||
- { id: "mt-md", name: "Normal" }
|
|
||||||
- { id: "mt-lg", name: "Großer Abstand" }
|
|
||||||
- { id: "mt-xl", name: "Sehr großer Abstand" }
|
|
||||||
- name: right
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
widget: select
|
|
||||||
label:
|
|
||||||
de: Rechts
|
|
||||||
en: Right
|
|
||||||
choices:
|
|
||||||
- { id: "", name: "Kein Abstand" }
|
|
||||||
- { id: "mr-xs", name: "Sehr kleiner Abstand" }
|
|
||||||
- { id: "mr-sm", name: "Kleiner Abstand" }
|
|
||||||
- { id: "mr-md", name: "Normal" }
|
|
||||||
- { id: "mr-lg", name: "Großer Abstand" }
|
|
||||||
- { id: "mr-xl", name: "Sehr großer Abstand" }
|
|
||||||
- name: bottom
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
widget: select
|
|
||||||
label:
|
|
||||||
de: Unten
|
|
||||||
en: Bottom
|
|
||||||
choices:
|
|
||||||
- { id: "", name: "Kein Abstand" }
|
|
||||||
- { id: "mb-xs", name: "Sehr kleiner Abstand" }
|
|
||||||
- { id: "mb-sm", name: "Kleiner Abstand" }
|
|
||||||
- { id: "mb-md", name: "Normal" }
|
|
||||||
- { id: "mb-lg", name: "Großer Abstand" }
|
|
||||||
- { id: "mb-xl", name: "Sehr großer Abstand" }
|
|
||||||
- name: left
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
widget: select
|
|
||||||
label:
|
|
||||||
de: Links
|
|
||||||
en: Left
|
|
||||||
choices:
|
|
||||||
- { id: "", name: "Kein Abstand" }
|
|
||||||
- { id: "ml-xs", name: "Sehr kleiner Abstand" }
|
|
||||||
- { id: "ml-sm", name: "Kleiner Abstand" }
|
|
||||||
- { id: "ml-md", name: "Normal" }
|
|
||||||
- { id: "ml-lg", name: "Großer Abstand" }
|
|
||||||
- { id: "ml-xl", name: "Sehr großer Abstand" }
|
|
||||||
- name: padding
|
|
||||||
type: object
|
|
||||||
meta:
|
|
||||||
label: { de: "Abstand nach innen (Padding)", en: "Distance inside (Padding)" }
|
|
||||||
subFields:
|
|
||||||
- name: top
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
widget: select
|
|
||||||
label:
|
|
||||||
de: Oben
|
|
||||||
en: Top
|
|
||||||
choices:
|
|
||||||
- { id: "", name: "Kein Abstand" }
|
|
||||||
- { id: "pt-xs", name: "Sehr kleiner Abstand" }
|
|
||||||
- { id: "pt-sm", name: "Kleiner Abstand" }
|
|
||||||
- { id: "pt-md", name: "Normal" }
|
|
||||||
- { id: "pt-lg", name: "Großer Abstand" }
|
|
||||||
- { id: "pt-xl", name: "Sehr großer Abstand" }
|
|
||||||
- name: right
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
widget: select
|
|
||||||
label:
|
|
||||||
de: Rechts
|
|
||||||
en: Right
|
|
||||||
choices:
|
|
||||||
- { id: "", name: "Kein Abstand" }
|
|
||||||
- { id: "pr-xs", name: "Sehr kleiner Abstand" }
|
|
||||||
- { id: "pr-sm", name: "Kleiner Abstand" }
|
|
||||||
- { id: "pr-md", name: "Normal" }
|
|
||||||
- { id: "pr-lg", name: "Großer Abstand" }
|
|
||||||
- { id: "pr-xl", name: "Sehr großer Abstand" }
|
|
||||||
- name: bottom
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
widget: select
|
|
||||||
label:
|
|
||||||
de: Unten
|
|
||||||
en: Bottom
|
|
||||||
choices:
|
|
||||||
- { id: "", name: "Kein Abstand" }
|
|
||||||
- { id: "pb-xs", name: "Sehr kleiner Abstand" }
|
|
||||||
- { id: "pb-sm", name: "Kleiner Abstand" }
|
|
||||||
- { id: "pb-md", name: "Normal" }
|
|
||||||
- { id: "pb-lg", name: "Großer Abstand" }
|
|
||||||
- { id: "pb-xl", name: "Sehr großer Abstand" }
|
|
||||||
- name: left
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
widget: select
|
|
||||||
label:
|
|
||||||
de: Links
|
|
||||||
en: Left
|
|
||||||
choices:
|
|
||||||
- { id: "", name: "Kein Abstand" }
|
|
||||||
- { id: "pl-xs", name: "Sehr kleiner Abstand" }
|
|
||||||
- { id: "pl-sm", name: "Kleiner Abstand" }
|
|
||||||
- { id: "pl-md", name: "Normal" }
|
|
||||||
- { id: "pl-lg", name: "Großer Abstand" }
|
|
||||||
- { id: "pl-xl", name: "Sehr großer Abstand" }
|
|
||||||
- name: link
|
|
||||||
type: object
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Verlinkung
|
|
||||||
en: Link
|
|
||||||
css:
|
|
||||||
subFields:
|
|
||||||
- name: url
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Ziel-URL", en: "Target URL" }
|
|
||||||
- name: text
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Link-Beschriftung", en: "Link-Text" }
|
|
||||||
- name: target
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
widget: select
|
|
||||||
label:
|
|
||||||
de: Zielfenster
|
|
||||||
en: Target
|
|
||||||
defaultValue: ["_self"]
|
|
||||||
choices:
|
|
||||||
- { id: "_self", name: "(Standardwert) gleicher Tab oder Seite" }
|
|
||||||
- { id: "_blank", name: "Neuer Tab oder Fenster" }
|
|
||||||
- { id: "_parent", name: "Elternfenster" }
|
|
||||||
@ -9,7 +9,7 @@ uploadPath: ../media/content
|
|||||||
# Metaangaben zur Kollektion welche in der Admin-UI verwendet werden können
|
# Metaangaben zur Kollektion welche in der Admin-UI verwendet werden können
|
||||||
meta:
|
meta:
|
||||||
# Navigationseintrag in der Admin-UI
|
# Navigationseintrag in der Admin-UI
|
||||||
label: { de: "Seiteninhalt", en: "Page Content" }
|
label: { de: "Seiten", en: "Pages" }
|
||||||
# Icon (Material UI) für den Navigationseintrag
|
# Icon (Material UI) für den Navigationseintrag
|
||||||
muiIcon: web
|
muiIcon: web
|
||||||
# Identifizierung eines Eintrags für z.B. Select-Boxen in der Admin-UI
|
# Identifizierung eines Eintrags für z.B. Select-Boxen in der Admin-UI
|
||||||
@ -24,11 +24,13 @@ meta:
|
|||||||
mediaQuery: "(max-width:599px)"
|
mediaQuery: "(max-width:599px)"
|
||||||
primaryText: path
|
primaryText: path
|
||||||
columns:
|
columns:
|
||||||
|
- name
|
||||||
- path
|
- path
|
||||||
# Desktop
|
# Desktop
|
||||||
- type: table
|
- type: table
|
||||||
mediaQuery: "(min-width:600px)"
|
mediaQuery: "(min-width:600px)"
|
||||||
columns:
|
columns:
|
||||||
|
- name
|
||||||
- path
|
- path
|
||||||
|
|
||||||
imageFilter:
|
imageFilter:
|
||||||
|
|||||||
75
api/collections/email.yml
Normal file
75
api/collections/email.yml
Normal file
@ -0,0 +1,75 @@
|
|||||||
|
########################################################################
|
||||||
|
# email
|
||||||
|
########################################################################
|
||||||
|
|
||||||
|
name: email
|
||||||
|
uploadPath: ../media/email
|
||||||
|
meta:
|
||||||
|
label: { de: "Kontaktformular", en: "Contact Form" }
|
||||||
|
muiIcon: email
|
||||||
|
rowIdentTpl: { twig: "{{ email }} - {{ subject }}" }
|
||||||
|
views:
|
||||||
|
- type: simpleList
|
||||||
|
mediaQuery: "(max-width: 600px)"
|
||||||
|
primaryText: email
|
||||||
|
secondaryText: subject
|
||||||
|
tertiaryText: insertTime
|
||||||
|
- type: table
|
||||||
|
columns:
|
||||||
|
- insertTime
|
||||||
|
- email
|
||||||
|
- subject
|
||||||
|
|
||||||
|
# Zugriff auf diese Kollektion
|
||||||
|
permissions:
|
||||||
|
# öffentlicher Zugriff
|
||||||
|
public:
|
||||||
|
methods:
|
||||||
|
# Liste und Einzeleinträge lesen
|
||||||
|
# checked via hook
|
||||||
|
get: false
|
||||||
|
# neuen Eintrag anlegen
|
||||||
|
post: true
|
||||||
|
# Eintrag editieren
|
||||||
|
put: false
|
||||||
|
# Eintrag löschen
|
||||||
|
delete: false
|
||||||
|
# zum Projekt zugeordneter Benutzer ohne Zusatzberechtigungen
|
||||||
|
user:
|
||||||
|
methods:
|
||||||
|
get: false
|
||||||
|
post: false
|
||||||
|
put: false
|
||||||
|
delete: false
|
||||||
|
# token als Zusatzsicherung gegen Spam, mehr siehe Hook
|
||||||
|
"token:${PUBLIC_TOKEN}":
|
||||||
|
methods:
|
||||||
|
get: false
|
||||||
|
post: true
|
||||||
|
put: false
|
||||||
|
delete: false
|
||||||
|
|
||||||
|
hooks:
|
||||||
|
post:
|
||||||
|
create:
|
||||||
|
type: javascript
|
||||||
|
file: hooks/email/post_create.js
|
||||||
|
|
||||||
|
fields:
|
||||||
|
- name: name
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Name", en: "Name" }
|
||||||
|
- name: email
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Email", en: "Email" }
|
||||||
|
- name: subject
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Betreff", en: "Subject" }
|
||||||
|
- name: message
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
widget: richtext
|
||||||
|
label: { de: "Nachricht", en: "Message" }
|
||||||
@ -9,7 +9,7 @@ meta:
|
|||||||
en: "Defines in which language the menu is available. The default language is 'de-DE'.",
|
en: "Defines in which language the menu is available. The default language is 'de-DE'.",
|
||||||
}
|
}
|
||||||
filter: true
|
filter: true
|
||||||
defaultValue: "de-DE"
|
defaultValue: "de"
|
||||||
choices:
|
choices:
|
||||||
- { id: af, name: { key: "labels.locales.af" } }
|
- { id: af, name: { key: "labels.locales.af" } }
|
||||||
- { id: af-ZA, name: { key: "labels.locales.af-ZA" } }
|
- { id: af-ZA, name: { key: "labels.locales.af-ZA" } }
|
||||||
|
|||||||
@ -37,25 +37,219 @@ meta:
|
|||||||
entryViewFields:
|
entryViewFields:
|
||||||
tabsSection:
|
tabsSection:
|
||||||
meta:
|
meta:
|
||||||
expand: general
|
expand: meta
|
||||||
tabs:
|
tabs:
|
||||||
- name: general
|
- name: general
|
||||||
meta:
|
meta:
|
||||||
label: { de: "Allgemein", en: "General" }
|
label: { de: "Allgemein", en: "General" }
|
||||||
source: generalInformation
|
|
||||||
- name: general2
|
|
||||||
meta:
|
|
||||||
label: { de: "Allgemein2", en: "General2 " }
|
|
||||||
fields:
|
fields:
|
||||||
- name: public
|
- name: public
|
||||||
type: boolean
|
type: boolean
|
||||||
meta:
|
meta:
|
||||||
|
defaultValue: true
|
||||||
label:
|
label:
|
||||||
de: Veröffentlicht
|
de: Veröffentlicht
|
||||||
en: Public
|
en: Public
|
||||||
helperText:
|
helperText:
|
||||||
de: "Alle allgemeinen Informationen werden auf der Seite angezeigt."
|
de: "Alle allgemeinen Informationen werden auf der Seite angezeigt."
|
||||||
en: "All general information are displayed on the page."
|
en: "All general information are displayed on the page."
|
||||||
|
- name: meta
|
||||||
|
meta:
|
||||||
|
label: { de: "Meta", en: "Meta" }
|
||||||
|
fields:
|
||||||
|
- name: meta
|
||||||
|
type: object
|
||||||
|
subFields:
|
||||||
|
- name: metaTitle
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Titel der Webseite", en: "Page Title" }
|
||||||
|
- name: metaDescription
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Beschreibung der Webseite", en: "Page Description" }
|
||||||
|
- name: metaTagRobots
|
||||||
|
type: string[]
|
||||||
|
meta:
|
||||||
|
widget: chipArray
|
||||||
|
label:
|
||||||
|
de: Robots
|
||||||
|
en: Robots
|
||||||
|
defaultValue: []
|
||||||
|
autocomplete: true
|
||||||
|
choices:
|
||||||
|
- { id: "noindex", name: "noindex" }
|
||||||
|
- { id: "index", name: "index" }
|
||||||
|
- { id: "follow", name: "follow" }
|
||||||
|
- { id: "nofollow", name: "nofollow" }
|
||||||
|
- { id: "noimageindex", name: "noimageindex" }
|
||||||
|
- { id: "none", name: "none" }
|
||||||
|
- { id: "noarchive", name: "noarchive" }
|
||||||
|
- { id: "nocache", name: "nocache" }
|
||||||
|
- { id: "nosnippet", name: "nosnippet" }
|
||||||
|
- { id: "nnavailable_after", name: "nnavailable_after" }
|
||||||
|
helperText:
|
||||||
|
de: "<strong>Noindex</strong>: Weist eine Suchmaschine an, eine Seite nicht zu indizieren.<br/><strong>index</strong>: Weist eine Suchmaschine an, eine Seite zu indizieren. Beachten Sie, dass Sie dieses Meta-Tag nicht hinzufügen müssen; es ist die Voreinstellung.<br/><strong>follow</strong>: Auch wenn die Seite nicht indexiert ist, sollte der Crawler allen Links auf einer Seite folgen und Eigenkapital an die verlinkten Seiten weitergeben.<br/><strong>nofollow</strong>: Weist einen Crawler an, keinen Links auf einer Seite zu folgen oder Link-Equity weiterzugeben.<br/><strong>noimageindex</strong>: Weist einen Crawler an, keine Bilder auf einer Seite zu indizieren.<br/><strong>none</strong>: Entspricht der gleichzeitigen Verwendung der noindex- und nofollow-Tags.<br/><strong>noarchive</strong>: Suchmaschinen sollten keinen zwischengespeicherten Link zu dieser Seite auf einem SERP anzeigen.<br/><strong>nocache</strong>: Wie noarchive, aber nur von Internet Explorer und Firefox verwendet.<br/><strong>nosnippet</strong>: Weist eine Suchmaschine an, kein Snippet dieser Seite (d. h. Meta-Beschreibung) dieser Seite auf einem SERP anzuzeigen.<br/><strong>nnavailable_after</strong>: Suchmaschinen sollen diese Seite nach einem bestimmten Datum nicht mehr indexieren.<br/>"
|
||||||
|
en: "<strong>Noindex</strong>: Tells a search engine not to index a page.<br/><strong>index</strong>: Tells a search engine to index a page. Note that you don’t need to add this meta tag; it’s the default.<br/><strong>follow</strong>: Even if the page isn’t indexed, the crawler should follow all the links on a page and pass equity to the linked pages.<br/><strong>nofollow</strong>: Tells a crawler not to follow any links on a page or pass along any link equity.<br/><strong>noimageindex</strong>: Tells a crawler not to index any images on a page.<br/><strong>none</strong>: Equivalent to using both the noindex and nofollow tags simultaneously.<br/><strong>noarchive</strong>: Search engines should not show a cached link to this page on a SERP.<br/><strong>nocache</strong>: Same as noarchive, but only used by Internet Explorer and Firefox.<br/><strong>nosnippet</strong>: Tells a search engine not to show a snippet of this page (i.e. meta description) of this page on a SERP.<br/><strong>nnavailable_after</strong>: Search engines should no longer index this page after a particular date.<br/>"
|
||||||
|
- name: metaKeywords
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "SEO / Schlüsselwörter", en: "SEO / Keywords" }
|
||||||
|
helperText:
|
||||||
|
de: "Beispiel: Stichwort1, Stichwort2, Stichwort3"
|
||||||
|
en: "Example: keyword1, keyword2, keyword3"
|
||||||
|
- name: person
|
||||||
|
meta:
|
||||||
|
label: { de: "Person", en: "Person" }
|
||||||
|
fields:
|
||||||
|
- name: person
|
||||||
|
type: object
|
||||||
|
subFields:
|
||||||
|
- name: salutation
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Anrede", en: "Salutation" }
|
||||||
|
- name: firstname
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Vorname", en: "Firstname" }
|
||||||
|
- name: lastname
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Nachname", en: "Lastname" }
|
||||||
|
- name: additional
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Zusatz", en: "Additional" }
|
||||||
|
- name: street
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Straße", en: "Street" }
|
||||||
|
- name: postcode
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Postleitzahl", en: "Postcode" }
|
||||||
|
- name: city
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Ort", en: "City" }
|
||||||
|
- name: tel
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Telefonnummer", en: "Phone number" }
|
||||||
|
- name: fax
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Faxnummer", en: "Fax number" }
|
||||||
|
- name: mobile
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Handynummer", en: "Mobile number" }
|
||||||
|
- name: email
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "E-Mail", en: "E-Mail" }
|
||||||
|
- name: company
|
||||||
|
meta:
|
||||||
|
label: { de: "Unternehmen", en: "Company" }
|
||||||
|
fields:
|
||||||
|
- name: person
|
||||||
|
type: object
|
||||||
|
subFields:
|
||||||
|
- name: companyName
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Name des Unternehmens", en: "Company Name" }
|
||||||
|
- name: companyWebUrl
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "URL zur Webseite", en: "Website URL" }
|
||||||
|
- name: companyAddresses
|
||||||
|
type: object[]
|
||||||
|
meta:
|
||||||
|
label:
|
||||||
|
de: Adresse
|
||||||
|
en: Adresse
|
||||||
|
css:
|
||||||
|
subFields:
|
||||||
|
- name: street
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Straße", en: "Street" }
|
||||||
|
- name: houseNr
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Hausnummer", en: "House number" }
|
||||||
|
- name: postcode
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "PLZ", en: "ZIP" }
|
||||||
|
- name: city
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Ort", en: "City" }
|
||||||
|
- name: tel
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Telefon", en: "Phone number" }
|
||||||
|
- name: fax
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Fax", en: "Fax" }
|
||||||
|
- name: email
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "E-Mail", en: "E-Mail" }
|
||||||
|
- name: media
|
||||||
|
meta:
|
||||||
|
label: { de: "Medien", en: "Media" }
|
||||||
|
fields:
|
||||||
|
- name: media
|
||||||
|
type: object
|
||||||
|
subFields:
|
||||||
|
- name: favicon
|
||||||
|
type: file
|
||||||
|
meta:
|
||||||
|
label: { de: "Favicon", en: "Favicon" }
|
||||||
|
helperText:
|
||||||
|
de: "Ein Favicon ist ein kleines Icon, Symbol oder Logo, das von Webbrowsern verwendet wird, um eine Website auf wiedererkennbare Weise zu kennzeichnen."
|
||||||
|
en: "A favicon is a small icon, symbol, or logo used by web browsers to identify a website in a recognizable way."
|
||||||
|
- name: brand
|
||||||
|
type: file
|
||||||
|
meta:
|
||||||
|
label: { de: "Logo / Brand", en: "Logo / Brand" }
|
||||||
|
helperText:
|
||||||
|
de: "Logo der Seite"
|
||||||
|
en: "Page Logo"
|
||||||
|
- name: mediaFiles
|
||||||
|
type: object[]
|
||||||
|
meta:
|
||||||
|
label: { de: "Dateien", en: "Files" }
|
||||||
|
subFields:
|
||||||
|
- name: title
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Datei-Titel", en: "File Title" }
|
||||||
|
- name: alternateText
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Alternativer Text", en: "Alternate Text" }
|
||||||
|
- name: id
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Technischer Name / ID", en: "Technical name / ID" }
|
||||||
|
- name: file
|
||||||
|
type: file
|
||||||
|
meta:
|
||||||
|
label: { de: "", en: "" }
|
||||||
|
- name: copyright
|
||||||
|
meta:
|
||||||
|
label: { de: "Copyright", en: "Copyright" }
|
||||||
|
fields:
|
||||||
|
- name: copyrightText
|
||||||
|
type: string
|
||||||
|
meta:
|
||||||
|
label: { de: "Copyright Text", en: "Copyright Text" }
|
||||||
|
|
||||||
imageFilter:
|
imageFilter:
|
||||||
xs:
|
xs:
|
||||||
@ -110,231 +304,4 @@ permissions:
|
|||||||
put: false
|
put: false
|
||||||
delete: false
|
delete: false
|
||||||
|
|
||||||
fields:
|
fields: []
|
||||||
- name: public
|
|
||||||
type: boolean
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Veröffentlicht
|
|
||||||
en: Public
|
|
||||||
helperText:
|
|
||||||
de: "Alle allgemeinen Informationen werden auf der Seite angezeigt."
|
|
||||||
en: "All general information are displayed on the page."
|
|
||||||
- name: generalInformation
|
|
||||||
type: tabs
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Allgemeine Information
|
|
||||||
en: General Information
|
|
||||||
activeTab: 0
|
|
||||||
subFields:
|
|
||||||
- name: types
|
|
||||||
type: object
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Allgemein
|
|
||||||
en: General
|
|
||||||
css:
|
|
||||||
subFields:
|
|
||||||
- name: public
|
|
||||||
type: boolean
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Veröffentlicht
|
|
||||||
en: Public
|
|
||||||
helperText:
|
|
||||||
de: "Alle allgemeinen Informationen werden auf der Seite angezeigt."
|
|
||||||
en: "All general information are displayed on the page."
|
|
||||||
- name: meta
|
|
||||||
type: object
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Meta
|
|
||||||
en: Meta
|
|
||||||
css:
|
|
||||||
subFields:
|
|
||||||
- name: metaTitle
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Titel der Webseite", en: "Page Title" }
|
|
||||||
- name: metaDescription
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Beschreibung der Webseite", en: "Page Description" }
|
|
||||||
- name: metaTagRobots
|
|
||||||
type: string[]
|
|
||||||
meta:
|
|
||||||
widget: chipArray
|
|
||||||
label:
|
|
||||||
de: Robots
|
|
||||||
en: Robots
|
|
||||||
defaultValue: []
|
|
||||||
autocomplete: true
|
|
||||||
choices:
|
|
||||||
- { id: "noindex", name: "noindex" }
|
|
||||||
- { id: "index", name: "index" }
|
|
||||||
- { id: "follow", name: "follow" }
|
|
||||||
- { id: "nofollow", name: "nofollow" }
|
|
||||||
- { id: "noimageindex", name: "noimageindex" }
|
|
||||||
- { id: "none", name: "none" }
|
|
||||||
- { id: "noarchive", name: "noarchive" }
|
|
||||||
- { id: "nocache", name: "nocache" }
|
|
||||||
- { id: "nosnippet", name: "nosnippet" }
|
|
||||||
- { id: "nnavailable_after", name: "nnavailable_after" }
|
|
||||||
helperText:
|
|
||||||
de: "<strong>Noindex</strong>: Weist eine Suchmaschine an, eine Seite nicht zu indizieren.<br/><strong>index</strong>: Weist eine Suchmaschine an, eine Seite zu indizieren. Beachten Sie, dass Sie dieses Meta-Tag nicht hinzufügen müssen; es ist die Voreinstellung.<br/><strong>follow</strong>: Auch wenn die Seite nicht indexiert ist, sollte der Crawler allen Links auf einer Seite folgen und Eigenkapital an die verlinkten Seiten weitergeben.<br/><strong>nofollow</strong>: Weist einen Crawler an, keinen Links auf einer Seite zu folgen oder Link-Equity weiterzugeben.<br/><strong>noimageindex</strong>: Weist einen Crawler an, keine Bilder auf einer Seite zu indizieren.<br/><strong>none</strong>: Entspricht der gleichzeitigen Verwendung der noindex- und nofollow-Tags.<br/><strong>noarchive</strong>: Suchmaschinen sollten keinen zwischengespeicherten Link zu dieser Seite auf einem SERP anzeigen.<br/><strong>nocache</strong>: Wie noarchive, aber nur von Internet Explorer und Firefox verwendet.<br/><strong>nosnippet</strong>: Weist eine Suchmaschine an, kein Snippet dieser Seite (d. h. Meta-Beschreibung) dieser Seite auf einem SERP anzuzeigen.<br/><strong>nnavailable_after</strong>: Suchmaschinen sollen diese Seite nach einem bestimmten Datum nicht mehr indexieren.<br/>"
|
|
||||||
en: "<strong>Noindex</strong>: Tells a search engine not to index a page.<br/><strong>index</strong>: Tells a search engine to index a page. Note that you don’t need to add this meta tag; it’s the default.<br/><strong>follow</strong>: Even if the page isn’t indexed, the crawler should follow all the links on a page and pass equity to the linked pages.<br/><strong>nofollow</strong>: Tells a crawler not to follow any links on a page or pass along any link equity.<br/><strong>noimageindex</strong>: Tells a crawler not to index any images on a page.<br/><strong>none</strong>: Equivalent to using both the noindex and nofollow tags simultaneously.<br/><strong>noarchive</strong>: Search engines should not show a cached link to this page on a SERP.<br/><strong>nocache</strong>: Same as noarchive, but only used by Internet Explorer and Firefox.<br/><strong>nosnippet</strong>: Tells a search engine not to show a snippet of this page (i.e. meta description) of this page on a SERP.<br/><strong>nnavailable_after</strong>: Search engines should no longer index this page after a particular date.<br/>"
|
|
||||||
- name: metaKeywords
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "SEO / Schlüsselwörter", en: "SEO / Keywords" }
|
|
||||||
helperText:
|
|
||||||
de: "Beispiel: Stichwort1, Stichwort2, Stichwort3"
|
|
||||||
en: "Example: keyword1, keyword2, keyword3"
|
|
||||||
- name: person
|
|
||||||
type: object
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Personendaten
|
|
||||||
en: Personal Data
|
|
||||||
css:
|
|
||||||
subFields:
|
|
||||||
- name: firstname
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Vorname", en: "Firstname" }
|
|
||||||
- name: lastname
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Nachname", en: "Lastname" }
|
|
||||||
- name: street
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Straße", en: "Street" }
|
|
||||||
- name: postcode
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Postleitzahl", en: "Postcode" }
|
|
||||||
- name: city
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Ort", en: "City" }
|
|
||||||
- name: tel
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Telefonnummer", en: "Phone number" }
|
|
||||||
- name: mobile
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Handynummer", en: "Mobile number" }
|
|
||||||
- name: email
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "E-Mail", en: "E-Mail" }
|
|
||||||
- name: company
|
|
||||||
type: object
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Unternehmensdaten
|
|
||||||
en: Company Data
|
|
||||||
css:
|
|
||||||
subFields:
|
|
||||||
- name: companyName
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Name des Unternehmens", en: "Company Name" }
|
|
||||||
- name: companyWebUrl
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "URL zur Webseite", en: "Website URL" }
|
|
||||||
- name: companyAddresses
|
|
||||||
type: object[]
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Adresse
|
|
||||||
en: Adresse
|
|
||||||
css:
|
|
||||||
subFields:
|
|
||||||
- name: street
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Straße", en: "Street" }
|
|
||||||
- name: houseNr
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Hausnummer", en: "House number" }
|
|
||||||
- name: postcode
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "PLZ", en: "ZIP" }
|
|
||||||
- name: city
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Ort", en: "City" }
|
|
||||||
- name: tel
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Telefon", en: "Phone number" }
|
|
||||||
- name: fax
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Fax", en: "Fax" }
|
|
||||||
- name: email
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "E-Mail", en: "E-Mail" }
|
|
||||||
- name: media
|
|
||||||
type: object
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Media
|
|
||||||
en: Media
|
|
||||||
css:
|
|
||||||
subFields:
|
|
||||||
- name: favicon
|
|
||||||
type: file
|
|
||||||
meta:
|
|
||||||
label: { de: "Favicon", en: "Favicon" }
|
|
||||||
helperText:
|
|
||||||
de: "Ein Favicon ist ein kleines Icon, Symbol oder Logo, das von Webbrowsern verwendet wird, um eine Website auf wiedererkennbare Weise zu kennzeichnen."
|
|
||||||
en: "A favicon is a small icon, symbol, or logo used by web browsers to identify a website in a recognizable way."
|
|
||||||
- name: brand
|
|
||||||
type: file
|
|
||||||
meta:
|
|
||||||
label: { de: "Logo / Brand", en: "Logo / Brand" }
|
|
||||||
helperText:
|
|
||||||
de: "Logo der Seite"
|
|
||||||
en: "Page Logo"
|
|
||||||
- name: mediaFiles
|
|
||||||
type: object[]
|
|
||||||
meta:
|
|
||||||
label: { de: "Dateien", en: "Files" }
|
|
||||||
subFields:
|
|
||||||
- name: title
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Datei-Titel", en: "File Title" }
|
|
||||||
- name: alternateText
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Alternativer Text", en: "Alternate Text" }
|
|
||||||
- name: id
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Technischer Name / ID", en: "Technical name / ID" }
|
|
||||||
- name: file
|
|
||||||
type: file
|
|
||||||
meta:
|
|
||||||
label: { de: "", en: "" }
|
|
||||||
- name: copyright
|
|
||||||
type: object
|
|
||||||
meta:
|
|
||||||
label:
|
|
||||||
de: Copyright
|
|
||||||
en: Copyright
|
|
||||||
css:
|
|
||||||
subFields:
|
|
||||||
- name: copyrightText
|
|
||||||
type: string
|
|
||||||
meta:
|
|
||||||
label: { de: "Copyright Text", en: "Copyright Text" }
|
|
||||||
|
|||||||
@ -104,15 +104,15 @@ x-settings: &settings
|
|||||||
|
|
||||||
x-page: &page
|
x-page: &page
|
||||||
name: page
|
name: page
|
||||||
type: string
|
type: object
|
||||||
meta:
|
meta:
|
||||||
widget: select
|
widget: select
|
||||||
label: { de: Seite, en: "Page" }
|
label: { de: Seite, en: "Page" }
|
||||||
choices:
|
choices:
|
||||||
endpoint: "content"
|
endpoint: "content"
|
||||||
mapping:
|
mapping:
|
||||||
id: "id"
|
id: "path"
|
||||||
name: "path"
|
name: "name"
|
||||||
params:
|
params:
|
||||||
count: 1
|
count: 1
|
||||||
sort: "ASC"
|
sort: "ASC"
|
||||||
@ -170,10 +170,10 @@ fields:
|
|||||||
name:
|
name:
|
||||||
de: Hauptnavigation
|
de: Hauptnavigation
|
||||||
en: Main Navigation
|
en: Main Navigation
|
||||||
- id: service
|
- id: footer
|
||||||
name:
|
name:
|
||||||
de: Servicenavigation
|
de: Fußzeile
|
||||||
en: Servicen Navigation
|
en: Footer Navigation
|
||||||
|
|
||||||
- !include fields/_locale.yml
|
- !include fields/_locale.yml
|
||||||
|
|
||||||
|
|||||||
@ -49,9 +49,11 @@
|
|||||||
"typescript": "^4.6.3"
|
"typescript": "^4.6.3"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"@mdi/js": "^6.7.96",
|
||||||
"@sentry/browser": "^6.19.6",
|
"@sentry/browser": "^6.19.6",
|
||||||
"@sentry/tracing": "^6.19.6",
|
"@sentry/tracing": "^6.19.6",
|
||||||
"core-js": "3.22.2"
|
"core-js": "3.22.2",
|
||||||
|
"mdi-svelte": "^1.1.2"
|
||||||
},
|
},
|
||||||
"optionalDependencies": {
|
"optionalDependencies": {
|
||||||
"@cypress/code-coverage": "^3.9.12",
|
"@cypress/code-coverage": "^3.9.12",
|
||||||
|
|||||||
@ -49,6 +49,17 @@
|
|||||||
<div id="appContainer"><!--HTML--></div>
|
<div id="appContainer"><!--HTML--></div>
|
||||||
<script type="module" src="/_dist_/index.mjs?t=__TIMESTAMP__"></script>
|
<script type="module" src="/_dist_/index.mjs?t=__TIMESTAMP__"></script>
|
||||||
<script nomodule src="/_dist_/index.es5.js?t=__TIMESTAMP__"></script>
|
<script nomodule src="/_dist_/index.es5.js?t=__TIMESTAMP__"></script>
|
||||||
|
|
||||||
|
<!-- Webmakers - Cookie Bar -->
|
||||||
|
<script
|
||||||
|
src="//cc.webmakers.de/cc.js"
|
||||||
|
defer
|
||||||
|
id="ccScript"
|
||||||
|
data-cc-tags="googleMaps"
|
||||||
|
data-cc-privacy-policy-url="/datenschutz"
|
||||||
|
data-cc-secondary-color="#c4253e"
|
||||||
|
data-cc-necessary-cookies="likecmsSession"
|
||||||
|
></script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
<!--SSR.ERROR-->
|
<!--SSR.ERROR-->
|
||||||
|
|||||||
88
src/api.ts
88
src/api.ts
@ -1,6 +1,7 @@
|
|||||||
import { apiBaseURL } from "./config"
|
import { apiBaseURL } from "./config"
|
||||||
import * as sentry from "./sentry"
|
import * as sentry from "./sentry"
|
||||||
import * as SSR from "../api/hooks/lib/ssr.js"
|
import * as SSR from "../api/hooks/lib/ssr.js"
|
||||||
|
import config from "../api/hooks/config"
|
||||||
|
|
||||||
// [MIT License](LICENSE.md) © [Jason Miller](https://jasonformat.com/)
|
// [MIT License](LICENSE.md) © [Jason Miller](https://jasonformat.com/)
|
||||||
const _f = function (url, options): Promise<Response> {
|
const _f = function (url, options): Promise<Response> {
|
||||||
@ -74,9 +75,12 @@ export const api = async <T>(
|
|||||||
headers?: {
|
headers?: {
|
||||||
[key: string]: string
|
[key: string]: string
|
||||||
}
|
}
|
||||||
params?: {
|
params?: APIParams
|
||||||
[key: string]: string
|
body?: any
|
||||||
}
|
noToken?: boolean
|
||||||
|
signal?: AbortSignal
|
||||||
|
_groupBy?: string
|
||||||
|
showErrors?: boolean
|
||||||
}
|
}
|
||||||
): Promise<{ data: T; count: number }> => {
|
): Promise<{ data: T; count: number }> => {
|
||||||
if (typeof window === "undefined") {
|
if (typeof window === "undefined") {
|
||||||
@ -98,6 +102,7 @@ export const api = async <T>(
|
|||||||
}
|
}
|
||||||
|
|
||||||
let method = "GET"
|
let method = "GET"
|
||||||
|
if (options?.method) method = options.method.toUpperCase()
|
||||||
|
|
||||||
let query = "&count=1"
|
let query = "&count=1"
|
||||||
if (options?.filter) query += "&filter=" + encodeURIComponent(JSON.stringify(options.filter))
|
if (options?.filter) query += "&filter=" + encodeURIComponent(JSON.stringify(options.filter))
|
||||||
@ -105,6 +110,7 @@ export const api = async <T>(
|
|||||||
if (options?.limit) query += "&limit=" + options.limit
|
if (options?.limit) query += "&limit=" + options.limit
|
||||||
if (options?.offset) query += "&offset=" + options.offset
|
if (options?.offset) query += "&offset=" + options.offset
|
||||||
if (options?.projection) query += "&projection=" + options.projection
|
if (options?.projection) query += "&projection=" + options.projection
|
||||||
|
if (options?._groupBy) query += "&_groupBy=" + options._groupBy
|
||||||
|
|
||||||
if (options?.params) {
|
if (options?.params) {
|
||||||
Object.keys(options.params).forEach((p) => {
|
Object.keys(options.params).forEach((p) => {
|
||||||
@ -116,9 +122,17 @@ export const api = async <T>(
|
|||||||
"Content-Type": "application/json",
|
"Content-Type": "application/json",
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// send jwt
|
||||||
|
if (!options?.noToken) {
|
||||||
|
// try {
|
||||||
|
// headers["Authorization"] =
|
||||||
|
// "Bearer " + (await getLogin()).tokenString
|
||||||
|
// } catch (e) { }
|
||||||
|
}
|
||||||
|
|
||||||
if (options?.headers) headers = { ...headers, ...options.headers }
|
if (options?.headers) headers = { ...headers, ...options.headers }
|
||||||
|
|
||||||
let url = apiBaseURL + endpoint + (query ? "?" + query : "")
|
let url = apiBaseURL + endpoint + (query ? (endpoint.includes("?") ? query : "?" + query) : "")
|
||||||
|
|
||||||
const span = sentry.currentTransaction()?.startChild({
|
const span = sentry.currentTransaction()?.startChild({
|
||||||
op: "fetch",
|
op: "fetch",
|
||||||
@ -130,10 +144,13 @@ export const api = async <T>(
|
|||||||
headers["sentry-trace"] = trace_id
|
headers["sentry-trace"] = trace_id
|
||||||
}
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
const response = await _fetch(url, {
|
const response = await _fetch(url, {
|
||||||
method,
|
method,
|
||||||
mode: "cors",
|
mode: "cors",
|
||||||
headers,
|
headers,
|
||||||
|
body: options?.body ? JSON.stringify(options.body) : null,
|
||||||
|
signal: options?.signal,
|
||||||
})
|
})
|
||||||
|
|
||||||
span?.finish()
|
span?.finish()
|
||||||
@ -145,6 +162,28 @@ export const api = async <T>(
|
|||||||
|
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
return { data, count: response?.headers?.get("x-results-count") || 0 }
|
return { data, count: response?.headers?.get("x-results-count") || 0 }
|
||||||
|
} catch (e) {
|
||||||
|
if (options?.showErrors && !(e instanceof DOMException)) {
|
||||||
|
// newNotification({
|
||||||
|
// class: "error",
|
||||||
|
// html: "Es ist ein Fehler aufgetreten! Bitte laden Sie die Seite neu und versuchen es später nocheinmal.",
|
||||||
|
// timeout: 6000,
|
||||||
|
// })
|
||||||
|
}
|
||||||
|
throw e
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export const sendEmail = async (type: string = "contactForm", data: any, noToken?: boolean) => {
|
||||||
|
await api("email?type=" + type, {
|
||||||
|
method: "post",
|
||||||
|
body: data,
|
||||||
|
noToken,
|
||||||
|
showErrors: true,
|
||||||
|
headers: {
|
||||||
|
token: config.publicToken,
|
||||||
|
},
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
export const getContent = async (path: string): Promise<Content> => {
|
export const getContent = async (path: string): Promise<Content> => {
|
||||||
@ -155,14 +194,14 @@ export const getContent = async (path: string): Promise<Content> => {
|
|||||||
return null
|
return null
|
||||||
}
|
}
|
||||||
|
|
||||||
export const getGeneralInformation = async (): Promise<GeneralInformation[]> => {
|
export const getGeneralInformation = async (): Promise<GeneralInfo[]> => {
|
||||||
try {
|
try {
|
||||||
let response = await api<GeneralInformation[]>("general", {
|
let response = await api<GeneralInfo[]>("general", {
|
||||||
method: "get",
|
method: "get",
|
||||||
offset: 0,
|
offset: 0,
|
||||||
limit: 1,
|
limit: 1,
|
||||||
filter: {
|
filter: {
|
||||||
active: true,
|
public: true,
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
return response.data
|
return response.data
|
||||||
@ -185,3 +224,38 @@ export const getArticles = async (): Promise<TibiArticle[]> => {
|
|||||||
return null
|
return null
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export const getNavigations = async (l: Locale): Promise<Navigation[]> => {
|
||||||
|
try {
|
||||||
|
let response = await api<Navigation[]>("navigation", {
|
||||||
|
method: "get",
|
||||||
|
offset: 0,
|
||||||
|
filter: {
|
||||||
|
locale: l.key,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
return response.data
|
||||||
|
} catch (e) {
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export const getGalleries = async (galIds: number[], params?: APIParams): Promise<Gallery[]> => {
|
||||||
|
try {
|
||||||
|
let response = await api<Gallery[]>("galleries", {
|
||||||
|
method: "get",
|
||||||
|
offset: 0,
|
||||||
|
params: {
|
||||||
|
sort: "title",
|
||||||
|
...params,
|
||||||
|
},
|
||||||
|
filter: {
|
||||||
|
_id: { $in: galIds },
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
return response.data
|
||||||
|
} catch (e) {
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
@ -1,9 +1,14 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Router, Route, links } from "svelte-routing"
|
import { Router, Route } from "svelte-routing"
|
||||||
import { scrollToTop } from "svelte-scrollto"
|
import { scrollToTop } from "svelte-scrollto"
|
||||||
import { location } from "../store"
|
import { location } from "../store"
|
||||||
|
|
||||||
|
import Home from "./routes/Home.svelte"
|
||||||
import Content from "./routes/Content.svelte"
|
import Content from "./routes/Content.svelte"
|
||||||
|
|
||||||
|
import Header from "./widgets/Header.svelte"
|
||||||
|
import Footer from "./widgets/Footer.svelte"
|
||||||
|
|
||||||
export let url = ""
|
export let url = ""
|
||||||
if (url) {
|
if (url) {
|
||||||
// ssr
|
// ssr
|
||||||
@ -24,23 +29,21 @@
|
|||||||
if (typeof window !== "undefined") console.log("App initialized")
|
if (typeof window !== "undefined") console.log("App initialized")
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" global>
|
<Header />
|
||||||
@import "./../css/main.less";
|
|
||||||
h1 {
|
|
||||||
color: red;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<h1>__PROJECT_TITLE__</h1>
|
<div>
|
||||||
|
|
||||||
<div use:links>
|
|
||||||
<a href="/test1">1</a>
|
|
||||||
<a href="/test2">2</a>
|
|
||||||
<a href="/test3">3</a>
|
|
||||||
<a href="/test4">4</a>
|
|
||||||
<Router url="{url}">
|
<Router url="{url}">
|
||||||
|
<Route path="/" let:params>
|
||||||
|
<Home />
|
||||||
|
</Route>
|
||||||
<Route path="/*path" let:params>
|
<Route path="/*path" let:params>
|
||||||
<Content path="/{params.path}" />
|
<Content path="/{params.path}" />
|
||||||
</Route>
|
</Route>
|
||||||
</Router>
|
</Router>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<Footer />
|
||||||
|
|
||||||
|
<style lang="less" global>
|
||||||
|
@import "./../css/main.less";
|
||||||
|
</style>
|
||||||
|
|||||||
@ -1,109 +0,0 @@
|
|||||||
<script lang="ts">
|
|
||||||
export let blocks: ContentBlock[]
|
|
||||||
export let imageBase: string
|
|
||||||
|
|
||||||
export let accordeon = false
|
|
||||||
|
|
||||||
let activeAccordeons: {
|
|
||||||
[key: number]: boolean
|
|
||||||
} = {}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="less">
|
|
||||||
.acc_trigger {
|
|
||||||
display: flex;
|
|
||||||
display: -webkit-flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
cursor: pointer;
|
|
||||||
border-bottom: solid 1px #ccc;
|
|
||||||
padding-bottom: 10px;
|
|
||||||
.icon {
|
|
||||||
display: flex;
|
|
||||||
display: -webkit-flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
font-size: 30px;
|
|
||||||
transform: rotate(0deg);
|
|
||||||
transition: all 0.3s;
|
|
||||||
}
|
|
||||||
&.active {
|
|
||||||
.icon {
|
|
||||||
transform: rotate(180deg);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.hideText {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
{#if blocks?.length}
|
|
||||||
<section class="section_padding">
|
|
||||||
<div class="container">
|
|
||||||
{#each blocks as box, idx}
|
|
||||||
<!-- Teaserbox -->
|
|
||||||
<div class="row center_row">
|
|
||||||
{#if box.images?.length && (box.layout == 1 || box.layout == 3)}
|
|
||||||
<div class="col-md-{box.layout < 3 ? 6 : 12}">
|
|
||||||
<img
|
|
||||||
loading="lazy"
|
|
||||||
src="{imageBase + box.images[0].file.src}"
|
|
||||||
alt="{box.images[0].label || ''}"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
{#if box.text || box.title || (box.button_text && box.button_url)}
|
|
||||||
<div class="col-md-{box.layout < 3 ? 6 : 12}">
|
|
||||||
{#if box.subtitle}
|
|
||||||
<div class="subline">{box.subtitle}</div>
|
|
||||||
{/if}
|
|
||||||
{#if box.title}
|
|
||||||
{#if accordeon == true}
|
|
||||||
<h2
|
|
||||||
class="h2_nooffset acc_trigger"
|
|
||||||
class:active="{activeAccordeons[idx]}"
|
|
||||||
on:click="{() => {
|
|
||||||
activeAccordeons[idx] =
|
|
||||||
!activeAccordeons[idx]
|
|
||||||
}}"
|
|
||||||
>
|
|
||||||
{box.title}
|
|
||||||
<span class="icon">\/</span>
|
|
||||||
</h2>
|
|
||||||
{:else}
|
|
||||||
<h2 class="h2_nooffset">{box.title}</h2>
|
|
||||||
{/if}
|
|
||||||
{/if}
|
|
||||||
<div
|
|
||||||
class="boxText"
|
|
||||||
class:hideText="{accordeon &&
|
|
||||||
box.title &&
|
|
||||||
!activeAccordeons[idx]}"
|
|
||||||
>
|
|
||||||
{@html box.text}
|
|
||||||
{#if box.button_text && box.button_url}
|
|
||||||
<a
|
|
||||||
href="{box.button_url}"
|
|
||||||
class="btn btn_blue"
|
|
||||||
>{box.button_text}</a
|
|
||||||
>
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
{#if box.images?.length && (box.layout == 2 || box.layout == 4)}
|
|
||||||
<div class="col-md-{box.layout < 3 ? 6 : 12}">
|
|
||||||
<img
|
|
||||||
loading="lazy"
|
|
||||||
src="{imageBase + box.images[0].file.src}"
|
|
||||||
alt="{box.images[0].label || ''}"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
{/each}
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
{/if}
|
|
||||||
@ -1,95 +0,0 @@
|
|||||||
<script lang="ts">
|
|
||||||
import { generalInformation } from "../store"
|
|
||||||
import { apiBaseURL } from "../config"
|
|
||||||
|
|
||||||
export let article: PrototypeArticle
|
|
||||||
export let details: boolean = false
|
|
||||||
|
|
||||||
const a = article.article
|
|
||||||
let cssClasses: string = "p_article"
|
|
||||||
|
|
||||||
cssClasses += a.layout.variant ? " p_article-" + a.layout.variant : ""
|
|
||||||
cssClasses += " " + Object.values(a.layout.margin).join(" ")
|
|
||||||
cssClasses += " " + Object.values(a.layout.padding).join(" ")
|
|
||||||
|
|
||||||
const getImageAlt = (image): string => {
|
|
||||||
if (image.alternateText) {
|
|
||||||
return image.alternateText
|
|
||||||
}
|
|
||||||
if (image.title) {
|
|
||||||
return image.title
|
|
||||||
}
|
|
||||||
|
|
||||||
return a.content.title
|
|
||||||
}
|
|
||||||
|
|
||||||
const getImageSrc = (file) => {
|
|
||||||
const url = `${apiBaseURL}prototype_articles/${file.id}/${file.file.path}?filter=l`
|
|
||||||
console.log(url, file)
|
|
||||||
return url
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
{#if a.general.public}
|
|
||||||
<article class="{cssClasses}">
|
|
||||||
{#if !a.layout.variant || a.layout.variant === "top-left"}
|
|
||||||
{#if a.general.categories}
|
|
||||||
<div class="p_article-categories">
|
|
||||||
{#each a.general.categories || [] as c}
|
|
||||||
<span class="p_article-category">{c}</span>
|
|
||||||
{/each}
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
{#if a.content.types.contentMedia.mediaFiles}
|
|
||||||
<div class="p_article-images">
|
|
||||||
{#each a.content.types.contentMedia.mediaFiles || [] as image}
|
|
||||||
<!-- {JSON.stringify(image)} -->
|
|
||||||
{#if image?.file?.path}
|
|
||||||
{getImageSrc(image)}
|
|
||||||
<!-- <img
|
|
||||||
src="{getImageSrc(image?.file)}"
|
|
||||||
id="{image?.id ? image?.id : ''}"
|
|
||||||
alt="{getImageAlt(image)}"
|
|
||||||
class="p_article-image"
|
|
||||||
/> -->
|
|
||||||
{/if}
|
|
||||||
{#if image?.caption}
|
|
||||||
<div class="p_article-image-caption">{image?.caption}</div>
|
|
||||||
{/if}
|
|
||||||
{/each}
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
|
|
||||||
{#if a.content.title}
|
|
||||||
<div class="p_article-title">{a.content.title}</div>
|
|
||||||
{/if}
|
|
||||||
{#if a.content.subtitle}
|
|
||||||
<div class="p_article-subtitle">{a.content.subtitle}</div>
|
|
||||||
{/if}
|
|
||||||
{#if a.content.types.teaser}
|
|
||||||
<div class="p_article-teaser">
|
|
||||||
{@html a.content.types.teaser}
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
{#if details && a.content.types.details}
|
|
||||||
<div class="p_article-details">
|
|
||||||
{@html a.content.types.details}
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
{#if a.link.url}
|
|
||||||
<a href="{a.link.url}" target="{a.link.target}">
|
|
||||||
{a.link.text ? a.link.text : a.link.url}
|
|
||||||
</a>
|
|
||||||
{/if}
|
|
||||||
{#if a.content.types.contentAttachments.attachments}
|
|
||||||
<div class="p_article-attachments">
|
|
||||||
{#each a.content.types.contentAttachments.attachments || [] as attachment}
|
|
||||||
<a href="{attachment.file.src}" download="{attachment.file.path}" class="p_article-attachment">
|
|
||||||
{attachment.title ? attachment.title : attachment.file.path}
|
|
||||||
</a>
|
|
||||||
{/each}
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
{/if}
|
|
||||||
</article>
|
|
||||||
{/if}
|
|
||||||
@ -1,7 +1,49 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
|
import { getContent } from "../../api"
|
||||||
|
// import { apiBaseURL } from "../../config"
|
||||||
|
import { generalInfo } from "../../store"
|
||||||
|
|
||||||
export let path: string
|
export let path: string
|
||||||
|
|
||||||
console.log("Content: ", path)
|
let loading = true
|
||||||
|
let content: Content
|
||||||
|
|
||||||
|
function load() {
|
||||||
|
loading = true
|
||||||
|
getContent(path)
|
||||||
|
.then((c) => {
|
||||||
|
content = c
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
loading = false
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
$: if (path) load()
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<h2>{path}</h2>
|
<svelte:head>
|
||||||
|
<title>{content?.name ? content?.name + " - " : ""}{$generalInfo?.meta?.metaTitle}</title>
|
||||||
|
<meta name="description" content="{$generalInfo?.meta?.metaDescription}" />
|
||||||
|
<meta name="keywords" content="{$generalInfo?.meta?.metaKeywords.replaceAll(' ', '')}" />
|
||||||
|
<meta name="author" content="{$generalInfo?.person?.firstname} {$generalInfo?.person?.lastname}" />
|
||||||
|
<meta name="robots" content="{$generalInfo?.meta?.metaTagRobots}" />
|
||||||
|
</svelte:head>
|
||||||
|
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-12">
|
||||||
|
{#if loading}
|
||||||
|
<!-- Loader -->
|
||||||
|
{:else if content}
|
||||||
|
{#each content.blocks || [] as b}
|
||||||
|
<h2>{b.title}</h2>
|
||||||
|
<div>{@html b.text}</div>
|
||||||
|
{/each}
|
||||||
|
{:else}
|
||||||
|
<h1>Seite nicht gefunden</h1>
|
||||||
|
<div>Pfad: {path}</div>
|
||||||
|
{/if}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|||||||
50
src/components/routes/Home.svelte
Normal file
50
src/components/routes/Home.svelte
Normal file
@ -0,0 +1,50 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import * as animateScroll from "svelte-scrollto"
|
||||||
|
|
||||||
|
import { generalInfo } from "../../store"
|
||||||
|
|
||||||
|
import GoogleMaps from "../widgets/GoogleMaps.svelte"
|
||||||
|
import ScrollTo from "../widgets/ScrollTo.svelte"
|
||||||
|
import ContactForm from "../widgets/ContactForm.svelte"
|
||||||
|
|
||||||
|
let expandedForm: string = "recipe"
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<svelte:head>
|
||||||
|
<title>{$generalInfo?.meta?.metaTitle}</title>
|
||||||
|
<meta name="description" content="{$generalInfo?.meta?.metaDescription}" />
|
||||||
|
<meta name="keywords" content="{$generalInfo?.meta?.metaKeywords.replaceAll(' ', '')}" />
|
||||||
|
<meta name="author" content="{$generalInfo?.person?.firstname} {$generalInfo?.person?.lastname}" />
|
||||||
|
<meta name="robots" content="{$generalInfo?.meta?.metaTagRobots}" />
|
||||||
|
</svelte:head>
|
||||||
|
|
||||||
|
<section class="contact">
|
||||||
|
<div class="container">
|
||||||
|
<div class="row nospace">
|
||||||
|
<div class="col-md-6">
|
||||||
|
<ContactForm type="recipe" collapsed="{expandedForm !== 'recipe'}" />
|
||||||
|
</div>
|
||||||
|
<div class="col-md-6">
|
||||||
|
<ContactForm type="contact" collapsed="{expandedForm !== 'contact'}" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section>
|
||||||
|
<GoogleMaps />
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<ScrollTo
|
||||||
|
on:scrollTo="{(e) => {
|
||||||
|
expandedForm = null
|
||||||
|
animateScroll.scrollTo({
|
||||||
|
delay: 100,
|
||||||
|
element: '#' + e.detail.element,
|
||||||
|
offset: -200,
|
||||||
|
onDone: () => {
|
||||||
|
expandedForm = e.detail.element
|
||||||
|
},
|
||||||
|
})
|
||||||
|
}}"
|
||||||
|
/>
|
||||||
@ -1,31 +0,0 @@
|
|||||||
<script lang="ts">
|
|
||||||
import { getPrototypeArticles } from "../../api"
|
|
||||||
|
|
||||||
import Sidebar from "../page/Sidebar.svelte"
|
|
||||||
import PrototypeArticle from "../page/PrototypeArticle.svelte"
|
|
||||||
|
|
||||||
let articles: PrototypeArticle[] | []
|
|
||||||
|
|
||||||
const getArticles = async () => {
|
|
||||||
articles = await getPrototypeArticles()
|
|
||||||
}
|
|
||||||
getArticles()
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div class="container">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-md-10">
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{#each articles || [] as article}
|
|
||||||
<PrototypeArticle article="{article}" />
|
|
||||||
{/each}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div class="col-md-2">
|
|
||||||
<Sidebar />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
160
src/components/widgets/ContactForm.svelte
Normal file
160
src/components/widgets/ContactForm.svelte
Normal file
@ -0,0 +1,160 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import { fade } from "svelte/transition"
|
||||||
|
import { mdiCheck, mdiChevronDown } from "@mdi/js"
|
||||||
|
import Icon from "mdi-svelte"
|
||||||
|
|
||||||
|
import { sendEmail } from "../../api"
|
||||||
|
|
||||||
|
export let type: string
|
||||||
|
export let collapsed: boolean = false
|
||||||
|
|
||||||
|
let formData: {
|
||||||
|
name: string
|
||||||
|
email: string
|
||||||
|
subject: string
|
||||||
|
message: string
|
||||||
|
privacy: boolean
|
||||||
|
} = {
|
||||||
|
name: null,
|
||||||
|
email: null,
|
||||||
|
subject: null,
|
||||||
|
message: null,
|
||||||
|
privacy: false,
|
||||||
|
}
|
||||||
|
let requestSucessfully: boolean = false
|
||||||
|
let requestPending: boolean = false
|
||||||
|
|
||||||
|
const submit = () => {
|
||||||
|
if (
|
||||||
|
formData["name"] &&
|
||||||
|
formData["email"] &&
|
||||||
|
formData["subject"] &&
|
||||||
|
formData["message"] &&
|
||||||
|
formData["privacy"]
|
||||||
|
) {
|
||||||
|
requestPending = true
|
||||||
|
sendEmail(type + "Form", formData)
|
||||||
|
.then(() => {
|
||||||
|
resetForm()
|
||||||
|
requestSucessfully = true
|
||||||
|
requestPending = false
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
requestSucessfully = false
|
||||||
|
}, 10000)
|
||||||
|
})
|
||||||
|
.catch((e) => {
|
||||||
|
console.error(e)
|
||||||
|
requestPending = false
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
requestPending = false
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const resetForm = () => {
|
||||||
|
formData = {
|
||||||
|
name: null,
|
||||||
|
email: null,
|
||||||
|
subject: null,
|
||||||
|
message: null,
|
||||||
|
privacy: false,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
$: isValid =
|
||||||
|
formData["name"] && formData["email"] && formData["subject"] && formData["message"] && formData["privacy"]
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div id="{type}">
|
||||||
|
<form on:submit|preventDefault="{submit}" class="mt-lg">
|
||||||
|
<div class="layout justify-content-space-between layout-gap-md">
|
||||||
|
<div class="hidden-sm icon {type}">
|
||||||
|
<!-- <img src="img/icon/{type}.svg" alt="" /> -->
|
||||||
|
</div>
|
||||||
|
<div class="titles" on:click="{() => (collapsed = !collapsed)}">
|
||||||
|
<h3 class="title">
|
||||||
|
{type === "contact" ? "Kontakt" : ""}
|
||||||
|
{type === "recipe" ? "Rezeptanfrage" : ""}
|
||||||
|
</h3>
|
||||||
|
<h4 class="subTitle">
|
||||||
|
{type === "contact" ? "Schreiben Sie uns Ihr Anliegen" : ""}
|
||||||
|
{type === "recipe" ? "Teilen Sie uns Ihren Rezeptwunsch mit" : ""}
|
||||||
|
</h4>
|
||||||
|
</div>
|
||||||
|
<div class="collapse-icon" class:collapsed="{!collapsed}" on:click="{() => (collapsed = !collapsed)}">
|
||||||
|
<Icon path="{mdiChevronDown}" size="2" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{#if !collapsed}
|
||||||
|
<div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-6 mt-sm">
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
bind:value="{formData['name']}"
|
||||||
|
placeholder="Name"
|
||||||
|
readonly="{requestPending}"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-6 mt-sm">
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
bind:value="{formData['email']}"
|
||||||
|
placeholder="E-Mail Adresse"
|
||||||
|
readonly="{requestPending}"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row nospace">
|
||||||
|
<div class="col-md-12 mt-sm">
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
bind:value="{formData['subject']}"
|
||||||
|
placeholder="Betreff"
|
||||||
|
readonly="{requestPending}"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row nospace">
|
||||||
|
<div class="col-md-12 mt-sm">
|
||||||
|
<textarea bind:value="{formData['message']}" readonly="{requestPending}"></textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row nospace">
|
||||||
|
<div class="col-md-12 mt-sm">
|
||||||
|
<div class="layout layout-gap-md align-items-center">
|
||||||
|
<div
|
||||||
|
class="checkbox"
|
||||||
|
on:click="{() => {
|
||||||
|
formData.privacy = !formData.privacy
|
||||||
|
}}"
|
||||||
|
>
|
||||||
|
{#if formData.privacy}
|
||||||
|
<div class="icon">
|
||||||
|
<Icon path="{mdiCheck}" size="2" />
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
</div>
|
||||||
|
<div on:click="{() => (formData.privacy = !formData.privacy)}">
|
||||||
|
<a href="/datenschutz"><strong>Datenschutz</strong></a> akzeptieren
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{#if requestSucessfully}
|
||||||
|
<div class="mt-sm" transition:fade>
|
||||||
|
<div>
|
||||||
|
<strong>Vielen Dank für Ihre Kontaktaufnahme!</strong>
|
||||||
|
</div>
|
||||||
|
<p>Wir werden uns zeitnah mit Ihnen in Verbindung setzen!</p>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
<div class="layout justify-content-end mt-sm">
|
||||||
|
<button type="submit" disabled="{!isValid || requestPending}">Absenden</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
11
src/components/widgets/ContactInformation.svelte
Normal file
11
src/components/widgets/ContactInformation.svelte
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import { generalInfo } from "../../store"
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div class="contact-information" id="contact-information">
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-12">...</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
24
src/components/widgets/Footer.svelte
Normal file
24
src/components/widgets/Footer.svelte
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import { generalInfo } from "../../store"
|
||||||
|
|
||||||
|
import Navigation from "./Navigation.svelte"
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-12">
|
||||||
|
<Navigation ident="footer" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{#if $generalInfo?.copyrightText}
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-12">
|
||||||
|
<div class="copyright">
|
||||||
|
{$generalInfo?.copyrightText}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
@ -64,13 +64,9 @@
|
|||||||
{#each galleries || [] as gallery}
|
{#each galleries || [] as gallery}
|
||||||
<div class="gallery gallery-{gallery.variant}">
|
<div class="gallery gallery-{gallery.variant}">
|
||||||
{#each gallery.items || [] as image, index}
|
{#each gallery.items || [] as image, index}
|
||||||
<div
|
<div class="gallery-item" on:click="{() => showDetails(gallery, image)}">
|
||||||
class="gallery-item"
|
|
||||||
on:click="{() => showDetails(gallery, image)}"
|
|
||||||
>
|
|
||||||
<img
|
<img
|
||||||
src="{apiBaseURL}galleries/{gallery.id}/{image.file
|
src="{apiBaseURL}galleries/{gallery.id}/{image.file.src}?filter=s"
|
||||||
.src}?filter=s"
|
|
||||||
alt="{image.alt ? image.alt : image.title}"
|
alt="{image.alt ? image.alt : image.title}"
|
||||||
/>
|
/>
|
||||||
{#if gallery.variant === "simple-with-title"}
|
{#if gallery.variant === "simple-with-title"}
|
||||||
@ -87,11 +83,8 @@
|
|||||||
<Modal show="{selectedGallery && selectedImage}">
|
<Modal show="{selectedGallery && selectedImage}">
|
||||||
<div transition:fade class="gallery-image-details">
|
<div transition:fade class="gallery-image-details">
|
||||||
<img
|
<img
|
||||||
src="{apiBaseURL}galleries/{selectedGallery.id}/{selectedImage
|
src="{apiBaseURL}galleries/{selectedGallery.id}/{selectedImage.file.src}?filter=l"
|
||||||
.file.src}?filter=l"
|
alt="{selectedImage.alt ? selectedImage.alt : selectedImage.title}"
|
||||||
alt="{selectedImage.alt
|
|
||||||
? selectedImage.alt
|
|
||||||
: selectedImage.title}"
|
|
||||||
on:click="{closeDetails}"
|
on:click="{closeDetails}"
|
||||||
/>
|
/>
|
||||||
<div class="gallery-info">
|
<div class="gallery-info">
|
||||||
22
src/components/widgets/GoogleMaps.svelte
Normal file
22
src/components/widgets/GoogleMaps.svelte
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import { generalInfo, ccTags } from "../../store"
|
||||||
|
|
||||||
|
$: iframeTitle =
|
||||||
|
$generalInfo?.person?.salutation +
|
||||||
|
" " +
|
||||||
|
$generalInfo?.person?.firstname +
|
||||||
|
" " +
|
||||||
|
$generalInfo?.person?.lastname +
|
||||||
|
" - " +
|
||||||
|
$generalInfo?.person?.additional
|
||||||
|
</script>
|
||||||
|
|
||||||
|
{#if $ccTags?.includes("googleMaps")}
|
||||||
|
<iframe
|
||||||
|
id="googleMaps"
|
||||||
|
title="{iframeTitle}"
|
||||||
|
src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d1342.4197187151062!2d10.4164909278422!3d50.56856037791808!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x2a509772539d6c1b!2sDr.%20med.%20Christine%20Wedekind!5e0!3m2!1sde!2sde!4v1652861335963!5m2!1sde!2sde"
|
||||||
|
allowfullscreen
|
||||||
|
loading="lazy"
|
||||||
|
referrerpolicy="no-referrer-when-downgrade"></iframe>
|
||||||
|
{/if}
|
||||||
30
src/components/widgets/Header.svelte
Normal file
30
src/components/widgets/Header.svelte
Normal file
@ -0,0 +1,30 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import { link } from "svelte-routing"
|
||||||
|
|
||||||
|
import { generalInfo } from "../../store"
|
||||||
|
|
||||||
|
import Navigation from "./Navigation.svelte"
|
||||||
|
import Image from "./Image.svelte"
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<header>
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-sm-12">
|
||||||
|
<div class="header-content">
|
||||||
|
<a href="/" use:link>
|
||||||
|
<Image
|
||||||
|
file="{$generalInfo?.media?.brand}"
|
||||||
|
alt="{$generalInfo?.meta?.metaTitle}"
|
||||||
|
cssClass="brand"
|
||||||
|
/>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<div class="header-content-right">
|
||||||
|
<Navigation />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
9
src/components/widgets/Image.svelte
Normal file
9
src/components/widgets/Image.svelte
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
export let file: File = null
|
||||||
|
export let alt: string = ""
|
||||||
|
export let cssClass: string = ""
|
||||||
|
</script>
|
||||||
|
|
||||||
|
{#if file}
|
||||||
|
<img src="{file.src}" alt="{alt ? alt + ' - ' : ''}{file.path}" class="{cssClass}" />
|
||||||
|
{/if}
|
||||||
78
src/components/widgets/Navigation.svelte
Normal file
78
src/components/widgets/Navigation.svelte
Normal file
@ -0,0 +1,78 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import * as animateScroll from "svelte-scrollto"
|
||||||
|
import Icon from "mdi-svelte"
|
||||||
|
import { mdiMenu } from "@mdi/js"
|
||||||
|
// import { generalInfo } from "../../store"
|
||||||
|
|
||||||
|
import { links } from "svelte-routing"
|
||||||
|
import { navigations } from "../../store"
|
||||||
|
|
||||||
|
export let ident = "main"
|
||||||
|
|
||||||
|
let navigation: Navigation
|
||||||
|
let showMobileNav: boolean = false
|
||||||
|
|
||||||
|
$: {
|
||||||
|
$navigations?.map((nav) => {
|
||||||
|
if (nav.ident === ident) {
|
||||||
|
navigation = nav
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
{#if navigation}
|
||||||
|
<nav class="{ident}" use:links>
|
||||||
|
{#each navigation?.items || [] as item}
|
||||||
|
{#if item.settings.url.url}
|
||||||
|
<a
|
||||||
|
href="{item.settings.url.url}"
|
||||||
|
target="{item.settings.url.target}"
|
||||||
|
on:click="{() => {
|
||||||
|
animateScroll.scrollTo({ element: item.settings.url.url, offset: -200 })
|
||||||
|
showMobileNav = false
|
||||||
|
}}"
|
||||||
|
>
|
||||||
|
{item.settings.title}
|
||||||
|
</a>
|
||||||
|
{:else}
|
||||||
|
<a href="{item.settings.page}">
|
||||||
|
{item.settings.title}
|
||||||
|
</a>
|
||||||
|
{/if}
|
||||||
|
{/each}
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
{#if ident === "main"}
|
||||||
|
<div class="nav-mobile-toggle" on:click="{() => (showMobileNav = !showMobileNav)}">
|
||||||
|
<Icon path="{mdiMenu}" size="2" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<nav class="{ident}-mobile" class:show="{showMobileNav}" use:links>
|
||||||
|
<!-- <img src="img/body-image-left.svg" alt="" class="bg-image" /> -->
|
||||||
|
|
||||||
|
{#each navigation?.items || [] as item}
|
||||||
|
{#if item.settings.url.url}
|
||||||
|
<div class="nav-item">
|
||||||
|
<a
|
||||||
|
href="{item.settings.url.url}"
|
||||||
|
target="{item.settings.url.target}"
|
||||||
|
on:click="{() => {
|
||||||
|
animateScroll.scrollTo({ element: item.settings.url.url, offset: -200 })
|
||||||
|
showMobileNav = false
|
||||||
|
}}"
|
||||||
|
>
|
||||||
|
{item.settings.title}
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
{:else}
|
||||||
|
<div class="nav-item">
|
||||||
|
<a href="{item.settings.page}" on:click="{() => (showMobileNav = false)}">
|
||||||
|
{item.settings.title}
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
{/each}
|
||||||
|
</nav>
|
||||||
|
{/if}
|
||||||
|
{/if}
|
||||||
56
src/components/widgets/News.svelte
Normal file
56
src/components/widgets/News.svelte
Normal file
@ -0,0 +1,56 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import { news } from "../../store"
|
||||||
|
|
||||||
|
const getNewsDate = (news) => {
|
||||||
|
const from = news?.from ? new Date(news?.from) : null
|
||||||
|
const until = news?.until ? new Date(news?.until) : null
|
||||||
|
const options = { year: "numeric", month: "2-digit", day: "2-digit" }
|
||||||
|
let d = ""
|
||||||
|
if (from) {
|
||||||
|
// @ts-ignore
|
||||||
|
d += from.toLocaleDateString("de-DE", options)
|
||||||
|
}
|
||||||
|
if (until) {
|
||||||
|
// @ts-ignore
|
||||||
|
d += " bis " + until.toLocaleDateString("de-DE", options)
|
||||||
|
}
|
||||||
|
|
||||||
|
if (news.title) {
|
||||||
|
d += " - "
|
||||||
|
}
|
||||||
|
return d
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
{#if $news?.length}
|
||||||
|
<section class="news" id="news">
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-12">
|
||||||
|
<h2>Neuigkeiten</h2>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
{#each $news as n}
|
||||||
|
{#if n.title || n.from || n.until}
|
||||||
|
<div class="col-md-6">
|
||||||
|
<article>
|
||||||
|
<div class="title">
|
||||||
|
{getNewsDate(n)}
|
||||||
|
{#if n.title}
|
||||||
|
{@html n.title}
|
||||||
|
{/if}
|
||||||
|
</div>
|
||||||
|
{#if n.content}
|
||||||
|
<div class="content">
|
||||||
|
{@html n.content}
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
{/each}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
{/if}
|
||||||
74
src/components/widgets/PromotionImage.svelte
Normal file
74
src/components/widgets/PromotionImage.svelte
Normal file
@ -0,0 +1,74 @@
|
|||||||
|
<svg
|
||||||
|
class="promotion-image-wave-top"
|
||||||
|
width="1920"
|
||||||
|
height="70"
|
||||||
|
viewBox="0 0 1920 70"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
fill-rule="evenodd"
|
||||||
|
clip-rule="evenodd"
|
||||||
|
d="m1920 70-80-12c-80-12-240-36-400-42s-320 6-480 18-320 24-480 18S160 22 80 10L0-2v-108h1920V70z"
|
||||||
|
fill="#fff"></path>
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
<!-- <img src="img/promotion/promotion-image.png" alt="" class="promotion-image" /> -->
|
||||||
|
|
||||||
|
<svg class="promotion-image-wave-bottom" viewBox="0 0 1920 137" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path
|
||||||
|
fill-rule="evenodd"
|
||||||
|
clip-rule="evenodd"
|
||||||
|
d="M0 30.708 80 24.7c80-6.008 240-18.024 400-6.008 160 12.016 320 48.065 480 42.057 160-6.009 320-54.073 480-60.082 160-6.008 320 30.041 400 48.065l80 18.025V137H0V30.708z"
|
||||||
|
fill="url(#plkj8d2oga)"></path>
|
||||||
|
<path
|
||||||
|
fill-rule="evenodd"
|
||||||
|
clip-rule="evenodd"
|
||||||
|
d="M0 30.708 80 24.7c80-6.008 240-18.024 400-6.008 160 12.016 320 48.065 480 42.057 160-6.009 320-54.073 480-60.082 160-6.008 320 30.041 400 48.065l80 18.025V137H0V30.708z"
|
||||||
|
fill="url(#iwnto70uxb)"></path>
|
||||||
|
<path
|
||||||
|
fill-rule="evenodd"
|
||||||
|
clip-rule="evenodd"
|
||||||
|
d="M0 30.708 80 24.7c80-6.008 240-18.024 400-6.008 160 12.016 320 48.065 480 42.057 160-6.009 320-54.073 480-60.082 160-6.008 320 30.041 400 48.065l80 18.025V137H0V30.708z"
|
||||||
|
fill="url(#aco1fmuv9c)"></path>
|
||||||
|
<path
|
||||||
|
fill-rule="evenodd"
|
||||||
|
clip-rule="evenodd"
|
||||||
|
d="M0 121.708 80 108.7c80-6.008 240-48.024 400-36.008 160 12.016 320 48.065 480 42.057 160-6.009 320-94.073 480-100.081 160-6.009 320 30.04 400 48.064l80 18.025V141H0v-19.292z"
|
||||||
|
fill="#fff"></path>
|
||||||
|
<defs>
|
||||||
|
<radialGradient
|
||||||
|
id="plkj8d2oga"
|
||||||
|
cx="0"
|
||||||
|
cy="0"
|
||||||
|
r="1"
|
||||||
|
gradientUnits="userSpaceOnUse"
|
||||||
|
gradientTransform="matrix(960 0 0 41.5089 960 95.491)"
|
||||||
|
>
|
||||||
|
<stop stop-color="#FFFEFF"></stop>
|
||||||
|
<stop offset="1" stop-color="#D7FFFE"></stop>
|
||||||
|
</radialGradient>
|
||||||
|
<radialGradient
|
||||||
|
id="iwnto70uxb"
|
||||||
|
cx="0"
|
||||||
|
cy="0"
|
||||||
|
r="1"
|
||||||
|
gradientUnits="userSpaceOnUse"
|
||||||
|
gradientTransform="matrix(-652.99956 -34.96514 36.02623 -672.81617 1033.5 102.034)"
|
||||||
|
>
|
||||||
|
<stop stop-color="#BCFFFD"></stop>
|
||||||
|
<stop offset="1" stop-color="#fff" stop-opacity="0"></stop>
|
||||||
|
</radialGradient>
|
||||||
|
<radialGradient
|
||||||
|
id="aco1fmuv9c"
|
||||||
|
cx="0"
|
||||||
|
cy="0"
|
||||||
|
r="1"
|
||||||
|
gradientUnits="userSpaceOnUse"
|
||||||
|
gradientTransform="rotate(8.473 63.69 3351.307) scale(825.005 723.955)"
|
||||||
|
>
|
||||||
|
<stop stop-color="#fff"></stop>
|
||||||
|
<stop offset="1" stop-color="#fff" stop-opacity="0"></stop>
|
||||||
|
</radialGradient>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.8 KiB |
37
src/components/widgets/ScrollTo.svelte
Normal file
37
src/components/widgets/ScrollTo.svelte
Normal file
@ -0,0 +1,37 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import { createEventDispatcher } from "svelte"
|
||||||
|
|
||||||
|
const dispatch = createEventDispatcher()
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div class="scroll-to-top">
|
||||||
|
<div class="circle-email">
|
||||||
|
<a
|
||||||
|
href="/#"
|
||||||
|
on:click="{() => {
|
||||||
|
dispatch('scrollTo', {
|
||||||
|
element: 'contact',
|
||||||
|
})
|
||||||
|
}}"
|
||||||
|
>
|
||||||
|
<!-- <img src="img/icon/contact.svg" alt="" /> -->
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="circle-contact">
|
||||||
|
<a
|
||||||
|
href="/#"
|
||||||
|
on:click="{() => {
|
||||||
|
dispatch('scrollTo', {
|
||||||
|
element: 'recipe',
|
||||||
|
})
|
||||||
|
}}"
|
||||||
|
>
|
||||||
|
<!-- <img src="img/icon/recipe.svg" alt="" /> -->
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="circle-top">
|
||||||
|
<a href="/#">
|
||||||
|
<!-- <img src="img/icon/chevron-up.svg" alt="" /> -->
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
@ -1,3 +1 @@
|
|||||||
body {
|
@import "theme-2022/main";
|
||||||
background-color: #eee;
|
|
||||||
}
|
|
||||||
|
|||||||
@ -1,5 +0,0 @@
|
|||||||
.p_article {
|
|
||||||
font-size: 14px;
|
|
||||||
border: 1px solid #000;
|
|
||||||
padding: 20px;
|
|
||||||
}
|
|
||||||
59
src/css/theme-2022/components/contact-information.less
Normal file
59
src/css/theme-2022/components/contact-information.less
Normal file
@ -0,0 +1,59 @@
|
|||||||
|
.contact-information {
|
||||||
|
margin-top: -120px;
|
||||||
|
min-height: 1060px;
|
||||||
|
background: url("../css/theme-2022/components/img/union.svg") top no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
|
||||||
|
& > .container {
|
||||||
|
padding-top: 10rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.appointmentOfficeHour {
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
font-size: 0.87em;
|
||||||
|
margin-bottom: @space-sm;
|
||||||
|
}
|
||||||
|
|
||||||
|
strong {
|
||||||
|
display: inline-block;
|
||||||
|
min-width: 120px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.meeting-information {
|
||||||
|
margin-top: @space-xl;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
list-style-type: none;
|
||||||
|
padding-left: 40px;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
li {
|
||||||
|
line-height: 30px;
|
||||||
|
padding-left: 0px;
|
||||||
|
font-weight: 400;
|
||||||
|
width: 50%;
|
||||||
|
display: inline-block;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
content: url("../css/theme-2022/components/img/check-bold.svg");
|
||||||
|
font-weight: 400;
|
||||||
|
top: 1px;
|
||||||
|
left: -30px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1050px) {
|
||||||
|
padding-bottom: 10rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
margin-bottom: -90px;
|
||||||
|
}
|
||||||
|
}
|
||||||
23
src/css/theme-2022/components/footer.less
Normal file
23
src/css/theme-2022/components/footer.less
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
footer {
|
||||||
|
min-height: 70px;
|
||||||
|
margin-top: @space-md;
|
||||||
|
|
||||||
|
.copyright {
|
||||||
|
text-align: center;
|
||||||
|
margin: @space-md 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav.footer {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
gap: @space-md;
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: @on-background;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
139
src/css/theme-2022/components/forms.less
Normal file
139
src/css/theme-2022/components/forms.less
Normal file
@ -0,0 +1,139 @@
|
|||||||
|
form {
|
||||||
|
background: @surface;
|
||||||
|
color: @on-surface;
|
||||||
|
padding: @space-md;
|
||||||
|
border-radius: 10px;
|
||||||
|
box-shadow: 0 10px 40px 0 rgba(0, 0, 0, 0.1);
|
||||||
|
|
||||||
|
strong {
|
||||||
|
color: @secondary;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.titles {
|
||||||
|
flex-grow: 1;
|
||||||
|
|
||||||
|
.title,
|
||||||
|
.subTitle {
|
||||||
|
text-align: left;
|
||||||
|
color: @on-surface;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
flex-shrink: 0;
|
||||||
|
border-radius: 100%;
|
||||||
|
|
||||||
|
&.contact {
|
||||||
|
background-color: @secondary-light-green;
|
||||||
|
}
|
||||||
|
&.recipe {
|
||||||
|
background-color: @secondary-light;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.collapse-icon {
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
svg {
|
||||||
|
transition: @transition-default;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.collapsed svg {
|
||||||
|
transform: rotate(-90deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
input,
|
||||||
|
textarea,
|
||||||
|
.checkbox {
|
||||||
|
border: 1px solid transparent;
|
||||||
|
border-radius: 10px;
|
||||||
|
box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.1);
|
||||||
|
background: @surface;
|
||||||
|
color: @on-background;
|
||||||
|
padding: @space-sm @space-md;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 100%;
|
||||||
|
transition: all 0.2s ease-in-out;
|
||||||
|
outline: none;
|
||||||
|
|
||||||
|
::placeholder {
|
||||||
|
color: @on-surface;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
:-ms-input-placeholder {
|
||||||
|
color: @on-surface;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
::-ms-input-placeholder {
|
||||||
|
color: @on-surface;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
border: 1px solid @secondary;
|
||||||
|
color: @primary;
|
||||||
|
}
|
||||||
|
|
||||||
|
&[readonly] {
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.checkbox {
|
||||||
|
padding: 0;
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
color: @secondary;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
box-shadow: inset 0 0 10px 0 @secondary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
textarea {
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
width: 100%;
|
||||||
|
background: @secondary;
|
||||||
|
color: @on-secondary;
|
||||||
|
padding: @space-xs @space-md;
|
||||||
|
border-radius: 10px;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
transition: @transition-default;
|
||||||
|
font-weight: 700;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
border-color: @on-secondary;
|
||||||
|
background-color: @primary;
|
||||||
|
color: @on-primary;
|
||||||
|
}
|
||||||
|
|
||||||
|
&[disabled] {
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.error {
|
||||||
|
background: @error;
|
||||||
|
color: @on-error;
|
||||||
|
padding: @space-md;
|
||||||
|
}
|
||||||
|
}
|
||||||
108
src/css/theme-2022/components/general.less
Executable file
108
src/css/theme-2022/components/general.less
Executable file
@ -0,0 +1,108 @@
|
|||||||
|
html,
|
||||||
|
body {
|
||||||
|
background: @background;
|
||||||
|
color: @on-background;
|
||||||
|
font-size: @font-size-default;
|
||||||
|
font-weight: @font-weight-default;
|
||||||
|
line-height: @font-line-height-default;
|
||||||
|
font-family: "Montserrat", sans-serif;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
overflow-x: hidden;
|
||||||
|
padding: @header-height + 60px 0 0 0;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
padding: @header-height-max-768 0 0 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Body Images
|
||||||
|
|
||||||
|
.body-image-left {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 80rem;
|
||||||
|
|
||||||
|
@media (max-width: 900px) {
|
||||||
|
top: 90rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Lists
|
||||||
|
|
||||||
|
ul {
|
||||||
|
list-style-type: none;
|
||||||
|
padding-left: 15px;
|
||||||
|
|
||||||
|
li {
|
||||||
|
line-height: 30px;
|
||||||
|
padding-left: 0;
|
||||||
|
font-weight: 700;
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
content: "\203A";
|
||||||
|
font-weight: 700;
|
||||||
|
position: absolute;
|
||||||
|
top: -1px;
|
||||||
|
left: -12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Scroll To Top
|
||||||
|
|
||||||
|
.scroll-to-top {
|
||||||
|
position: fixed;
|
||||||
|
z-index: 9999;
|
||||||
|
right: 5rem;
|
||||||
|
bottom: 5rem;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
right: 4rem;
|
||||||
|
bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.circle-top,
|
||||||
|
.circle-email,
|
||||||
|
.circle-contact {
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
border-radius: 100%;
|
||||||
|
background-color: @secondary;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.circle-email {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
background-color: @secondary-light;
|
||||||
|
position: absolute;
|
||||||
|
top: -20px;
|
||||||
|
right: -39px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.circle-contact {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
background-color: @secondary-light-green;
|
||||||
|
position: absolute;
|
||||||
|
top: 23px;
|
||||||
|
right: -53px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Promotion
|
||||||
|
|
||||||
|
.promotion-image-wave-top {
|
||||||
|
height: 70px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.promotion-image-wave-bottom {
|
||||||
|
height: 137px;
|
||||||
|
}
|
||||||
@ -2,7 +2,7 @@
|
|||||||
|
|
||||||
@container_width: 1200px;
|
@container_width: 1200px;
|
||||||
@columns: 12;
|
@columns: 12;
|
||||||
@main_padding: 15px;
|
@main_padding: 20px;
|
||||||
|
|
||||||
// Grid
|
// Grid
|
||||||
|
|
||||||
@ -23,8 +23,8 @@
|
|||||||
@media (min-width: 992px) {
|
@media (min-width: 992px) {
|
||||||
width: 960px;
|
width: 960px;
|
||||||
}
|
}
|
||||||
@media (min-width: 1200px) {
|
@media (min-width: 1240px) {
|
||||||
width: 1140px;
|
width: 1200px;
|
||||||
}
|
}
|
||||||
@media (min-width: 1400px) {
|
@media (min-width: 1400px) {
|
||||||
width: 1320px;
|
width: 1320px;
|
||||||
@ -67,6 +67,10 @@
|
|||||||
justify-content: flex-end;
|
justify-content: flex-end;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
& ~ .row:not(.nospace) {
|
||||||
|
margin-top: @space-lg;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
each(range(@columns), {
|
each(range(@columns), {
|
||||||
162
src/css/theme-2022/components/header.less
Executable file
162
src/css/theme-2022/components/header.less
Executable file
@ -0,0 +1,162 @@
|
|||||||
|
header {
|
||||||
|
position: fixed;
|
||||||
|
width: 100%;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
z-index: 1000;
|
||||||
|
transition: all 1s ease-in-out;
|
||||||
|
height: @header-height;
|
||||||
|
background: rgba(255, 255, 255, 0.9);
|
||||||
|
z-index: 9999;
|
||||||
|
|
||||||
|
@media (max-width: 992px) {
|
||||||
|
background-color: @surface;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
height: @header-height-max-768;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-content {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: flex-start;
|
||||||
|
|
||||||
|
.header-content-right {
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.brand {
|
||||||
|
display: block;
|
||||||
|
margin: @space-md 0;
|
||||||
|
|
||||||
|
@media (max-width: 992px) {
|
||||||
|
width: 80%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.tel-box {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: @space-sm;
|
||||||
|
background: @secondary;
|
||||||
|
color: @on-secondary;
|
||||||
|
font-weight: 700;
|
||||||
|
border-radius: 50px;
|
||||||
|
height: 40px;
|
||||||
|
padding-right: @space-md;
|
||||||
|
margin: @space-md 0 0 auto;
|
||||||
|
text-decoration: none;
|
||||||
|
white-space: nowrap;
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
background: @secondary-light;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 992px) {
|
||||||
|
& {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
&.mobile {
|
||||||
|
display: inline-flex;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
nav {
|
||||||
|
list-style-type: none;
|
||||||
|
margin-top: @space-md;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
align-items: center;
|
||||||
|
gap: @space-md;
|
||||||
|
|
||||||
|
@media (max-width: 992px) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
& > * {
|
||||||
|
text-decoration: none;
|
||||||
|
color: @primary;
|
||||||
|
transition: @transition-default;
|
||||||
|
font-weight: 500;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: @on-background;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-mobile-toggle {
|
||||||
|
display: none;
|
||||||
|
cursor: pointer;
|
||||||
|
margin: @space-md 0 0 auto;
|
||||||
|
|
||||||
|
@media (max-width: 992px) {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
nav.main-mobile {
|
||||||
|
display: none;
|
||||||
|
position: fixed;
|
||||||
|
top: @header-height;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background-color: @surface;
|
||||||
|
z-index: 9999;
|
||||||
|
margin: 0;
|
||||||
|
overflow-y: auto;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
top: @header-height-max-768;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.show {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: flex-start;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-image {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-item {
|
||||||
|
align-self: center;
|
||||||
|
display: block;
|
||||||
|
text-align: center;
|
||||||
|
color: @primary;
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 700;
|
||||||
|
|
||||||
|
a {
|
||||||
|
transition: @transition-default;
|
||||||
|
padding: @space-xs;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: @secondary;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.tel-box {
|
||||||
|
padding: 0 @space-md 0 0;
|
||||||
|
margin-bottom: @space-md;
|
||||||
|
color: @primary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
50
src/css/theme-2022/components/history.less
Normal file
50
src/css/theme-2022/components/history.less
Normal file
@ -0,0 +1,50 @@
|
|||||||
|
.history {
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: 700;
|
||||||
|
|
||||||
|
.history-item {
|
||||||
|
min-height: 80px;
|
||||||
|
|
||||||
|
.date {
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
border-radius: 100%;
|
||||||
|
background-color: @secondary;
|
||||||
|
color: @on-secondary;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
flex-shrink: 0;
|
||||||
|
position: absolute;
|
||||||
|
top: -21px;
|
||||||
|
left: calc(50% - 40px);
|
||||||
|
}
|
||||||
|
.text {
|
||||||
|
width: 41%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:nth-child(odd) {
|
||||||
|
.text {
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
& ~ .history-item {
|
||||||
|
margin-top: @space-md;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 900px) {
|
||||||
|
.date {
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
&:nth-child(odd),
|
||||||
|
&:nth-child(even) {
|
||||||
|
.text {
|
||||||
|
width: 100%;
|
||||||
|
padding-left: 100px;
|
||||||
|
font-size: 0.7em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
9
src/css/theme-2022/components/iframes.less
Normal file
9
src/css/theme-2022/components/iframes.less
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
iframe {
|
||||||
|
width: 100%;
|
||||||
|
max-width: 100%;
|
||||||
|
border: 0;
|
||||||
|
|
||||||
|
&#googleMaps {
|
||||||
|
height: 720px;
|
||||||
|
}
|
||||||
|
}
|
||||||
3
src/css/theme-2022/components/img/check-bold.svg
Normal file
3
src/css/theme-2022/components/img/check-bold.svg
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="m9 20.92-6.21-6.21 2.83-2.83L9 15.27l9.88-9.89 2.83 2.83L9 20.92z" fill="#72EFDD"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 200 B |
|
Before Width: | Height: | Size: 358 B After Width: | Height: | Size: 358 B |
39
src/css/theme-2022/components/img/top-bg.svg
Normal file
39
src/css/theme-2022/components/img/top-bg.svg
Normal file
@ -0,0 +1,39 @@
|
|||||||
|
<svg width="1920" height="1003" viewBox="0 0 1920 1003" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g opacity=".5" clip-rule="evenodd">
|
||||||
|
<path fill-rule="evenodd" d="M0 631.5s14.5 8.71 80 18.5 240 9.424 400-9.79 320-45.531 480-16.71c160 28.821 320 88.786 480 108s320-88.465 400-136.5l80-72.432V28H0v603.5z" fill="url(#s8guwl92ja)"/>
|
||||||
|
<path fill-rule="evenodd" d="M0 631.5s14.5 8.71 80 18.5 240 9.424 400-9.79 320-45.531 480-16.71c160 28.821 320 88.786 480 108s320-88.465 400-136.5l80-72.432V28H0v603.5z" fill="url(#d44dn5xirb)"/>
|
||||||
|
</g>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="m0 553.568 80 19.214c80 19.214 240 57.642 400 38.428 160-19.214 320-28.821 480 0s320 36.07 480 55.284 320-76.856 400-124.891l80-48.035V-1H0v554.568z" fill="url(#dzvpq96n6c)"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="m0 553.568 80 19.214c80 19.214 240 57.642 400 38.428 160-19.214 320-28.821 480 0s320 36.07 480 55.284 320-76.856 400-124.891l80-48.035V-1H0v554.568z" fill="url(#qmmqrfmedd)"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="m0 553.568 80 19.214c80 19.214 240 57.642 400 38.428 160-19.214 320-28.821 480 0s320 36.07 480 55.284 320-76.856 400-124.891l80-48.035V-1H0v554.568z" fill="url(#m8la3ielte)"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="m0 553.568 80 19.214c80 19.214 240 57.642 400 38.428 160-19.214 320-28.821 480 0s320 36.07 480 55.284 320-76.856 400-124.891l80-48.035V-1H0v554.568z" fill="url(#eyw4yzjlhf)"/>
|
||||||
|
<g opacity=".7" stroke="#72EFDD" stroke-width="2" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="0.3 0.3">
|
||||||
|
<path opacity=".7" d="m1135.97 730.546 423.2-439.715M1139.36 766.411l449.79-468.108M1152.96 791.375l462.52-481.691M1172.07 810.457l472.86-492.746M1186.97 834.023l487.67-508.552M1204.48 854.829l501.7-523.534M1221.84 875.77l508.48-530.757M1239.24 896.672l520.62-543.709M1257.19 917l526.69-550.204M1273.01 939.569l530.9-554.668M1290.99 959.877l535.48-559.572M1310.07 978.979l538.63-562.925M1326.14 1001.32l519.61-542.638"/>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<radialGradient id="s8guwl92ja" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(960 0 0 203 960 495)">
|
||||||
|
<stop stop-color="#FFFEFF"/>
|
||||||
|
<stop offset="1" stop-color="#D7FFFE"/>
|
||||||
|
</radialGradient>
|
||||||
|
<radialGradient id="d44dn5xirb" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(-165.326 550.678 196.962) scale(675.018 3192.21)">
|
||||||
|
<stop stop-color="#BCFFFD"/>
|
||||||
|
<stop offset="1" stop-color="#fff" stop-opacity="0"/>
|
||||||
|
</radialGradient>
|
||||||
|
<radialGradient id="dzvpq96n6c" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(960 0 0 203 960 466)">
|
||||||
|
<stop stop-color="#FFFEFF"/>
|
||||||
|
<stop offset="1" stop-color="#D7FFFE"/>
|
||||||
|
</radialGradient>
|
||||||
|
<radialGradient id="qmmqrfmedd" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="rotate(-165.326 548.81 182.462) scale(675.018 3192.21)">
|
||||||
|
<stop stop-color="#BCFFFD"/>
|
||||||
|
<stop offset="1" stop-color="#fff" stop-opacity="0"/>
|
||||||
|
</radialGradient>
|
||||||
|
<radialGradient id="m8la3ielte" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(816.00191 594.50235 -1703.6414 2338.38377 494.5 132)">
|
||||||
|
<stop stop-color="#fff"/>
|
||||||
|
<stop offset="1" stop-color="#fff" stop-opacity="0"/>
|
||||||
|
</radialGradient>
|
||||||
|
<linearGradient id="eyw4yzjlhf" x1="960" y1="-1" x2="960" y2="669" gradientUnits="userSpaceOnUse">
|
||||||
|
<stop offset=".083" stop-color="#fff"/>
|
||||||
|
<stop offset=".333" stop-color="#fff" stop-opacity="0"/>
|
||||||
|
</linearGradient>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.7 KiB |
19
src/css/theme-2022/components/img/union.svg
Normal file
19
src/css/theme-2022/components/img/union.svg
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
<svg viewBox="0 0 1920 1060" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M80 20.91 0 0v1017.38h80c80 0 240 0 400-6.97 53.333-2.32 106.667-5.42 160-8.52 106.667-6.195 213.333-12.39 320-12.39 160 0 320 13.94 480 27.88l480 41.82V62.728l-80 6.97c-80 6.97-240 20.909-400 13.94-64-2.789-128-8.922-192-15.055-96-9.2-192-18.4-288-16.31-72 1.569-144 9.488-216 17.407-88 9.68-176 19.359-264 17.442C320 83.637 160 41.82 80 20.91z" fill="url(#9fz5hy4h1a)"/>
|
||||||
|
<path d="M80 20.91 0 0v1017.38h80c80 0 240 0 400-6.97 53.333-2.32 106.667-5.42 160-8.52 106.667-6.195 213.333-12.39 320-12.39 160 0 320 13.94 480 27.88l480 41.82V62.728l-80 6.97c-80 6.97-240 20.909-400 13.94-64-2.789-128-8.922-192-15.055-96-9.2-192-18.4-288-16.31-72 1.569-144 9.488-216 17.407-88 9.68-176 19.359-264 17.442C320 83.637 160 41.82 80 20.91z" fill="url(#e1z5hwatsb)"/>
|
||||||
|
<path d="M80 20.91 0 0v1017.38h80c80 0 240 0 400-6.97 53.333-2.32 106.667-5.42 160-8.52 106.667-6.195 213.333-12.39 320-12.39 160 0 320 13.94 480 27.88l480 41.82V62.728l-80 6.97c-80 6.97-240 20.909-400 13.94-64-2.789-128-8.922-192-15.055-96-9.2-192-18.4-288-16.31-72 1.569-144 9.488-216 17.407-88 9.68-176 19.359-264 17.442C320 83.637 160 41.82 80 20.91z" fill="url(#nign7co5vc)"/>
|
||||||
|
<defs>
|
||||||
|
<radialGradient id="9fz5hy4h1a" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(960 0 0 212.392 960 488.607)">
|
||||||
|
<stop stop-color="#FFFEFF"/>
|
||||||
|
<stop offset="1" stop-color="#D7FFFE"/>
|
||||||
|
</radialGradient>
|
||||||
|
<radialGradient id="e1z5hwatsb" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(-653.00038 -178.91022 879.8803 -3211.45532 1033.5 522.084)">
|
||||||
|
<stop stop-color="#BCFFFD"/>
|
||||||
|
<stop offset="1" stop-color="#fff" stop-opacity="0"/>
|
||||||
|
</radialGradient>
|
||||||
|
<radialGradient id="nign7co5vc" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(816.0031 622.01048 -1805.66361 2368.81393 494.5 139.154)">
|
||||||
|
<stop stop-color="#fff"/>
|
||||||
|
<stop offset="1" stop-color="#fff" stop-opacity="0"/>
|
||||||
|
</radialGradient>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 2.1 KiB |
@ -1,8 +1,8 @@
|
|||||||
@space-xs: 0.25rem;
|
@space-xs: 0.6rem;
|
||||||
@space-sm: 0.5rem;
|
@space-sm: 1rem;
|
||||||
@space-md: 1rem;
|
@space-md: 1.6rem;
|
||||||
@space-lg: 2rem;
|
@space-lg: 2.5rem;
|
||||||
@space-xl: 3rem;
|
@space-xl: 4rem;
|
||||||
|
|
||||||
.layout {
|
.layout {
|
||||||
display: flex;
|
display: flex;
|
||||||
19
src/css/theme-2022/components/news.less
Normal file
19
src/css/theme-2022/components/news.less
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
.news {
|
||||||
|
article {
|
||||||
|
background: @surface;
|
||||||
|
color: @on-surface;
|
||||||
|
padding: @space-sm @space-md;
|
||||||
|
border-radius: 10px;
|
||||||
|
box-shadow: 0 10px 40px 0 rgba(0, 0, 0, 0.1);
|
||||||
|
margin-bottom: @space-lg;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-weight: 700;
|
||||||
|
margin-bottom: @space-xs;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
12
src/css/theme-2022/components/promotion-image.less
Normal file
12
src/css/theme-2022/components/promotion-image.less
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
.promotion-image-wave-top,
|
||||||
|
.promotion-image-wave-bottom {
|
||||||
|
z-index: 2;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.promotion-image {
|
||||||
|
z-index: 0;
|
||||||
|
margin-top: -56px;
|
||||||
|
margin-bottom: -68px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
7
src/css/theme-2022/components/section.less
Normal file
7
src/css/theme-2022/components/section.less
Normal file
@ -0,0 +1,7 @@
|
|||||||
|
section,
|
||||||
|
.section {
|
||||||
|
& ~ section,
|
||||||
|
& ~ .section {
|
||||||
|
margin-top: 4rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
52
src/css/theme-2022/components/services.less
Normal file
52
src/css/theme-2022/components/services.less
Normal file
@ -0,0 +1,52 @@
|
|||||||
|
.services {
|
||||||
|
article {
|
||||||
|
font-weight: 700;
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-start;
|
||||||
|
gap: @space-sm;
|
||||||
|
margin-bottom: @space-xs;
|
||||||
|
padding: @space-sm @space-md;
|
||||||
|
border-radius: 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: @surface;
|
||||||
|
color: @on-surface;
|
||||||
|
box-shadow: 0 10px 40px 0 rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
border-radius: 100%;
|
||||||
|
background-color: @secondary-light;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
img {
|
||||||
|
height: 32px;
|
||||||
|
margin-top: 2px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: 700;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: transparent;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
79
src/css/theme-2022/components/specials.less
Normal file
79
src/css/theme-2022/components/specials.less
Normal file
@ -0,0 +1,79 @@
|
|||||||
|
.specials {
|
||||||
|
article {
|
||||||
|
background: @surface;
|
||||||
|
color: @on-surface;
|
||||||
|
padding: @space-md;
|
||||||
|
border-radius: 10px;
|
||||||
|
box-shadow: 0 10px 40px 0 rgba(0, 0, 0, 0.1);
|
||||||
|
margin-bottom: @space-lg;
|
||||||
|
font-weight: 700;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-start;
|
||||||
|
align-items: center;
|
||||||
|
gap: @space-md;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
flex-direction: column;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
flex-shrink: 0;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
margin-bottom: @space-xs;
|
||||||
|
font-size: 24px;
|
||||||
|
line-height: 1.3;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.hovered {
|
||||||
|
display: none;
|
||||||
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
display: flex;
|
||||||
|
position: fixed;
|
||||||
|
top: 40%;
|
||||||
|
left: 30%;
|
||||||
|
right: 30%;
|
||||||
|
z-index: 999;
|
||||||
|
box-shadow: inset 0 0 2px 1px white, 0 10px 40px 0 rgba(0, 0, 0, 0.1), 0 10px 40px 0 rgba(0, 0, 0, 0.1);
|
||||||
|
background: linear-gradient(
|
||||||
|
90deg,
|
||||||
|
rgba(238, 254, 255, 1) 0%,
|
||||||
|
rgba(255, 254, 255, 1) 35%,
|
||||||
|
rgba(215, 255, 254, 1) 100%
|
||||||
|
),
|
||||||
|
radial-gradient(88.73% 230.98% at 25.76% 13.14%, #ffffff 0%, rgba(255, 255, 255, 0) 100%),
|
||||||
|
radial-gradient(50% 20.05% at 50% 46.13%, #fffeff 0%, #d7fffe 100%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.row:nth-child(2) > *:nth-child(2) > article:first-child {
|
||||||
|
margin-top: @space-xl;
|
||||||
|
|
||||||
|
@media (max-width: 1050px) {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
50
src/css/theme-2022/components/top-section.less
Normal file
50
src/css/theme-2022/components/top-section.less
Normal file
@ -0,0 +1,50 @@
|
|||||||
|
.top-section {
|
||||||
|
height: 1003px;
|
||||||
|
margin-bottom: -28rem;
|
||||||
|
|
||||||
|
@media (max-width: 1050px) {
|
||||||
|
margin-bottom: 0rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text {
|
||||||
|
margin-top: @space-xl;
|
||||||
|
|
||||||
|
strong {
|
||||||
|
color: @secondary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.top-section-bg {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
height: 64rem;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.circles {
|
||||||
|
position: absolute;
|
||||||
|
top: -151px;
|
||||||
|
left: -97px;
|
||||||
|
min-width: 986px;
|
||||||
|
|
||||||
|
@media (max-width: 1049px) {
|
||||||
|
top: -151px;
|
||||||
|
left: -97px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.circles-image {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 70px;
|
||||||
|
min-width: 550px;
|
||||||
|
|
||||||
|
@media (max-width: 1240px) {
|
||||||
|
min-width: 652px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
51
src/css/theme-2022/components/typo.less
Normal file
51
src/css/theme-2022/components/typo.less
Normal file
@ -0,0 +1,51 @@
|
|||||||
|
// Headlines
|
||||||
|
|
||||||
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
|
color: @primary;
|
||||||
|
font-weight: 700;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 48px;
|
||||||
|
margin-bottom: @space-md;
|
||||||
|
line-height: @space-xl;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
font-size: 32px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: 48px;
|
||||||
|
margin-bottom: @space-md;
|
||||||
|
line-height: @space-xl;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
font-size: 28px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
font-size: 24px;
|
||||||
|
margin-bottom: @space-sm;
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Link
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: @on-background;
|
||||||
|
}
|
||||||
57
src/css/theme-2022/main.less
Normal file
57
src/css/theme-2022/main.less
Normal file
@ -0,0 +1,57 @@
|
|||||||
|
// Variables
|
||||||
|
|
||||||
|
@background: #fff;
|
||||||
|
@on-background: #575756;
|
||||||
|
|
||||||
|
@primary: #2d8e91;
|
||||||
|
@on-primary: #fff;
|
||||||
|
|
||||||
|
@secondary: #72efdd;
|
||||||
|
@on-secondary: #2d8e91;
|
||||||
|
@secondary-light: #dafbf7;
|
||||||
|
@on-secondary-light: @on-secondary;
|
||||||
|
@secondary-light-green: #e2fbf0;
|
||||||
|
@on-secondary-light-green: @on-secondary;
|
||||||
|
|
||||||
|
@surface: #fff;
|
||||||
|
@on-surface: #575756;
|
||||||
|
|
||||||
|
@error: #fff0e9;
|
||||||
|
@on-error: #eb5757;
|
||||||
|
|
||||||
|
@font-size-default: 16px;
|
||||||
|
@font-weight-default: 400;
|
||||||
|
@font-line-height-default: 1.6;
|
||||||
|
|
||||||
|
@radius-default: 50px;
|
||||||
|
|
||||||
|
@transition-default: all 0.2s ease-in-out;
|
||||||
|
|
||||||
|
// Header
|
||||||
|
|
||||||
|
@header-height: 140px;
|
||||||
|
@header-height-max-768: 100px;
|
||||||
|
|
||||||
|
// CSS Definitions
|
||||||
|
|
||||||
|
@import "fonts";
|
||||||
|
@import "reset";
|
||||||
|
|
||||||
|
@import "components/general";
|
||||||
|
@import "components/grid";
|
||||||
|
@import "components/typo";
|
||||||
|
@import "components/layout";
|
||||||
|
@import "components/section";
|
||||||
|
@import "components/header";
|
||||||
|
@import "components/footer";
|
||||||
|
@import "components/news";
|
||||||
|
@import "components/services";
|
||||||
|
@import "components/specials";
|
||||||
|
@import "components/iframes";
|
||||||
|
@import "components/contact-information";
|
||||||
|
@import "components/promotion-image";
|
||||||
|
@import "components/history";
|
||||||
|
@import "components/top-section";
|
||||||
|
@import "components/forms";
|
||||||
|
|
||||||
|
@import "components/cc-bar";
|
||||||
@ -1,8 +0,0 @@
|
|||||||
.appointment {
|
|
||||||
background: @secondary;
|
|
||||||
color: @on-secondary;
|
|
||||||
border-radius: 50px;
|
|
||||||
font-size: 18px;
|
|
||||||
text-align: center;
|
|
||||||
padding: @space-xs @space-sm;
|
|
||||||
}
|
|
||||||
@ -1,14 +0,0 @@
|
|||||||
footer {
|
|
||||||
padding: 20px 0;
|
|
||||||
color: @secondary;
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: @secondary;
|
|
||||||
}
|
|
||||||
|
|
||||||
.wave {
|
|
||||||
height: 54px;
|
|
||||||
background-repeat: repeat-x;
|
|
||||||
background-image: url("../css/theme/components/img/wave_footer_top.png");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,46 +0,0 @@
|
|||||||
form {
|
|
||||||
input,
|
|
||||||
textarea {
|
|
||||||
border: 1px solid @secondary;
|
|
||||||
background: #fff;
|
|
||||||
color: @on-background;
|
|
||||||
padding: @space-md;
|
|
||||||
width: 100%;
|
|
||||||
max-width: 100%;
|
|
||||||
border-radius: @space-sm;
|
|
||||||
transition: all 0.2s ease-in-out;
|
|
||||||
|
|
||||||
&[readonly] {
|
|
||||||
opacity: 0.5;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
textarea {
|
|
||||||
height: 200px;
|
|
||||||
}
|
|
||||||
|
|
||||||
button {
|
|
||||||
background: @primary;
|
|
||||||
color: @on-primary;
|
|
||||||
padding: @space-md @space-lg;
|
|
||||||
border: 1px solid @primary;
|
|
||||||
border-radius: @space-sm;
|
|
||||||
transition: all 0.2s ease-in-out;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
border: 1px solid #fff;
|
|
||||||
box-shadow: 0 0 0.4rem 0 rgba(0, 0, 0, 0.5);
|
|
||||||
}
|
|
||||||
|
|
||||||
&[disabled] {
|
|
||||||
opacity: 0.5;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.error {
|
|
||||||
background: @error;
|
|
||||||
color: @on-error;
|
|
||||||
padding: @space-md;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,16 +0,0 @@
|
|||||||
html,
|
|
||||||
body {
|
|
||||||
background: @background;
|
|
||||||
color: @on-background;
|
|
||||||
font-size: @font-size-default;
|
|
||||||
font-weight: @font-weight-default;
|
|
||||||
font-family: "Nunito", sans-serif;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
|
||||||
&.rounded {
|
|
||||||
border-radius: @radius-half;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,127 +0,0 @@
|
|||||||
header {
|
|
||||||
position: fixed;
|
|
||||||
width: 100%;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
z-index: 1000;
|
|
||||||
transition: all 1s ease-in-out;
|
|
||||||
|
|
||||||
.brand {
|
|
||||||
margin-top: -@space-md;
|
|
||||||
|
|
||||||
@media (max-width: 992px) {
|
|
||||||
display: block;
|
|
||||||
height: 100px;
|
|
||||||
margin: @space-md 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 768px) {
|
|
||||||
display: block;
|
|
||||||
height: 60px;
|
|
||||||
margin: @space-md 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: auto;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.service-bar {
|
|
||||||
background-color: @primary;
|
|
||||||
color: @on-primary;
|
|
||||||
border-bottom-left-radius: @radius-default;
|
|
||||||
border-bottom-right-radius: @radius-default;
|
|
||||||
height: 29px;
|
|
||||||
line-height: 29px;
|
|
||||||
padding: 0 20px;
|
|
||||||
|
|
||||||
@media (max-width: 992px) {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
nav {
|
|
||||||
ul {
|
|
||||||
padding: 0 20px;
|
|
||||||
margin-top: 50px;
|
|
||||||
list-style: none;
|
|
||||||
transition: all 1s ease-in-out;
|
|
||||||
|
|
||||||
li {
|
|
||||||
a {
|
|
||||||
font-size: 20px;
|
|
||||||
color: #fff;
|
|
||||||
font-weight: 700;
|
|
||||||
text-decoration: none;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: @primary;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.active {
|
|
||||||
color: @primary;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.show {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.scroll {
|
|
||||||
background: rgba(0, 0, 0, 0.7);
|
|
||||||
padding-bottom: @space-lg;
|
|
||||||
|
|
||||||
@media (max-width: 992px) {
|
|
||||||
padding-bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 992px) {
|
|
||||||
background: rgba(0, 0, 0, 0.7);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.top-article {
|
|
||||||
.wave-bottom {
|
|
||||||
height: 200px;
|
|
||||||
margin-top: -33px;
|
|
||||||
background-image: url("../css/theme/components/img/wave_header_bottom.png");
|
|
||||||
background-repeat: repeat-x;
|
|
||||||
}
|
|
||||||
|
|
||||||
& > .articles {
|
|
||||||
z-index: 1;
|
|
||||||
margin-right: 120px;
|
|
||||||
margin-left: 120px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-around;
|
|
||||||
align-items: stretch;
|
|
||||||
gap: @space-lg;
|
|
||||||
margin-top: -80px;
|
|
||||||
margin-bottom: -120px;
|
|
||||||
|
|
||||||
article {
|
|
||||||
width: 33%;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 1200px) {
|
|
||||||
flex-direction: column;
|
|
||||||
margin-right: @space-xl;
|
|
||||||
margin-left: @space-xl;
|
|
||||||
|
|
||||||
article {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
*[class^="col"] {
|
|
||||||
margin-top: @space-md;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 2.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.1 KiB |
@ -1,46 +0,0 @@
|
|||||||
a {
|
|
||||||
color: @on-background;
|
|
||||||
text-decoration: none;
|
|
||||||
transition: @transition-default;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: @primary;
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: @primary;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1,
|
|
||||||
.h1,
|
|
||||||
h2,
|
|
||||||
.h2,
|
|
||||||
h3,
|
|
||||||
.h3,
|
|
||||||
h4,
|
|
||||||
.h4,
|
|
||||||
h5,
|
|
||||||
.h5,
|
|
||||||
h6,
|
|
||||||
.h6 {
|
|
||||||
color: @primary;
|
|
||||||
font-weight: 700;
|
|
||||||
line-height: 1.2;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1,
|
|
||||||
.h1 {
|
|
||||||
font-size: 32px;
|
|
||||||
}
|
|
||||||
|
|
||||||
h2,
|
|
||||||
.h2 {
|
|
||||||
font-size: 24px;
|
|
||||||
}
|
|
||||||
|
|
||||||
h3,
|
|
||||||
.h3 {
|
|
||||||
font-size: 24px;
|
|
||||||
}
|
|
||||||
@ -1,46 +0,0 @@
|
|||||||
// Variables
|
|
||||||
|
|
||||||
@background: #f1ebe4;
|
|
||||||
@on-background: #352a1c;
|
|
||||||
|
|
||||||
@primary: #c4253e;
|
|
||||||
@on-primary: #fff;
|
|
||||||
|
|
||||||
@secondary: #bda082;
|
|
||||||
@on-secondary: #fff;
|
|
||||||
|
|
||||||
@surface: #fff;
|
|
||||||
@on-surface: #352a1c;
|
|
||||||
|
|
||||||
@error: @primary;
|
|
||||||
@on-error: #fff;
|
|
||||||
|
|
||||||
@font-size-default: 14px;
|
|
||||||
@font-weight-default: 400;
|
|
||||||
|
|
||||||
@radius-default: 25px;
|
|
||||||
@radius-half: 12px;
|
|
||||||
|
|
||||||
@transition-default: all 0.2s ease-in-out;
|
|
||||||
|
|
||||||
// CSS Definitions
|
|
||||||
|
|
||||||
@import "fonts";
|
|
||||||
@import "reset";
|
|
||||||
|
|
||||||
@import "components/general";
|
|
||||||
@import "components/typo";
|
|
||||||
@import "components/layout";
|
|
||||||
@import "components/grid";
|
|
||||||
@import "components/content";
|
|
||||||
@import "components/sidebar";
|
|
||||||
@import "components/article";
|
|
||||||
@import "components/event";
|
|
||||||
@import "components/header";
|
|
||||||
@import "components/footer";
|
|
||||||
@import "components/carousel";
|
|
||||||
@import "components/navigation";
|
|
||||||
@import "components/appointment";
|
|
||||||
@import "components/cc-bar";
|
|
||||||
@import "components/audio";
|
|
||||||
@import "components/forms";
|
|
||||||
31
src/store.ts
31
src/store.ts
@ -1,5 +1,5 @@
|
|||||||
import { writable, get } from "svelte/store"
|
import { writable, get } from "svelte/store"
|
||||||
import { getGeneralInformation, getArticles } from "./api"
|
import { getGeneralInformation, getArticles, getNavigations } from "./api"
|
||||||
|
|
||||||
const initLoc = {
|
const initLoc = {
|
||||||
path: (typeof window !== "undefined" && window.location?.pathname) || "/",
|
path: (typeof window !== "undefined" && window.location?.pathname) || "/",
|
||||||
@ -10,25 +10,40 @@ const initLoc = {
|
|||||||
|
|
||||||
export const location = writable(initLoc)
|
export const location = writable(initLoc)
|
||||||
|
|
||||||
|
const locale = {
|
||||||
|
key: "de",
|
||||||
|
title: "Deutsch",
|
||||||
|
}
|
||||||
|
export const currentLocale = writable(locale)
|
||||||
|
|
||||||
// General Information
|
// General Information
|
||||||
|
|
||||||
export const generalInformation = writable<GeneralInformation>()
|
export const generalInfo = writable<GeneralInfo>()
|
||||||
const getGeneralProjectInformation = async () => {
|
const getGeneralProjectInformation = async () => {
|
||||||
const infos = await getGeneralInformation()
|
const infos = await getGeneralInformation()
|
||||||
if (infos && infos.length) {
|
if (infos && infos.length) {
|
||||||
generalInformation.set(infos[0])
|
generalInfo.set(infos[0])
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
getGeneralProjectInformation()
|
getGeneralProjectInformation()
|
||||||
|
|
||||||
// Articles
|
// Articles
|
||||||
|
|
||||||
export const articles = writable<TibiArticle[]>()
|
// export const articles = writable<TibiArticle[]>()
|
||||||
const getAllArticles = async () => {
|
// const getAllArticles = async () => {
|
||||||
const list = await getArticles()
|
// const list = await getArticles()
|
||||||
articles.set(list)
|
// articles.set(list)
|
||||||
|
// }
|
||||||
|
// getAllArticles()
|
||||||
|
|
||||||
|
// Navigations
|
||||||
|
|
||||||
|
export const navigations = writable<Navigation[]>([])
|
||||||
|
const getAllNavigations = async (locale: Locale) => {
|
||||||
|
const list = await getNavigations(locale)
|
||||||
|
navigations.set(list)
|
||||||
}
|
}
|
||||||
getAllArticles()
|
getAllNavigations(locale)
|
||||||
|
|
||||||
// Cookies - Webmakers Cookie Bar
|
// Cookies - Webmakers Cookie Bar
|
||||||
|
|
||||||
|
|||||||
88
types/global.d.ts
vendored
88
types/global.d.ts
vendored
@ -1,3 +1,12 @@
|
|||||||
|
interface APIParams {
|
||||||
|
offset?: number
|
||||||
|
limit?: number
|
||||||
|
sort?: string | "ASC" | "DESC"
|
||||||
|
filter?: {
|
||||||
|
[key: string]: any
|
||||||
|
}
|
||||||
|
count?: 1
|
||||||
|
}
|
||||||
interface ContentBlock {
|
interface ContentBlock {
|
||||||
layout: 1 | 2 | 3 | 4
|
layout: 1 | 2 | 3 | 4
|
||||||
title?: string
|
title?: string
|
||||||
@ -10,31 +19,46 @@ interface ContentBlock {
|
|||||||
|
|
||||||
interface Content {
|
interface Content {
|
||||||
id: string
|
id: string
|
||||||
|
name: string
|
||||||
path: string
|
path: string
|
||||||
blocks: ContentBlock[]
|
blocks: ContentBlock[]
|
||||||
}
|
}
|
||||||
|
|
||||||
interface GeneralInformation {
|
interface GeneralInfo {
|
||||||
id: string
|
id: string
|
||||||
active: boolean
|
public: boolean
|
||||||
|
meta: {
|
||||||
|
metaTitle: string
|
||||||
|
metaDescription: string
|
||||||
|
metaTagRobots: string
|
||||||
|
metaKeywords: string
|
||||||
|
}
|
||||||
|
person: {
|
||||||
|
salutation: string
|
||||||
firstname: string
|
firstname: string
|
||||||
lastname: string
|
lastname: string
|
||||||
|
additional: string
|
||||||
street: string
|
street: string
|
||||||
postcode: number
|
postcode: number
|
||||||
city: string
|
city: string
|
||||||
tel: string
|
tel: string
|
||||||
|
fax: string
|
||||||
mobile: string
|
mobile: string
|
||||||
email: string
|
email: string
|
||||||
images: GeneralImage[]
|
}
|
||||||
|
media: {
|
||||||
|
favicon: File
|
||||||
|
brand: File
|
||||||
|
mediaFiles: {
|
||||||
|
title: string
|
||||||
|
alternateText: string
|
||||||
|
id: string
|
||||||
|
file: File
|
||||||
|
}[]
|
||||||
|
}
|
||||||
|
copyrightText: string
|
||||||
insertTime: string
|
insertTime: string
|
||||||
updateTime: string
|
updateTime: string
|
||||||
lastPageUpdate: string
|
|
||||||
}
|
|
||||||
|
|
||||||
interface GeneralImage {
|
|
||||||
file: File[]
|
|
||||||
id: string
|
|
||||||
label: string
|
|
||||||
}
|
}
|
||||||
|
|
||||||
interface TibiArticle {
|
interface TibiArticle {
|
||||||
@ -57,3 +81,47 @@ interface File {
|
|||||||
src: string
|
src: string
|
||||||
type: string
|
type: string
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface Gallery {
|
||||||
|
id: string
|
||||||
|
title: string
|
||||||
|
variant: string
|
||||||
|
items: {
|
||||||
|
file: File
|
||||||
|
title: string
|
||||||
|
descrition: string
|
||||||
|
alt: string
|
||||||
|
}[]
|
||||||
|
}
|
||||||
|
|
||||||
|
interface Navigation {
|
||||||
|
id: string
|
||||||
|
ident: string
|
||||||
|
locale: string
|
||||||
|
items: NavigationItem[]
|
||||||
|
insertTime: string
|
||||||
|
updateTime: string
|
||||||
|
}
|
||||||
|
|
||||||
|
interface NavigationItem {
|
||||||
|
settings: {
|
||||||
|
title: string
|
||||||
|
page: string
|
||||||
|
items: NavigationItem[]
|
||||||
|
url: {
|
||||||
|
url: string
|
||||||
|
target: string
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
interface Locale {
|
||||||
|
key: string
|
||||||
|
title: string
|
||||||
|
}
|
||||||
|
|
||||||
|
interface GeneralImage {
|
||||||
|
file: File[]
|
||||||
|
id: string
|
||||||
|
label: string
|
||||||
|
}
|
||||||
|
|||||||
16
yarn.lock
16
yarn.lock
@ -2621,6 +2621,13 @@ __metadata:
|
|||||||
languageName: node
|
languageName: node
|
||||||
linkType: hard
|
linkType: hard
|
||||||
|
|
||||||
|
"@mdi/js@npm:^6.7.96":
|
||||||
|
version: 6.7.96
|
||||||
|
resolution: "@mdi/js@npm:6.7.96"
|
||||||
|
checksum: 8c8f6acb8fd3f856a92ffe2405e258ee5aa84cf541fda1c0a564c9c8bbf935cf2b6a6100cf97d41e9ada1ccb59e4b138d4c712e075f759d7595e21ef1cff84b5
|
||||||
|
languageName: node
|
||||||
|
linkType: hard
|
||||||
|
|
||||||
"@nicolo-ribaudo/chokidar-2@npm:2.1.8-no-fsevents.3":
|
"@nicolo-ribaudo/chokidar-2@npm:2.1.8-no-fsevents.3":
|
||||||
version: 2.1.8-no-fsevents.3
|
version: 2.1.8-no-fsevents.3
|
||||||
resolution: "@nicolo-ribaudo/chokidar-2@npm:2.1.8-no-fsevents.3"
|
resolution: "@nicolo-ribaudo/chokidar-2@npm:2.1.8-no-fsevents.3"
|
||||||
@ -7650,6 +7657,13 @@ __metadata:
|
|||||||
languageName: node
|
languageName: node
|
||||||
linkType: hard
|
linkType: hard
|
||||||
|
|
||||||
|
"mdi-svelte@npm:^1.1.2":
|
||||||
|
version: 1.1.2
|
||||||
|
resolution: "mdi-svelte@npm:1.1.2"
|
||||||
|
checksum: ee86a87e31cd8f7f376e79f5ea40cb9382ff79a2aa57540133d3da96ad8b876258ab30fee27645cc9e3220e53de0d087c65278cc453d09455c3eb03fb79a4a8b
|
||||||
|
languageName: node
|
||||||
|
linkType: hard
|
||||||
|
|
||||||
"memory-pager@npm:^1.0.2":
|
"memory-pager@npm:^1.0.2":
|
||||||
version: 1.5.0
|
version: 1.5.0
|
||||||
resolution: "memory-pager@npm:1.5.0"
|
resolution: "memory-pager@npm:1.5.0"
|
||||||
@ -10324,6 +10338,7 @@ send@latest:
|
|||||||
"@babel/plugin-transform-spread": ^7.16.7
|
"@babel/plugin-transform-spread": ^7.16.7
|
||||||
"@babel/preset-env": ^7.16.11
|
"@babel/preset-env": ^7.16.11
|
||||||
"@cypress/code-coverage": ^3.9.12
|
"@cypress/code-coverage": ^3.9.12
|
||||||
|
"@mdi/js": ^6.7.96
|
||||||
"@sentry/browser": ^6.19.6
|
"@sentry/browser": ^6.19.6
|
||||||
"@sentry/tracing": ^6.19.6
|
"@sentry/tracing": ^6.19.6
|
||||||
"@tsconfig/svelte": ^3.0.0
|
"@tsconfig/svelte": ^3.0.0
|
||||||
@ -10341,6 +10356,7 @@ send@latest:
|
|||||||
http-proxy-middleware: ^2.0.6
|
http-proxy-middleware: ^2.0.6
|
||||||
less: ^4.1.2
|
less: ^4.1.2
|
||||||
live-server: ^1.2.1
|
live-server: ^1.2.1
|
||||||
|
mdi-svelte: ^1.1.2
|
||||||
mongodb: ^4.5.0
|
mongodb: ^4.5.0
|
||||||
morgan: ^1.10.0
|
morgan: ^1.10.0
|
||||||
postcss: ^8.4.12
|
postcss: ^8.4.12
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user