hide backdrop option and smooth scroll down

This commit is contained in:
Julian Krauser 2025-01-17 11:34:36 +01:00
parent ee5846aa60
commit 2189a3d33b
3 changed files with 13 additions and 2 deletions

View file

@ -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>