From 2189a3d33b80ac3e185ee302f4c7eef15efe5ce5 Mon Sep 17 00:00:00 2001
From: Julian Krauser <jkrauser209@gmail.com>
Date: Fri, 17 Jan 2025 11:34:36 +0100
Subject: [PATCH] hide backdrop option and smooth scroll down

---
 layouts/landing.vue      | 13 +++++++++++--
 public/chevrons-down.svg |  1 +
 types/single/homepage.ts |  1 +
 3 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 public/chevrons-down.svg

diff --git a/layouts/landing.vue b/layouts/landing.vue
index 3dff4d2..2b544f9 100644
--- a/layouts/landing.vue
+++ b/layouts/landing.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="relative h-[calc(100svh-6rem)] max-h-[calc(100svh-6rem)] w-full overflow-hidden">
+  <div v-if="!hide_backdrop" class="relative h-[calc(100svh-6rem)] max-h-[calc(100svh-6rem)] w-full overflow-hidden">
     <NuxtPicture
       loading="lazy"
       class="w-full h-full object-cover object-center"
@@ -7,6 +7,11 @@
       :imgAttrs="{ class: 'w-full h-full object-cover object-center' }"
     />
     <img class="absolute p-4 max-sm:w-full sm:h-40 bottom-5" :src="baseUrl + navbar.logo.url" />
+    <img
+      class="absolute h-5 w-5 left-1/2 -translate-y-1/2 bottom-5 text-gray-400 cursor-pointer"
+      src="/chevrons-down.svg"
+      @click="scroll()"
+    />
   </div>
   <Header />
   <slot />
@@ -28,5 +33,9 @@ const { data: global } = await useAsyncData("global", () => findOne<Global>("glo
 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;
+const { backdrop, hide_backdrop } = homepage.value?.data as unknown as Homepage;
+
+function scroll() {
+  window.scrollTo({ top: window.innerHeight - 96, behavior: "smooth" });
+}
 </script>
diff --git a/public/chevrons-down.svg b/public/chevrons-down.svg
new file mode 100644
index 0000000..e67ef2f
--- /dev/null
+++ b/public/chevrons-down.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevrons-down"><polyline points="7 13 12 18 17 13"></polyline><polyline points="7 6 12 11 17 6"></polyline></svg>
\ No newline at end of file
diff --git a/types/single/homepage.ts b/types/single/homepage.ts
index 43d7e30..2a26c5a 100644
--- a/types/single/homepage.ts
+++ b/types/single/homepage.ts
@@ -9,5 +9,6 @@ export default interface Homepage {
   publishedAt: string;
   locale: string;
   backdrop: BaseImage;
+  hide_backdrop: boolean;
   content: Array<ComponentTypes>;
 }