component formatting and types

This commit is contained in:
Julian Krauser 2025-02-14 13:57:55 +01:00
parent c2a7d15eeb
commit ce745c06e5
60 changed files with 464 additions and 301 deletions

View file

@ -1,17 +1,19 @@
<template>
<div class="min-h-[calc(100vh-9rem)] w-full">
<SharedHero v-if="hero" :data="hero" />
<ItemsHero v-if="hero" :data="hero" />
<div class="container mx-auto py-12 px-2 min-h-[50vh] flex flex-col gap-2">
<div v-for="item in content" class="contents">
<DynamicZoneColumnImageText v-if="item.__component == 'dynamic-zone.column-image-text'" :data="item" />
<DynamicZoneSection v-if="item.__component == 'dynamic-zone.section'" :data="item" />
<DynamicZoneSpacer v-else-if="item.__component == 'dynamic-zone.spacer'" :data="item" />
<DynamicZoneColumnImageText v-else-if="item.__component == 'dynamic-zone.column-image-text'" :data="item" />
<DynamicZoneDualColumnText v-else-if="item.__component == 'dynamic-zone.dual-column-text'" :data="item" />
<DynamicZoneEmphasiseArticle v-else-if="item.__component == 'dynamic-zone.emphasise-article'" :data="item" />
<DynamicZoneFullImage v-else-if="item.__component == 'dynamic-zone.full-image'" :data="item" />
<DynamicZoneFullText v-else-if="item.__component == 'dynamic-zone.full-text'" :data="item" />
<DynamicZoneGallery v-else-if="item.__component == 'dynamic-zone.gallery'" :data="item" />
<DynamicZoneFileDownload v-else-if="item.__component == 'dynamic-zone.file-download'" :data="item" />
<DynamicZoneEmbedding v-else-if="item.__component == 'dynamic-zone.embedding'" :data="item" />
<SharedList v-else-if="item.__component == 'shared.list'" :data="item" />
<SharedEmphasiseArticle v-else-if="item.__component == 'shared.emphasise-article'" :data="item" />
<br />
</div>
</div>
@ -20,11 +22,11 @@
<script setup lang="ts">
import type { PropType } from "vue";
import type SharedHero from "../types/component/sharedHero";
import type ItemsHero from "../types/component/items/hero";
import type { ComponentTypes } from "../types/component/baseComponent";
defineProps({
hero: { type: Object as PropType<SharedHero>, required: false, default: null },
hero: { type: Object as PropType<ItemsHero>, required: false, default: null },
content: Array<ComponentTypes>,
});
</script>