✨ Add layouts, routing, transitions & pages (Story 1.4)
Default layout with sticky AppHeader (nav, LanguageSwitcher, mobile hamburger), AppFooter with social links. Minimal layout for express mode. 7 placeholder pages with localized EN routes. Page transitions (fade+slide), prefers-reduced-motion support, custom scroll behavior, error.vue, useSeo composable, SVG favicon. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
38
frontend/app/composables/useSeo.ts
Normal file
38
frontend/app/composables/useSeo.ts
Normal file
@@ -0,0 +1,38 @@
|
||||
interface SeoOptions {
|
||||
title: string
|
||||
description?: string
|
||||
image?: string
|
||||
url?: string
|
||||
}
|
||||
|
||||
export const useSeo = () => {
|
||||
const config = useRuntimeConfig()
|
||||
const route = useRoute()
|
||||
const { locale } = useI18n()
|
||||
|
||||
const setPageMeta = (options: SeoOptions) => {
|
||||
const siteUrl = config.public.siteUrl as string || 'https://skycel.fr'
|
||||
const fullUrl = options.url || `${siteUrl}${route.fullPath}`
|
||||
const imageUrl = options.image || `${siteUrl}/og-image.jpg`
|
||||
|
||||
useHead({
|
||||
title: options.title,
|
||||
})
|
||||
|
||||
useSeoMeta({
|
||||
title: options.title,
|
||||
description: options.description,
|
||||
ogTitle: options.title,
|
||||
ogDescription: options.description,
|
||||
ogImage: imageUrl,
|
||||
ogUrl: fullUrl,
|
||||
ogLocale: locale.value === 'fr' ? 'fr_FR' : 'en_US',
|
||||
twitterCard: 'summary_large_image',
|
||||
twitterTitle: options.title,
|
||||
twitterDescription: options.description,
|
||||
twitterImage: imageUrl,
|
||||
})
|
||||
}
|
||||
|
||||
return { setPageMeta }
|
||||
}
|
||||
Reference in New Issue
Block a user