base structure and display

layouts/default.vue

@@ -1,6 +1,5 @@
 <template>
   <Header />
-  Image title
   <slot />
   <Footer />
 </template>

layouts/detail.vue

@@ -1,5 +0,0 @@
-<template>
-  <Header />
-  <slot />
-  <Footer />
-</template>

layouts/landing.vue

@@ -1,6 +1,26 @@
 <template>
-  Image
+  <div class="relative h-[calc(100vh-6rem)] w-full">
+    <NuxtPicture preload loading="lazy" class="w-full h-full object-cover" :src="baseUrl + backdrop.url" />
+    <img class="absolute h-40 w-fit bottom-10 left-5" :src="baseUrl + navbar.logo.url" />
+  </div>
   <Header />
   <slot />
   <Footer />
 </template>
+
+<script setup lang="ts">
+import type Global from "../types/single/global";
+import type Homepage from "../types/single/homepage";
+
+const {
+  params: { slug: params },
+} = useRoute();
+const baseUrl = useStrapiUrl().replace("/api", "");
+const { findOne } = useStrapi();
+
+const { data: global } = await useAsyncData("global", () => findOne<Global>("global"));
+const { navbar } = global.value?.data as unknown as Global;
+
+const { data: homepage } = await useAsyncData("homepage", () => findOne<Homepage>("homepage"));
+const { backdrop } = homepage.value?.data as unknown as Homepage;
+</script>