Files
Compagnon-du-Lagon---Marama/components/Logo.tsx
syoul 444a2729ee feat: Intégration logo SVG et améliorations
- Logo Relais Marama en format SVG (relais_marama02.svg)
- Ajout du texte 'Fakarava' sous le logo
- Suppression de la question sur la climatisation (pas de clim)
- Configuration serveur pour accès réseau local (mobile)
- Redirection page racine vers /accueil améliorée
- Données plages et épiceries de Fakarava intégrées
- Mise à jour titre app: 'Compagnon du lagon - Pension Marama'
2025-11-23 08:42:55 +01:00

57 lines
1.7 KiB
TypeScript
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

"use client";
import { useState, useEffect } from "react";
interface LogoProps {
size?: number;
className?: string;
}
export default function Logo({ size = 120, className = "" }: LogoProps) {
const [imageError, setImageError] = useState(false);
const [imageLoaded, setImageLoaded] = useState(false);
useEffect(() => {
const img = new window.Image();
img.onload = () => setImageLoaded(true);
img.onerror = () => setImageError(true);
// Essayer d'abord le SVG, puis le PNG en fallback
img.src = "/logo-relais-marama.svg";
}, []);
if (imageError || !imageLoaded) {
return (
<div className={`flex flex-col items-center justify-center ${className}`}>
<div
className="bg-gradient-to-br from-primary/20 to-secondary rounded-full flex flex-col items-center justify-center text-primary font-bold border-2 border-primary/30"
style={{ width: size, height: size }}
>
<span className="text-2xl mb-1">🏝</span>
<span style={{ fontSize: size * 0.2 }}>Relais</span>
<span style={{ fontSize: size * 0.15 }}>Marama</span>
</div>
<p className="text-primary font-semibold mt-2" style={{ fontSize: `${size * 0.15}px` }}>
Fakarava
</p>
</div>
);
}
return (
<div className={`flex flex-col items-center justify-center ${className}`}>
<img
src="/logo-relais-marama.svg"
alt="Relais Marama - Fakarava"
width={size}
height={size}
className="object-contain"
style={{ maxWidth: `${size}px`, maxHeight: `${size}px` }}
/>
<p className="text-primary font-semibold mt-2" style={{ fontSize: `${size * 0.15}px` }}>
Fakarava
</p>
</div>
);
}