Slots in Layout

<template>
  <div
    class="flex min-h-screen w-full flex-col bg-gradient-to-b from-zinc-800 to-slate-950"
  >
    <div class="relative h-screen">
      <default-header class="absolute top-0 flex flex-col" />
      <div class="flex h-full flex-row">
        <slot></slot>
      </div>
    </div>
    <div>
      <slot name="content"></slot>
    </div>
    <div>
      <default-footer />
    </div>
  </div>
</template>

<template>
  <section class="w-full">
    <hero-section />
  </section>
  <template #content>
    <div class="bg-white">Hello</div>
  </template>
</template>

<script setup lang="ts">
definePageMeta({
  layout: "homepage",
});
</script>

<template>
  <NuxtLayout>
    <NuxtPage></NuxtPage>
  </NuxtLayout>
</template>