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

const route = useRoute();
const screen = computed(() => route.query.screen as string | undefined);
</script>

<template>
  <NuxtLayout name="default">
    <template #top>
      <HomeTopScreen v-if="!screen" />
      <ContactTopScreen v-else-if="screen === 'contact'" />
      <ProjectsTopScreen v-else-if="screen === 'projects'" />
      <SettingsTopScreen v-else-if="screen === 'settings'" />
    </template>

    <template #bottom>
      <HomeBottomScreen v-if="!screen" />
      <ContactBottomScreen v-else-if="screen === 'contact'" />
      <ProjectsBottomScreen v-else-if="screen === 'projects'" />
      <SettingsBottomScreen v-else-if="screen === 'settings'" />
    </template>
  </NuxtLayout>
</template>
