<script setup lang="ts">
import Container from '@/components/ui/container/Container.vue';
import { Outline } from '@/components/ui/outline';
import { SidebarTrigger } from '@/components/ui/sidebar';

definePageMeta({
    layout: false,
})
</script>

<template>
    <div class="flex-1">
        <NuxtLayout name="default">
            <template #header>
                <Outline side="bottom" padding="dense" class="w-full">
                    <div class="flex gap-8 w-full items-center">
                        <SidebarTrigger :size="5" />
                        <h2
                            class="scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight transition-colors first:mt-0">
                            Tracks
                        </h2>
                    </div>
                </Outline>
            </template>
            <div class="w-full">
                <Container>
                    Hello
                </Container>
            </div>
        </NuxtLayout>
    </div>
</template>
