simple remark plugin
This commit is contained in:
@@ -4,11 +4,9 @@
|
||||
import { scrollToTop } from "svelte-scrollto"
|
||||
import { location } from "../store"
|
||||
|
||||
import Home from "./routes/Home.svelte"
|
||||
import Content from "./routes/Content.svelte"
|
||||
|
||||
import Header from "./widgets/Header.svelte"
|
||||
import Footer from "./widgets/Footer.svelte"
|
||||
import Content from "./widgets/Content.svelte"
|
||||
|
||||
export let url = ""
|
||||
|
||||
@@ -35,7 +33,7 @@
|
||||
|
||||
<Router url="{url}">
|
||||
<Route path="/" let:params>
|
||||
<Home />
|
||||
<h1>Home</h1>
|
||||
</Route>
|
||||
<Route path="/*path" let:params>
|
||||
<Content path="{params.path}" />
|
||||
|
||||
@@ -1,9 +0,0 @@
|
||||
<script lang="ts">
|
||||
import details from "./../widgets/details"
|
||||
|
||||
export let entry: TibiArticle
|
||||
</script>
|
||||
|
||||
{#if entry}
|
||||
<svelte:component this="{details[entry?.article?.general?.type] || details.default}" entry="{entry}" />
|
||||
{/if}
|
||||
@@ -1,211 +0,0 @@
|
||||
<script lang="ts">
|
||||
import { _ } from "svelte-i18n"
|
||||
import { getContent, getArticles } from "../../api"
|
||||
import { generalInfo, currentLang, location } from "../../store"
|
||||
import { navigate } from "svelte-routing"
|
||||
|
||||
import ArticlesList from "../widgets/ArticlesList.svelte"
|
||||
import ArticleDetails from "../routes/ArticleDetails.svelte"
|
||||
|
||||
export let path: string
|
||||
|
||||
let loading = true
|
||||
let content: Content
|
||||
let article: TibiArticle
|
||||
let connectedContentNotFound: boolean = false
|
||||
|
||||
const loadContent = (type?: string) => {
|
||||
// Set default API call filter
|
||||
let filter = {
|
||||
locale: $currentLang,
|
||||
path,
|
||||
}
|
||||
|
||||
// API call filter without locale if URL changed
|
||||
if (path !== content?.path) {
|
||||
delete filter.locale
|
||||
}
|
||||
|
||||
// Changed filter to find simmilar content for changed language
|
||||
if (type === "changedLanguage" && content?.pages) {
|
||||
filter = {
|
||||
_id: { $in: content?.pages },
|
||||
locale: $currentLang,
|
||||
}
|
||||
delete filter.path
|
||||
}
|
||||
|
||||
// Get content by API call
|
||||
let apiParams: APIParams = {
|
||||
filter,
|
||||
}
|
||||
|
||||
loading = true
|
||||
getContent(apiParams)
|
||||
.then((c) => {
|
||||
if (c) {
|
||||
if (type === "changedLanguage") {
|
||||
let newPath = c.path + $location.search
|
||||
window.history.pushState({}, document.getElementsByTagName("title")[0].innerHTML, newPath + "/")
|
||||
path = newPath
|
||||
}
|
||||
|
||||
connectedContentNotFound = false
|
||||
content = c
|
||||
} else {
|
||||
// Show message if not found simmilar content for changed language
|
||||
if (filter.tags) {
|
||||
connectedContentNotFound = true
|
||||
}
|
||||
content = null
|
||||
}
|
||||
|
||||
// Redirect to HOME if no content has been found. So the page 404 content will never shown.
|
||||
if (!content) {
|
||||
navigate("/")
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
loading = false
|
||||
})
|
||||
}
|
||||
|
||||
const loadArticle = (type?: string) => {
|
||||
let pathParts = path.split("/")
|
||||
let slug = pathParts[pathParts.length - 1]
|
||||
|
||||
// Set default API call filter
|
||||
let filter = {
|
||||
"article.general.locale": $currentLang,
|
||||
"article.content.slug": slug,
|
||||
}
|
||||
|
||||
// Changed filter to find simmilar content for changed language
|
||||
if (type === "changedLanguage") {
|
||||
// filter = {
|
||||
// tags: { $in: content?.tags },
|
||||
// locale: $currentLang,
|
||||
// }
|
||||
// delete filter["article.general.locale"]
|
||||
// delete filter["article.content.slug"]
|
||||
}
|
||||
|
||||
// Get content by API call
|
||||
let apiParams: APIParams = {
|
||||
filter,
|
||||
}
|
||||
loading = true
|
||||
getArticles("articles", apiParams)
|
||||
.then((respoonse) => {
|
||||
article = respoonse[0]
|
||||
})
|
||||
.finally(() => {
|
||||
loading = false
|
||||
})
|
||||
}
|
||||
|
||||
currentLang.subscribe(() => {
|
||||
if (content) {
|
||||
loadContent("changedLanguage")
|
||||
} else if (article) {
|
||||
loadArticle("changedLanguage")
|
||||
}
|
||||
})
|
||||
|
||||
$: if (path) {
|
||||
content = null
|
||||
article = null
|
||||
|
||||
// Update current language when lang in URL not equal to current language
|
||||
let pathParts = window.location.pathname.split("/")
|
||||
if (pathParts.length > 3 && $currentLang !== pathParts[1]) {
|
||||
$currentLang = pathParts[1]
|
||||
}
|
||||
|
||||
if (window.location.pathname.endsWith("/")) {
|
||||
loadContent()
|
||||
} else {
|
||||
loadArticle()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
<title
|
||||
>{content?.name ? content?.name + " - " : ""}{content?.meta?.metaTitle
|
||||
? content?.meta?.metaTitle
|
||||
: $generalInfo?.meta?.metaTitle}</title
|
||||
>
|
||||
<meta
|
||||
name="description"
|
||||
content="{content?.meta?.metaDescription
|
||||
? content?.meta?.metaDescription
|
||||
: $generalInfo?.meta?.metaDescription}"
|
||||
/>
|
||||
<meta
|
||||
name="keywords"
|
||||
content="{content?.meta?.metaKeywords
|
||||
? content?.meta?.metaKeywords.replaceAll(' ', '')
|
||||
: $generalInfo?.meta?.metaKeywords.replaceAll(' ', '')}"
|
||||
/>
|
||||
<meta
|
||||
name="robots"
|
||||
content="{content?.meta?.metaTagRobots ? content?.meta?.metaTagRobots : $generalInfo?.meta?.metaTagRobots}"
|
||||
/>
|
||||
{#if $generalInfo?.person?.firstname || $generalInfo?.person?.lastname}
|
||||
<meta
|
||||
name="author"
|
||||
content="{$generalInfo?.person?.firstname ? $generalInfo?.person?.firstname : ''} {$generalInfo?.person
|
||||
?.lastname
|
||||
? $generalInfo?.person?.lastname
|
||||
: ''}"
|
||||
/>
|
||||
{/if}
|
||||
</svelte:head>
|
||||
|
||||
{#if loading}
|
||||
<!-- Loader -->
|
||||
{:else if article}
|
||||
<ArticleDetails entry="{article}" />
|
||||
{:else if content}
|
||||
<ArticlesList path="{path}" tags="{content?.tags}" />
|
||||
{:else}
|
||||
<!-- <div class="page-404">
|
||||
<div>
|
||||
<Image
|
||||
collectionName="general"
|
||||
entryId="{$generalInfo.id}"
|
||||
file="{$generalInfo?.media?.brand}"
|
||||
alt="{$generalInfo?.meta?.metaTitle}"
|
||||
cssClass="brand"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<h1>{$_("pageNotFound")}</h1>
|
||||
|
||||
<p class="mb-md">
|
||||
{#if connectedContentNotFound}
|
||||
<div>
|
||||
{@html $_("connectedContentNotFound", {
|
||||
values: {
|
||||
url: currentDomain + "/" + path,
|
||||
lang: $_($currentLang) + ` (${$currentLang})`,
|
||||
},
|
||||
})}
|
||||
</div>
|
||||
{:else}
|
||||
<strong>
|
||||
<a href="{currentDomain + '/' + path}">{currentDomain + "/" + path}</a>
|
||||
</strong>
|
||||
{/if}
|
||||
</p>
|
||||
<p>
|
||||
{@html $_("pageNotFoundInformation", {
|
||||
values: {
|
||||
url: currentDomain,
|
||||
backUrl: currentDomain + "/" + path,
|
||||
},
|
||||
})}
|
||||
</p>
|
||||
</div> -->
|
||||
{/if}
|
||||
@@ -1,62 +0,0 @@
|
||||
<script lang="ts">
|
||||
import * as animateScroll from "svelte-scrollto"
|
||||
|
||||
import { generalInfo } from "../../store"
|
||||
|
||||
// import ContactForm from "../widgets/ContactForm.svelte"
|
||||
// import GoogleMaps from "../widgets/GoogleMaps.svelte"
|
||||
import ScrollTo from "../widgets/ScrollTo.svelte"
|
||||
import GeneralMediaImage from "../widgets/GeneralMediaImage.svelte"
|
||||
import ArticlesList from "../widgets/ArticlesList.svelte"
|
||||
|
||||
let expandedForm: string = "recipe"
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
{#if $generalInfo?.meta?.metaTitle}
|
||||
<title>{$generalInfo?.meta?.metaTitle}</title>
|
||||
{/if}
|
||||
{#if $generalInfo?.meta?.metaDescription}
|
||||
<meta name="description" content="{$generalInfo?.meta?.metaDescription}" />
|
||||
{/if}
|
||||
{#if $generalInfo?.meta?.metaKeywords}
|
||||
<meta name="keywords" content="{$generalInfo?.meta?.metaKeywords.replaceAll(' ', '')}" />
|
||||
{/if}
|
||||
{#if $generalInfo?.person?.firstname || $generalInfo?.person?.lastname}
|
||||
<meta
|
||||
name="author"
|
||||
content="{$generalInfo?.person?.firstname ? $generalInfo?.person?.firstname : ''} {$generalInfo?.person
|
||||
?.lastname
|
||||
? $generalInfo?.person?.lastname
|
||||
: ''}"
|
||||
/>
|
||||
{/if}
|
||||
{#if $generalInfo?.meta?.metaTagRobots && $generalInfo?.meta?.metaTagRobots.length}
|
||||
<meta name="robots" content="{$generalInfo?.meta?.metaTagRobots}" />
|
||||
{/if}
|
||||
{#if $generalInfo?.media?.favicon}
|
||||
<link rel="shortcut icon" type="image/x-icon" href="{$generalInfo?.media?.favicon.src}" />
|
||||
{/if}
|
||||
</svelte:head>
|
||||
|
||||
<ArticlesList pages="{['/']}" />
|
||||
|
||||
<!-- <GeneralMediaImage id="test1" /> -->
|
||||
|
||||
<!-- <ContactForm type="recipe" collapsed="{expandedForm !== 'recipe'}" /> -->
|
||||
<!-- <ContactForm type="contact" collapsed="{expandedForm !== 'contact'}" /> -->
|
||||
<!-- <GoogleMaps /> -->
|
||||
|
||||
<ScrollTo
|
||||
on:scrollTo="{(e) => {
|
||||
expandedForm = null
|
||||
animateScroll.scrollTo({
|
||||
delay: 100,
|
||||
element: '#' + e.detail.element,
|
||||
offset: -200,
|
||||
onDone: () => {
|
||||
expandedForm = e.detail.element
|
||||
},
|
||||
})
|
||||
}}"
|
||||
/>
|
||||
@@ -1,224 +0,0 @@
|
||||
<script lang="ts">
|
||||
import { _ } from "svelte-i18n"
|
||||
import { navigate, link } from "svelte-routing"
|
||||
|
||||
import TibiArticleMediaFile from "./TibiArticleMediaFile.svelte"
|
||||
|
||||
export let entry: CollectionEntry = null
|
||||
export let cssClass: string = ""
|
||||
export let showDetails: boolean = false
|
||||
|
||||
let path = window.location.pathname
|
||||
let article = null
|
||||
if (entry) {
|
||||
article = entry.article
|
||||
}
|
||||
|
||||
let marginClasses: string = ""
|
||||
let paddingClasses: string = ""
|
||||
let published: boolean = true
|
||||
|
||||
const updatePublishedState = () => {
|
||||
let currentDate = new Date().getTime()
|
||||
let from = new Date(article?.general?.publish_date?.from).getTime()
|
||||
let until = new Date(article?.general?.publish_date?.until).getTime()
|
||||
let publish = true
|
||||
|
||||
if (from && until) {
|
||||
if (currentDate > from && currentDate < until) {
|
||||
publish = true
|
||||
} else {
|
||||
publish = false
|
||||
}
|
||||
} else {
|
||||
if (from) {
|
||||
if (currentDate > from) {
|
||||
publish = true
|
||||
} else {
|
||||
publish = false
|
||||
}
|
||||
}
|
||||
|
||||
if (until && publish) {
|
||||
if (currentDate < until) {
|
||||
publish = true
|
||||
} else {
|
||||
publish = false
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
published = publish
|
||||
}
|
||||
|
||||
$: if (article) {
|
||||
marginClasses = Object.values(article?.layout?.properties?.margin).join(" ").replace(" ", " ")
|
||||
paddingClasses = Object.values(article?.layout?.properties?.padding).join(" ").replace(" ", " ")
|
||||
}
|
||||
|
||||
$: if (article?.general?.publish_date?.from || article?.general?.publish_date?.until) updatePublishedState()
|
||||
|
||||
// Update publish state every interval time (default 60sec)
|
||||
setInterval(
|
||||
updatePublishedState,
|
||||
article?.general?.publish_date?.interval ? article?.general?.publish_date?.interval : 60000
|
||||
)
|
||||
</script>
|
||||
|
||||
{#if article && published}
|
||||
<article class="{cssClass} {article?.layout?.variant} {marginClasses} {paddingClasses}">
|
||||
{#if article?.layout?.variant === "top"}
|
||||
{#if article?.content?.types?.media?.files?.length}
|
||||
<TibiArticleMediaFile
|
||||
collectionName="articles"
|
||||
entryId="{entry.id}"
|
||||
mediaFile="{article?.content?.types?.media?.files[0]}"
|
||||
/>
|
||||
{/if}
|
||||
{#if article?.content?.title}
|
||||
<div class="article-title">{@html article?.content?.title}</div>
|
||||
{/if}
|
||||
|
||||
{#if article?.content?.subtitle}
|
||||
<div class="article-subtitle">{@html article?.content?.subtitle}</div>
|
||||
{/if}
|
||||
|
||||
{#if article?.content?.types?.teaser}
|
||||
<div class="article-teaser">{@html article?.content?.types?.teaser}</div>
|
||||
{/if}
|
||||
|
||||
{#if article?.link?.url}
|
||||
<a
|
||||
href="{article?.link?.url}"
|
||||
target="{article?.link?.target ? article?.link?.target : '_self'}"
|
||||
class="article-link">{@html article?.link?.text ? article?.link?.text : $_("details")}</a
|
||||
>
|
||||
{/if}
|
||||
|
||||
{#if article?.content?.types?.details && showDetails}
|
||||
<div class="article-details">{@html article?.content?.types?.details}</div>
|
||||
{/if}
|
||||
{:else if article?.layout?.variant === "right"}
|
||||
<div class="row">
|
||||
<div class="col-md-8">
|
||||
{#if article?.content?.title}
|
||||
<div class="article-title">{@html article?.content?.title}</div>
|
||||
{/if}
|
||||
|
||||
{#if article?.content?.subtitle}
|
||||
<div class="article-subtitle">{@html article?.content?.subtitle}</div>
|
||||
{/if}
|
||||
|
||||
{#if article?.content?.types?.teaser}
|
||||
<div class="article-teaser">{@html article?.content?.types?.teaser}</div>
|
||||
{/if}
|
||||
|
||||
{#if article?.link?.url}
|
||||
<a
|
||||
href="{article?.link?.url}"
|
||||
target="{article?.link?.target ? article?.link?.target : '_self'}"
|
||||
class="article-link">{@html article?.link?.text ? article?.link?.text : $_("details")}</a
|
||||
>
|
||||
{/if}
|
||||
|
||||
{#if article?.content?.types?.details && showDetails}
|
||||
<div class="article-details">{@html article?.content?.types?.details}</div>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
{#if article?.content?.types?.media?.files?.length}
|
||||
<TibiArticleMediaFile
|
||||
collectionName="articles"
|
||||
entryId="{entry.id}"
|
||||
mediaFile="{article?.content?.types?.media?.files[0]}"
|
||||
/>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
{:else if article?.layout?.variant === "bottom"}
|
||||
{#if article?.content?.title}
|
||||
<div class="article-title">{@html article?.content?.title}</div>
|
||||
{/if}
|
||||
|
||||
{#if article?.content?.subtitle}
|
||||
<div class="article-subtitle">{@html article?.content?.subtitle}</div>
|
||||
{/if}
|
||||
|
||||
{#if article?.content?.types?.teaser}
|
||||
<div class="article-teaser">{@html article?.content?.types?.teaser}</div>
|
||||
{/if}
|
||||
|
||||
{#if article?.link?.url}
|
||||
<a
|
||||
href="{article?.link?.url}"
|
||||
target="{article?.link?.target ? article?.link?.target : '_self'}"
|
||||
class="article-link">{@html article?.link?.text ? article?.link?.text : $_("details")}</a
|
||||
>
|
||||
{/if}
|
||||
|
||||
{#if article?.content?.types?.details && showDetails}
|
||||
<div class="article-details">{@html article?.content?.types?.details}</div>
|
||||
{/if}
|
||||
|
||||
{#if article?.content?.types?.media?.files?.length}
|
||||
<TibiArticleMediaFile
|
||||
collectionName="articles"
|
||||
entryId="{entry.id}"
|
||||
mediaFile="{article?.content?.types?.media?.files[0]}"
|
||||
/>
|
||||
{/if}
|
||||
{:else if article?.layout?.variant === "left" || article?.layout?.variant === "default"}
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
{#if article?.content?.types?.media?.files?.length}
|
||||
<TibiArticleMediaFile
|
||||
collectionName="articles"
|
||||
entryId="{entry.id}"
|
||||
mediaFile="{article?.content?.types?.media?.files[0]}"
|
||||
/>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="col-md-8">
|
||||
{#if article?.content?.title}
|
||||
<div class="article-title">{@html article?.content?.title}</div>
|
||||
{/if}
|
||||
|
||||
{#if article?.content?.subtitle}
|
||||
<div class="article-subtitle">{@html article?.content?.subtitle}</div>
|
||||
{/if}
|
||||
|
||||
{#if article?.content?.types?.teaser}
|
||||
<div class="article-teaser">{@html article?.content?.types?.teaser}</div>
|
||||
{/if}
|
||||
|
||||
{#if article?.link?.url}
|
||||
<a
|
||||
href="{article?.link?.url}"
|
||||
target="{article?.link?.target ? article?.link?.target : '_self'}"
|
||||
class="article-link">{@html article?.link?.text ? article?.link?.text : $_("details")}</a
|
||||
>
|
||||
{/if}
|
||||
|
||||
{#if article?.content?.types?.details && showDetails}
|
||||
<div class="article-details">{@html article?.content?.types?.details}</div>
|
||||
{:else if article?.content?.types?.details}
|
||||
<a
|
||||
use:link
|
||||
href="{`${path}${encodeURIComponent(
|
||||
article?.content?.slug
|
||||
? article?.content?.slug
|
||||
.toLowerCase()
|
||||
.replace(/[^a-zA-Z0-9]/g, '-')
|
||||
.replaceAll('---', '--')
|
||||
: entry.id
|
||||
)}`}"
|
||||
class="article-link"
|
||||
>
|
||||
{@html article?.link?.text ? article?.link?.text : $_("details")}
|
||||
</a>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
</article>
|
||||
{/if}
|
||||
@@ -1,38 +0,0 @@
|
||||
<script lang="ts">
|
||||
import { currentLang } from "../../store"
|
||||
import { getArticles } from "../../api"
|
||||
|
||||
import Article from "../widgets/Article.svelte"
|
||||
|
||||
export let tags: string[] = null
|
||||
export let pages: string[] = null
|
||||
export let path: string = null
|
||||
|
||||
let articleEntries: CollectionEntry[] = []
|
||||
|
||||
$: if ($currentLang) {
|
||||
let filter = {
|
||||
"article.general.locale": $currentLang,
|
||||
}
|
||||
|
||||
if (tags && tags?.length) {
|
||||
filter["article.assignments.tags"] = { $in: tags }
|
||||
}
|
||||
|
||||
if (pages && pages?.length) {
|
||||
filter["article.assignments.pages"] = { $in: pages }
|
||||
}
|
||||
|
||||
if (path) {
|
||||
filter["article.assignments.pages"] = { $in: [path] }
|
||||
}
|
||||
|
||||
getArticles("articles", { filter }).then((response) => {
|
||||
articleEntries = response
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
{#each articleEntries || [] as entry}
|
||||
<Article entry="{entry}" />
|
||||
{/each}
|
||||
@@ -1,160 +0,0 @@
|
||||
<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>
|
||||
60
src/components/widgets/Content.svelte
Normal file
60
src/components/widgets/Content.svelte
Normal file
@@ -0,0 +1,60 @@
|
||||
<script lang="ts">
|
||||
import { unified } from "unified"
|
||||
import remarkParse from "remark-parse"
|
||||
import remarkGfm from "remark-gfm"
|
||||
//import remarkWikiLink from "remark-wiki-link"
|
||||
import { remarkObsidian } from "../../remark-obsidian"
|
||||
import remarkRehype from "remark-rehype"
|
||||
import rehypeRaw from "rehype-raw"
|
||||
import rehypeHighlight from "rehype-highlight"
|
||||
import rehypeStringify from "rehype-stringify"
|
||||
import "highlight.js/styles/github-dark.css"
|
||||
|
||||
export let path: string
|
||||
|
||||
let md = ""
|
||||
|
||||
$: {
|
||||
fetch("/note/" + path + ".md")
|
||||
.then((r) => {
|
||||
return r.text()
|
||||
})
|
||||
.then((t) => {
|
||||
unified()
|
||||
.use(remarkParse) // Parse markdown content to a syntax tree
|
||||
.use(remarkGfm)
|
||||
.use(remarkObsidian, { attachementsPath: "/note/" + path + "/../attachements" })
|
||||
// .use(remarkWikiLink, {
|
||||
// hrefTemplate(href) {
|
||||
// return href
|
||||
// },
|
||||
// })
|
||||
.use(remarkRehype, { allowDangerousHtml: true }) // Turn markdown syntax tree to HTML syntax tree, ignoring embedded HTML
|
||||
.use(rehypeRaw) // *Parse* the raw HTML strings embedded in the tree
|
||||
.use(rehypeStringify, { allowDangerousHtml: true }) // Serialize HTML syntax tree
|
||||
.use(rehypeHighlight)
|
||||
.process(t)
|
||||
.then((file) => {
|
||||
md = String(file)
|
||||
})
|
||||
.catch((error) => {
|
||||
throw error
|
||||
})
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<div>{@html md}</div>
|
||||
|
||||
<style lang="less">
|
||||
div :global {
|
||||
img.attachement {
|
||||
max-width: 80%;
|
||||
margin: 10px;
|
||||
}
|
||||
blockquote {
|
||||
background-color: #00000011;
|
||||
padding: 10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,24 +1,10 @@
|
||||
<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 class="col-md-12"></div>
|
||||
</div>
|
||||
{#if $generalInfo?.copyrightText}
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="copyright">
|
||||
{$generalInfo?.copyrightText}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@@ -1,107 +0,0 @@
|
||||
<script lang="ts">
|
||||
import { fade } from "svelte/transition"
|
||||
|
||||
import { getGalleries } from "../../api"
|
||||
import { apiBaseURL } from "../../config"
|
||||
|
||||
import Modal from "./Modal.svelte"
|
||||
|
||||
export let article
|
||||
let galleries: Gallery[]
|
||||
|
||||
const loadLinkedGalleries = async () => {
|
||||
galleries = await getGalleries(article?.galleries)
|
||||
}
|
||||
loadLinkedGalleries()
|
||||
|
||||
let selectedImage = null
|
||||
let selectedGallery = null
|
||||
const showDetails = (gallery, image) => {
|
||||
selectedImage = image
|
||||
selectedGallery = gallery
|
||||
console.log(selectedGallery.items.indexOf(image))
|
||||
}
|
||||
const closeDetails = () => {
|
||||
selectedImage = null
|
||||
selectedGallery = null
|
||||
}
|
||||
|
||||
const next = () => {
|
||||
let nextImage
|
||||
let nextIndex = selectedGallery.items.indexOf(selectedImage) + 1
|
||||
if (!selectedGallery.items[nextIndex]) {
|
||||
nextImage = selectedGallery.items[0]
|
||||
} else {
|
||||
nextImage = selectedGallery.items[nextIndex]
|
||||
}
|
||||
selectedImage = nextImage
|
||||
}
|
||||
|
||||
const prev = () => {
|
||||
let prevImage
|
||||
let prevIndex = selectedGallery.items.indexOf(selectedImage) - 1
|
||||
if (prevIndex < 0) {
|
||||
prevImage = selectedGallery.items[selectedGallery.items.length - 1]
|
||||
} else {
|
||||
prevImage = selectedGallery.items[prevIndex]
|
||||
}
|
||||
selectedImage = prevImage
|
||||
}
|
||||
|
||||
const handleKeydown = (e) => {
|
||||
if (e.keyCode === 37) {
|
||||
prev()
|
||||
}
|
||||
if (e.keyCode === 39) {
|
||||
next()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<svelte:window on:keydown="{handleKeydown}" />
|
||||
|
||||
<section class="galleries">
|
||||
{#each galleries || [] as gallery}
|
||||
<div class="gallery gallery-{gallery.variant}">
|
||||
{#each gallery.items || [] as image, index}
|
||||
<div class="gallery-item" on:click="{() => showDetails(gallery, image)}">
|
||||
<img
|
||||
src="{apiBaseURL}galleries/{gallery.id}/{image.file.src}?filter=s"
|
||||
alt="{image.alt ? image.alt : image.title}"
|
||||
/>
|
||||
{#if gallery.variant === "simple-with-title"}
|
||||
<div class="gallery-item-title">
|
||||
{image.title}
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
{/each}
|
||||
|
||||
{#if selectedGallery && selectedImage}
|
||||
<Modal show="{selectedGallery && selectedImage}">
|
||||
<div transition:fade class="gallery-image-details">
|
||||
<img
|
||||
src="{apiBaseURL}galleries/{selectedGallery.id}/{selectedImage.file.src}?filter=l"
|
||||
alt="{selectedImage.alt ? selectedImage.alt : selectedImage.title}"
|
||||
on:click="{closeDetails}"
|
||||
/>
|
||||
<div class="gallery-info">
|
||||
{#if selectedImage.title}
|
||||
<div class="gallery-title">
|
||||
{selectedImage.title}
|
||||
</div>
|
||||
{/if}
|
||||
{#if selectedImage.description}
|
||||
<div class="gallery-description">
|
||||
{selectedImage.description}
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="prev" on:click|preventDefault="{prev}">‹</div>
|
||||
<div class="next" on:click|preventDefault="{next}">›</div>
|
||||
</div>
|
||||
</Modal>
|
||||
{/if}
|
||||
</section>
|
||||
@@ -1,27 +0,0 @@
|
||||
<script lang="ts">
|
||||
import { generalInfo } from "../../store"
|
||||
import { apiBaseURL } from "../../config"
|
||||
|
||||
export let id: string = null
|
||||
export let cssClass: string = ""
|
||||
</script>
|
||||
|
||||
{#if id}
|
||||
{#each $generalInfo?.media?.mediaFiles || [] as mediaFile}
|
||||
{#if mediaFile.id === id && mediaFile.file}
|
||||
{#if mediaFile.file.src.includes(";base64,")}
|
||||
<img
|
||||
src="{mediaFile.file.src}"
|
||||
alt="{mediaFile.alternateText ? mediaFile.alternateText + ' - ' : ''}"
|
||||
class="{cssClass}"
|
||||
/>
|
||||
{:else}
|
||||
<img
|
||||
src="{`${apiBaseURL}general/${$generalInfo?.id}/${mediaFile.file.src}?filter=l`}"
|
||||
alt="{mediaFile.alternateText ? mediaFile.alternateText : mediaFile.file.path}"
|
||||
class="{cssClass}"
|
||||
/>
|
||||
{/if}
|
||||
{/if}
|
||||
{/each}
|
||||
{/if}
|
||||
@@ -1,22 +0,0 @@
|
||||
<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}
|
||||
@@ -1,10 +1,5 @@
|
||||
<script lang="ts">
|
||||
import { link } from "svelte-routing"
|
||||
|
||||
import { generalInfo } from "../../store"
|
||||
|
||||
import Navigation from "./Navigation.svelte"
|
||||
import Image from "./Image.svelte"
|
||||
</script>
|
||||
|
||||
<header>
|
||||
@@ -12,19 +7,9 @@
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div class="header-content">
|
||||
<a href="/" use:link>
|
||||
<Image
|
||||
collectionName="general"
|
||||
entryId="{$generalInfo?.id}"
|
||||
file="{$generalInfo?.media?.brand}"
|
||||
alt="{$generalInfo?.meta?.metaTitle}"
|
||||
cssClass="brand"
|
||||
/>
|
||||
</a>
|
||||
<a href="/" use:link>My Notes</a>
|
||||
|
||||
<div class="header-content-right">
|
||||
<Navigation />
|
||||
</div>
|
||||
<div class="header-content-right"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,48 +0,0 @@
|
||||
<script lang="ts">
|
||||
import { apiBaseURL } from "../../config"
|
||||
|
||||
export let collectionName: string = null
|
||||
export let entryId: string = null
|
||||
export let file: File = null
|
||||
export let alt: string = ""
|
||||
export let cssClass: string = ""
|
||||
</script>
|
||||
|
||||
{#if collectionName && entryId && file}
|
||||
{#if file?.src?.includes(";base64,")}
|
||||
<img src="{file.src}" alt="{alt ? alt + ' - ' : ''}{file.path}" class="{cssClass}" />
|
||||
{:else}
|
||||
<img
|
||||
src="{`${apiBaseURL}${collectionName}/${entryId}/${file.src}?filter=l`}"
|
||||
alt="{alt ? alt : file.path}"
|
||||
class="{cssClass}"
|
||||
/>
|
||||
{/if}
|
||||
{/if}
|
||||
|
||||
<!-- <picture>
|
||||
<source
|
||||
media="(min-width: 1400px)"
|
||||
data-srcset="https://www.framos-holding.de/wp-content/uploads/2020/09/fresh-IT-3.jpg"
|
||||
srcset="https://www.framos-holding.de/wp-content/uploads/2020/09/fresh-IT-3.jpg"
|
||||
/>
|
||||
<source
|
||||
media="(min-width: 768px)"
|
||||
data-srcset="https://www.framos-holding.de/wp-content/uploads/2020/09/fresh-IT-3.jpg"
|
||||
srcset="https://www.framos-holding.de/wp-content/uploads/2020/09/fresh-IT-3.jpg"
|
||||
/>
|
||||
<source
|
||||
media="(min-width: 400px)"
|
||||
data-srcset="https://www.framos-holding.de/wp-content/uploads/2020/09/fresh-IT-3.jpg"
|
||||
srcset="https://www.framos-holding.de/wp-content/uploads/2020/09/fresh-IT-3.jpg"
|
||||
/>
|
||||
<source
|
||||
data-srcset="https://www.framos-holding.de/wp-content/uploads/2020/09/fresh-IT-3-400x267.jpg"
|
||||
srcset="https://www.framos-holding.de/wp-content/uploads/2020/09/fresh-IT-3-400x267.jpg"
|
||||
/>
|
||||
<img
|
||||
data-src="https://www.framos-holding.de/wp-content/uploads/2020/09/fresh-IT-3-400x267.jpg"
|
||||
alt="fresh IT GmbH"
|
||||
src="https://www.framos-holding.de/wp-content/uploads/2020/09/fresh-IT-3-400x267.jpg"
|
||||
/>
|
||||
</picture> -->
|
||||
@@ -1,30 +0,0 @@
|
||||
<script lang="ts">
|
||||
import { locale } from "svelte-i18n"
|
||||
import { navigations, currentLang } from "../../store"
|
||||
|
||||
$: languages = []
|
||||
|
||||
$: {
|
||||
if ($navigations?.length) {
|
||||
$navigations.forEach((nav) => {
|
||||
if (!languages.includes(nav.locale)) {
|
||||
languages.push(nav.locale)
|
||||
}
|
||||
})
|
||||
languages = languages
|
||||
}
|
||||
}
|
||||
|
||||
const setLanguage = (lang: string) => {
|
||||
$currentLang = lang
|
||||
locale.set($currentLang)
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="language-chooser">
|
||||
{#each languages as lang}
|
||||
<div class="lang" class:active="{$currentLang === lang}" on:click="{() => setLanguage(lang)}">
|
||||
{lang}
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
@@ -1,35 +0,0 @@
|
||||
<script lang="ts">
|
||||
import { scale } from "svelte/transition"
|
||||
|
||||
export let show: boolean = false
|
||||
export let size: string = "md"
|
||||
|
||||
const clickOnBackground = () => {
|
||||
show = false
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="modal-wrapper" class:show on:click="{clickOnBackground}">
|
||||
<div class="modal modal-{size}" transition:scale on:click|stopPropagation="{() => {}}">
|
||||
{#if $$slots.close}
|
||||
<div class="modal-close">
|
||||
<slot name="close" />
|
||||
</div>
|
||||
{/if}
|
||||
{#if $$slots.header}
|
||||
<div class="modal-header">
|
||||
<slot name="header" />
|
||||
</div>
|
||||
{/if}
|
||||
{#if $$slots.default}
|
||||
<div class="modal-content">
|
||||
<slot />
|
||||
</div>
|
||||
{/if}
|
||||
{#if $$slots.header}
|
||||
<div class="modal-footer">
|
||||
<slot name="footer" />
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
@@ -1,108 +0,0 @@
|
||||
<script lang="ts">
|
||||
import * as animateScroll from "svelte-scrollto"
|
||||
import Icon from "mdi-svelte"
|
||||
import { mdiMenu } from "@mdi/js"
|
||||
|
||||
import { links, link } from "svelte-routing"
|
||||
import { navigations, currentLang, location } from "../../store"
|
||||
|
||||
import LanguageChooser from "./LanguageChooser.svelte"
|
||||
|
||||
export let ident = "main"
|
||||
|
||||
let navigation: Navigation
|
||||
let showMobileNav: boolean = false
|
||||
|
||||
$: {
|
||||
navigation = null
|
||||
$navigations?.map((nav) => {
|
||||
if (nav.ident === ident && nav.locale === $currentLang) {
|
||||
navigation = nav
|
||||
}
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<LanguageChooser />
|
||||
|
||||
{#if navigation}
|
||||
<nav class="{ident}" use:links>
|
||||
{#each navigation?.items || [] as item}
|
||||
{#if !item.settings.url.hidden}
|
||||
{#if item.settings.url.url}
|
||||
{#if item.settings.url.target === "default"}
|
||||
<a
|
||||
use:link
|
||||
href="{item.settings.url.url}"
|
||||
class:active="{'/' + item.settings.page === $location.path}"
|
||||
>
|
||||
{item.settings.title}
|
||||
</a>
|
||||
{:else}
|
||||
<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>
|
||||
{/if}
|
||||
{:else}
|
||||
<a href="{item.settings.page + '/'}" class:active="{'/' + item.settings.page === $location.path}">
|
||||
{item.settings.title}
|
||||
</a>
|
||||
{/if}
|
||||
{/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>
|
||||
{#each navigation?.items || [] as item}
|
||||
{#if !item.settings.url.hidden}
|
||||
{#if item.settings.url.url}
|
||||
{#if item.settings.url.target === "default"}
|
||||
<a
|
||||
use:link
|
||||
href="{item.settings.url.url}"
|
||||
class:active="{'/' + item.settings.page === $location.path}"
|
||||
>
|
||||
{item.settings.title}
|
||||
</a>
|
||||
{:else}
|
||||
<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>
|
||||
{/if}
|
||||
{:else}
|
||||
<div class="nav-item">
|
||||
<a
|
||||
href="{item.settings.page + '/'}"
|
||||
on:click="{() => (showMobileNav = false)}"
|
||||
class:active="{'/' + item.settings.page === $location.path}"
|
||||
>
|
||||
{item.settings.title}
|
||||
</a>
|
||||
</div>
|
||||
{/if}
|
||||
{/if}
|
||||
{/each}
|
||||
</nav>
|
||||
{/if}
|
||||
{/if}
|
||||
@@ -1,56 +0,0 @@
|
||||
<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}
|
||||
@@ -1,74 +0,0 @@
|
||||
<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>
|
||||
|
Before Width: | Height: | Size: 2.8 KiB |
@@ -1,39 +0,0 @@
|
||||
<script lang="ts">
|
||||
import { createEventDispatcher } from "svelte"
|
||||
|
||||
import GeneralMediaImage from "./GeneralMediaImage.svelte"
|
||||
|
||||
const dispatch = createEventDispatcher()
|
||||
</script>
|
||||
|
||||
<div class="scroll-to-top">
|
||||
<div class="circle-email">
|
||||
<a
|
||||
href="/#"
|
||||
on:click="{() => {
|
||||
dispatch('scrollTo', {
|
||||
element: 'contact',
|
||||
})
|
||||
}}"
|
||||
>
|
||||
<GeneralMediaImage id="contact" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="circle-contact">
|
||||
<a
|
||||
href="/#"
|
||||
on:click="{() => {
|
||||
dispatch('scrollTo', {
|
||||
element: 'recipe',
|
||||
})
|
||||
}}"
|
||||
>
|
||||
<GeneralMediaImage id="recipe" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="circle-top">
|
||||
<a href="/#">
|
||||
<GeneralMediaImage id="up" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1,10 +0,0 @@
|
||||
<script lang="ts">
|
||||
import Image from "./Image.svelte"
|
||||
|
||||
export let collectionName: string = null
|
||||
export let entryId: string = null
|
||||
export let mediaFile: TibiArticleMediaFile = null
|
||||
export let cssClass: string = ""
|
||||
</script>
|
||||
|
||||
<Image collectionName="{collectionName}" entryId="{entryId}" file="{mediaFile.file}" cssClass="{cssClass}" />
|
||||
@@ -1,29 +0,0 @@
|
||||
<script lang="ts">
|
||||
export let entry: TibiArticle
|
||||
</script>
|
||||
|
||||
{#if entry}
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="article-details {entry?.article?.general?.type}">
|
||||
{#if entry?.article?.content?.title}
|
||||
<h1 class="article-title">{@html entry?.article?.content?.title}</h1>
|
||||
{/if}
|
||||
|
||||
{#if entry?.article?.content?.subtitle}
|
||||
<div class="article-subtitle">{@html entry?.article?.content?.subtitle}</div>
|
||||
{/if}
|
||||
|
||||
{#if entry?.article?.content?.types?.teaser}
|
||||
<div class="article-teaser">{@html entry?.article?.content?.types?.teaser}</div>
|
||||
{/if}
|
||||
|
||||
{#if entry?.article?.content?.types?.details}
|
||||
<div class="article-details">{@html entry?.article?.content?.types?.details}</div>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
@@ -1,29 +0,0 @@
|
||||
<script lang="ts">
|
||||
export let entry: TibiArticle
|
||||
</script>
|
||||
|
||||
{#if entry}
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="article-details {entry?.article?.general?.type}">
|
||||
{#if entry?.article?.content?.title}
|
||||
<h1 class="article-title">{@html entry?.article?.content?.title}</h1>
|
||||
{/if}
|
||||
|
||||
{#if entry?.article?.content?.subtitle}
|
||||
<div class="article-subtitle">{@html entry?.article?.content?.subtitle}</div>
|
||||
{/if}
|
||||
|
||||
{#if entry?.article?.content?.types?.teaser}
|
||||
<div class="article-teaser">{@html entry?.article?.content?.types?.teaser}</div>
|
||||
{/if}
|
||||
|
||||
{#if entry?.article?.content?.types?.details}
|
||||
<div class="article-details">{@html entry?.article?.content?.types?.details}</div>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
@@ -1,7 +0,0 @@
|
||||
import Default from "./Default.svelte"
|
||||
import News from "./News.svelte"
|
||||
|
||||
export default {
|
||||
default: Default,
|
||||
news: News,
|
||||
}
|
||||
Reference in New Issue
Block a user