forked from BRETT/BRETT
Layout additions: breadcrumbs, global drop zone, sticky MOTD
- Route-derived SiteBreadcrumb below the MOTD on all non-index pages; separator icon switched to bxs:chevron-right-square - GlobalDropZone moved to the layout so it works on every page; on thread routes it only applies to the upper half of the viewport (comment attachments keep their own zone) - MOTD banner is now sticky below the site header Generated with [Devin](https://devin.ai) Co-Authored-By: Devin <158243242+devin-ai-integration[bot]@users.noreply.github.com>
This commit is contained in:
@@ -0,0 +1,52 @@
|
||||
<script setup lang="ts">
|
||||
import {
|
||||
Breadcrumb,
|
||||
BreadcrumbItem,
|
||||
BreadcrumbLink,
|
||||
BreadcrumbList,
|
||||
BreadcrumbPage,
|
||||
BreadcrumbSeparator,
|
||||
} from '@/components/ui/breadcrumb'
|
||||
|
||||
const { t } = useI18n()
|
||||
const route = useRoute()
|
||||
|
||||
interface Crumb {
|
||||
label: string
|
||||
to?: string
|
||||
}
|
||||
|
||||
const crumbs = computed<Crumb[]>(() => {
|
||||
const list: Crumb[] = [{ label: t('palette.home'), to: '/' }]
|
||||
const p = route.path
|
||||
if (p === '/') return []
|
||||
if (p.startsWith('/thread/')) list.push({ label: t('nav.thread') })
|
||||
else if (p === '/users') list.push({ label: t('nav.users') })
|
||||
else if (p.startsWith('/user/')) {
|
||||
list.push({ label: t('nav.users'), to: '/users' }, { label: t('nav.profile') })
|
||||
}
|
||||
else if (p === '/settings') list.push({ label: t('nav.settings') })
|
||||
else if (p === '/admin') list.push({ label: t('nav.admin') })
|
||||
else if (p === '/login') list.push({ label: t('auth.login') })
|
||||
else if (p === '/register') list.push({ label: t('auth.register') })
|
||||
return list
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Breadcrumb v-if="crumbs.length > 1" class="px-4 py-2 lg:px-6">
|
||||
<BreadcrumbList>
|
||||
<template v-for="(crumb, i) in crumbs" :key="i">
|
||||
<BreadcrumbItem>
|
||||
<BreadcrumbLink v-if="crumb.to" as-child>
|
||||
<NuxtLink :to="crumb.to">{{ crumb.label }}</NuxtLink>
|
||||
</BreadcrumbLink>
|
||||
<BreadcrumbPage v-else>
|
||||
{{ crumb.label }}
|
||||
</BreadcrumbPage>
|
||||
</BreadcrumbItem>
|
||||
<BreadcrumbSeparator v-if="i < crumbs.length - 1" />
|
||||
</template>
|
||||
</BreadcrumbList>
|
||||
</Breadcrumb>
|
||||
</template>
|
||||
Reference in New Issue
Block a user