41 lines
1.3 KiB
Vue
41 lines
1.3 KiB
Vue
<script setup lang="ts">
|
|
import AppContent from '@/components/AppContent.vue';
|
|
import AppShell from '@/components/AppShell.vue';
|
|
import AppSidebar from '@/components/AppSidebar.vue';
|
|
import AppSidebarHeader from '@/components/AppSidebarHeader.vue';
|
|
import ProjectNavigation from '@/components/ProjectNavigation.vue';
|
|
import { useLocalization } from '@/composables/useLocalization';
|
|
import type { BreadcrumbItem } from '@/types';
|
|
|
|
type Props = {
|
|
breadcrumbs?: BreadcrumbItem[];
|
|
};
|
|
|
|
withDefaults(defineProps<Props>(), {
|
|
breadcrumbs: () => [],
|
|
});
|
|
const { t } = useLocalization();
|
|
</script>
|
|
|
|
<template>
|
|
<AppShell variant="sidebar">
|
|
<a
|
|
href="#main-content"
|
|
class="bg-primary text-primary-foreground sr-only fixed left-4 top-4 z-50 rounded-md p-3 focus:not-sr-only"
|
|
>{{ t('navigation.skipToContent') }}</a
|
|
>
|
|
<AppSidebar />
|
|
<AppContent variant="sidebar" class="min-w-0">
|
|
<AppSidebarHeader :breadcrumbs="breadcrumbs" />
|
|
<ProjectNavigation />
|
|
<div
|
|
id="main-content"
|
|
tabindex="-1"
|
|
class="flex min-w-0 flex-1 flex-col"
|
|
>
|
|
<slot />
|
|
</div>
|
|
</AppContent>
|
|
</AppShell>
|
|
</template>
|