mirror of
https://github.com/rjNemo/vf-site
synced 2026-06-06 09:16:39 +00:00
161 lines
9 KiB
Text
161 lines
9 KiB
Text
---
|
|
import '../styles/global.css';
|
|
import { ctaLabelFor } from '../i18n/routes';
|
|
import { getRelativeLocaleUrl } from 'astro:i18n';
|
|
const { title = 'VillaFleurie', lang = 'fr', description = 'Séjours confortables au Gosier pour couples et petites familles' } = Astro.props;
|
|
// Locale alternates for the current path
|
|
const altFr = getRelativeLocaleUrl('fr', Astro.url.pathname);
|
|
const altEn = getRelativeLocaleUrl('en', Astro.url.pathname);
|
|
// Canonical URL
|
|
const canonicalUrl = new URL(Astro.url.pathname, Astro.site ?? 'https://villafleuriegp.com').toString();
|
|
const nav = lang === 'en'
|
|
? [
|
|
{ label: 'Apartments', href: getRelativeLocaleUrl('en', '/apartments/') },
|
|
{ label: 'Reviews', href: getRelativeLocaleUrl('en', '/reviews/') },
|
|
{ label: 'Location & Access', href: getRelativeLocaleUrl('en', '/location-access/') },
|
|
{ label: 'Rates', href: getRelativeLocaleUrl('en', '/rates-availability/') },
|
|
]
|
|
: [
|
|
{ label: 'Appartements', href: getRelativeLocaleUrl('fr', '/appartements/') },
|
|
{ label: 'Avis', href: getRelativeLocaleUrl('fr', '/avis/') },
|
|
{ label: 'Accès', href: getRelativeLocaleUrl('fr', '/acces/') },
|
|
{ label: 'Tarifs', href: getRelativeLocaleUrl('fr', '/tarifs-disponibilites/') },
|
|
];
|
|
const ctaLabel = ctaLabelFor(lang);
|
|
const homeHref = getRelativeLocaleUrl(lang, '/');
|
|
---
|
|
<!doctype html>
|
|
<html lang={lang}>
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>{title} · VillaFleurie</title>
|
|
<meta name="description" content={description} />
|
|
<link rel="canonical" href={canonicalUrl} />
|
|
<link rel="icon" href="/assets/images/logo.png" />
|
|
<link rel="alternate" hreflang="fr" href={altFr} />
|
|
<link rel="alternate" hreflang="en" href={altEn} />
|
|
<link rel="alternate" hreflang="x-default" href="/fr/" />
|
|
<!-- Open Graph -->
|
|
<meta property="og:type" content="website" />
|
|
<meta property="og:site_name" content="VillaFleurie" />
|
|
<meta property="og:title" content={`${title} · VillaFleurie`} />
|
|
<meta property="og:description" content={description} />
|
|
<meta property="og:url" content={canonicalUrl} />
|
|
<meta property="og:image" content={new URL('/assets/images/header-background-1.jpg', Astro.site ?? 'https://villafleuriegp.com').toString()} />
|
|
<!-- Twitter -->
|
|
<meta name="twitter:card" content="summary_large_image" />
|
|
<meta name="twitter:title" content={`${title} · VillaFleurie`} />
|
|
<meta name="twitter:description" content={description} />
|
|
<meta name="twitter:image" content={new URL('/assets/images/header-background-1.jpg', Astro.site ?? 'https://villafleuriegp.com').toString()} />
|
|
<!-- Robots -->
|
|
<meta name="robots" content="index, follow" />
|
|
</head>
|
|
<body class="min-h-screen flex flex-col bg-white text-slate-900">
|
|
<header class="sticky top-0 z-50 border-b border-slate-200 bg-white/80 backdrop-blur">
|
|
<nav class="mx-auto max-w-6xl p-4">
|
|
<div class="flex items-center justify-between">
|
|
<a href={homeHref} class="flex items-center gap-3">
|
|
<img src="/assets/images/logo.png" alt="VillaFleurie" class="h-10 w-auto" />
|
|
<span class="sr-only">VillaFleurie</span>
|
|
</a>
|
|
<div class="flex items-center gap-4">
|
|
<button id="nav-toggle" class="md:hidden inline-flex items-center justify-center rounded-lg border border-slate-300 px-3 py-2" aria-controls="mobile-menu" aria-expanded="false">
|
|
<span class="sr-only">Toggle navigation</span>
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="h-5 w-5"><path fill-rule="evenodd" d="M3.75 6.75A.75.75 0 0 1 4.5 6h15a.75.75 0 0 1 0 1.5h-15a.75.75 0 0 1-.75-.75ZM3.75 12a.75.75 0 0 1 .75-.75h15a.75.75 0 0 1 0 1.5h-15A.75.75 0 0 1 3.75 12Zm0 5.25a.75.75 0 0 1 .75-.75h15a.75.75 0 0 1 0 1.5h-15a.75.75 0 0 1-.75-.75Z" clip-rule="evenodd"/></svg>
|
|
</button>
|
|
<div class="hidden md:flex items-center gap-4">
|
|
{nav.map((n) => <a href={n.href} class="text-sm hover:underline">{n.label}</a>)}
|
|
<a href={getRelativeLocaleUrl(lang, '/contact/')} class="inline-flex items-center rounded-lg bg-brand px-3 py-2 text-white hover:bg-brand-600">{ctaLabel}</a>
|
|
<div class="ml-2 flex items-center gap-2 text-xs">
|
|
<a href={altFr} class={"hover:underline " + (lang==='fr' ? 'font-semibold text-brand-600' : '')}>FR</a>
|
|
<span class="text-slate-400">|</span>
|
|
<a href={altEn} class={"hover:underline " + (lang==='en' ? 'font-semibold text-brand-600' : '')}>EN</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="mobile-menu" class="mt-3 hidden md:hidden border-t border-slate-200 pt-3">
|
|
<div class="flex flex-col gap-3">
|
|
{nav.map((n) => <a href={n.href} class="text-base">{n.label}</a>)}
|
|
<a href={getRelativeLocaleUrl(lang, '/contact/')} class="inline-flex items-center justify-center rounded-lg bg-brand px-4 py-2 text-white hover:bg-brand-600">{ctaLabel}</a>
|
|
<div class="flex items-center gap-2 text-sm">
|
|
<span class="text-slate-500">Lang:</span>
|
|
<a href={altFr} class={"hover:underline " + (lang==='fr' ? 'font-semibold text-brand-600' : '')}>FR</a>
|
|
<span class="text-slate-400">|</span>
|
|
<a href={altEn} class={"hover:underline " + (lang==='en' ? 'font-semibold text-brand-600' : '')}>EN</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
</header>
|
|
<main class="flex-1">
|
|
<slot />
|
|
</main>
|
|
<footer class="mt-auto border-t border-slate-200">
|
|
<div class="mx-auto max-w-6xl p-6 text-sm text-slate-600 flex flex-col md:flex-row items-start md:items-center justify-between gap-4">
|
|
<div>
|
|
<p>Contact: <a class="underline" href="mailto:location.villafleurie@gmail.com">location.villafleurie@gmail.com</a> · <a class="underline" href="tel:+33658961279">+33 6 58 96 12 79</a></p>
|
|
<p class="mt-1">© VillaFleurie · Web design: <a href="https://ruidy.nemausat.com" target="_blank" rel="noopener" class="underline">Ruidy Nemausat</a></p>
|
|
</div>
|
|
<ul class="flex gap-4">
|
|
{lang === 'en' ? (
|
|
<>
|
|
<li><a class="underline" href={getRelativeLocaleUrl('en','/policies/terms/')}>Terms</a></li>
|
|
<li><a class="underline" href={getRelativeLocaleUrl('en','/policies/privacy/')}>Privacy</a></li>
|
|
<li><a class="underline" href={getRelativeLocaleUrl('en','/policies/cancellation/')}>Cancellation</a></li>
|
|
<li><a class="underline" href={getRelativeLocaleUrl('en','/policies/house-rules/')}>House Rules</a></li>
|
|
</>
|
|
) : (
|
|
<>
|
|
<li><a class="underline" href={getRelativeLocaleUrl('fr','/politiques/conditions/')}>Conditions</a></li>
|
|
<li><a class="underline" href={getRelativeLocaleUrl('fr','/politiques/confidentialite/')}>Confidentialité</a></li>
|
|
<li><a class="underline" href={getRelativeLocaleUrl('fr','/politiques/annulation/')}>Annulation</a></li>
|
|
<li><a class="underline" href={getRelativeLocaleUrl('fr','/politiques/reglement/')}>Règlement intérieur</a></li>
|
|
</>
|
|
)}
|
|
</ul>
|
|
</div>
|
|
</footer>
|
|
<script>
|
|
// Plausible init
|
|
window.plausible = window.plausible || function(){(window.plausible.q = window.plausible.q || []).push(arguments)}
|
|
// Sticky header shadow on scroll
|
|
const header = document.querySelector('header');
|
|
if (header) {
|
|
const onScroll = () => header.classList.toggle('shadow-sm', window.scrollY > 0);
|
|
onScroll();
|
|
window.addEventListener('scroll', onScroll, { passive: true });
|
|
}
|
|
// Mobile nav toggle
|
|
const btn = document.getElementById('nav-toggle');
|
|
const menu = document.getElementById('mobile-menu');
|
|
if (btn && menu) {
|
|
btn.addEventListener('click', () => {
|
|
const isHidden = menu.classList.contains('hidden');
|
|
menu.classList.toggle('hidden', !isHidden);
|
|
btn.setAttribute('aria-expanded', String(isHidden));
|
|
});
|
|
}
|
|
</script>
|
|
<script defer data-domain="villafleuriegp.com" src="https://plausible.nemausat.com/js/script.outbound-links.js"></script>
|
|
<script type="application/ld+json">{JSON.stringify({
|
|
'@context': 'https://schema.org',
|
|
'@type': 'LodgingBusiness',
|
|
name: 'VillaFleurie',
|
|
url: canonicalUrl,
|
|
image: new URL('/assets/images/header-background-1.jpg', Astro.site ?? 'https://villafleuriegp.com').toString(),
|
|
telephone: '+33 6 58 96 12 79',
|
|
email: 'location.villafleurie@gmail.com',
|
|
address: {
|
|
'@type': 'PostalAddress',
|
|
streetAddress: '4 rue Gerty Archimède',
|
|
addressLocality: 'Le Gosier',
|
|
postalCode: '97190',
|
|
addressCountry: 'GP'
|
|
},
|
|
geo: { '@type': 'GeoCoordinates', latitude: 16.206971, longitude: -61.487159 },
|
|
hasMap: 'https://www.google.com/maps?q=16.206971,-61.487159'
|
|
})}</script>
|
|
</body>
|
|
</html>
|