All checks were successful
Build and deploy updated apps / Build & deploy (push) Successful in 2m0s
119 lines
3.2 KiB
Vue
119 lines
3.2 KiB
Vue
<script setup lang="ts">
|
|
useSeoLinking()
|
|
const { l } = useContentInjected()
|
|
|
|
useSeoMeta({
|
|
title: () => l.value.meta.title,
|
|
description: () => l.value.meta.description,
|
|
})
|
|
|
|
useHead({
|
|
script: [
|
|
{
|
|
src: 'https://mainframe.capcorn.net/ressourcen/newUI/js/jquery.js',
|
|
defer: true,
|
|
},
|
|
{
|
|
src: 'https://mainframe.capcorn.net/ressourcen/newUI/js/capcorn.js',
|
|
defer: true,
|
|
},
|
|
],
|
|
link: [
|
|
{
|
|
rel: 'stylesheet',
|
|
href: 'https://mainframe.capcorn.net/ressourcen/newUI/css/capcorn.css',
|
|
},
|
|
],
|
|
})
|
|
|
|
const route = useRoute()
|
|
|
|
const src = computed(() => {
|
|
const lg = route.params.locale === 'de' ? 0 : 1
|
|
return `https://www.capcorn.net/MasterReq?FT=9&MB=1487&FL=17&LG=${lg}`
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<XScaffoldGridPage>
|
|
<AppSection mode="flat">
|
|
<XContainerPair break="2xl">
|
|
<template #left>
|
|
<div class="flex flex-col">
|
|
<XText as="section" :text="l.title" />
|
|
|
|
<div class="flex flex-col fgap-2 fmb-2">
|
|
<XText as="paragraph" :text="l.description" :margin="false" />
|
|
|
|
<XContactDetailGroup :names="['phone', 'email']" />
|
|
|
|
<XText as="paragraph" :margin="false">
|
|
{{ l.online1 }}
|
|
<AppButton type="here" variant="outline" />
|
|
{{ l.online2 }}
|
|
</XText>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<template #right>
|
|
<div id="hosts" class="w-full h-full flex">
|
|
<div class="flex flex-col">
|
|
<XText as="section">{{ l.heroes.title }}</XText>
|
|
|
|
<div class="flex flex-col rgap-2">
|
|
<div class="flex flex-row items-center rgap-1.5">
|
|
<NuxtImg
|
|
class="self-center object-cover rounded-full w-30"
|
|
:src="l.heroes.parents.image"
|
|
/>
|
|
|
|
<div>
|
|
<XText class="text-left" as="label" :text="l.heroes.parents.title" />
|
|
<XText
|
|
class="text-left"
|
|
as="paragraph"
|
|
:text="l.heroes.parents.description"
|
|
:margin="false"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex flex-row items-center rgap-1.5">
|
|
<div>
|
|
<XText class="text-right" as="label" :text="l.heroes.children.title" />
|
|
<XText
|
|
class="text-right"
|
|
as="paragraph"
|
|
:text="l.heroes.children.description"
|
|
:margin="false"
|
|
/>
|
|
</div>
|
|
|
|
<NuxtImg
|
|
class="self-center object-cover rounded-full w-30"
|
|
:src="l.heroes.children.image"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</XContainerPair>
|
|
</AppSection>
|
|
|
|
<AppSection mode="card">
|
|
<ClientOnly>
|
|
<iframe
|
|
id="iframeCapCorn"
|
|
:src="src"
|
|
frameborder="0"
|
|
width="100%"
|
|
scrolling="auto"
|
|
class="min-h-[30rem]"
|
|
/>
|
|
</ClientOnly>
|
|
</AppSection>
|
|
</XScaffoldGridPage>
|
|
</template>
|