better responsive and added translation for cookie banner
This commit is contained in:
parent
34116e0957
commit
0624060b2d
0
public/cv.pdf
Normal file
0
public/cv.pdf
Normal file
@ -57,9 +57,9 @@ export const CookieBanner = () => {
|
|||||||
<Cookie className="w-5 h-5 text-primary" />
|
<Cookie className="w-5 h-5 text-primary" />
|
||||||
</div>
|
</div>
|
||||||
<div className="flex-1">
|
<div className="flex-1">
|
||||||
<h3 className="font-semibold text-base mb-1">Cookies</h3>
|
<h3 className="font-semibold text-base mb-1">{t("cookies.title")}</h3>
|
||||||
<p className="text-sm text-muted-foreground">
|
<p className="text-sm text-muted-foreground">
|
||||||
Nous utilisons des cookies pour améliorer votre expérience et analyser le trafic.
|
{t("cookies.description")}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -71,7 +71,7 @@ export const CookieBanner = () => {
|
|||||||
onClick={acceptAllCookies}
|
onClick={acceptAllCookies}
|
||||||
className="flex-1"
|
className="flex-1"
|
||||||
>
|
>
|
||||||
Accepter
|
{t("cookies.accept")}
|
||||||
</Button>
|
</Button>
|
||||||
<Button
|
<Button
|
||||||
variant="outline"
|
variant="outline"
|
||||||
@ -79,7 +79,7 @@ export const CookieBanner = () => {
|
|||||||
onClick={rejectAll}
|
onClick={rejectAll}
|
||||||
className="flex-1"
|
className="flex-1"
|
||||||
>
|
>
|
||||||
Refuser
|
{t("cookies.reject")}
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -5,12 +5,13 @@ import { useCookieBanner } from "@/contexts/CookieBannerContext";
|
|||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
import { Separator } from "@/components/ui/separator";
|
import { Separator } from "@/components/ui/separator";
|
||||||
import { LegalNoticeModal } from "@/components/LegalNoticeModal";
|
import { LegalNoticeModal } from "@/components/LegalNoticeModal";
|
||||||
import { Github, Mail, ExternalLink, Cookie, FileText } from "lucide-react";
|
import { Github, Mail, ExternalLink, Cookie, FileText, Download } from "lucide-react";
|
||||||
|
|
||||||
export const Footer = () => {
|
export const Footer = () => {
|
||||||
const { t } = useLanguage();
|
const { t } = useLanguage();
|
||||||
const { showBanner } = useCookieBanner();
|
const { showBanner } = useCookieBanner();
|
||||||
const [showLegalNotice, setShowLegalNotice] = useState(false);
|
const [showLegalNotice, setShowLegalNotice] = useState(false);
|
||||||
|
const [showCVPopup, setShowCVPopup] = useState(false);
|
||||||
|
|
||||||
const reopenCookiePreferences = () => {
|
const reopenCookiePreferences = () => {
|
||||||
// Simplement rouvrir la bannière sans recharger
|
// Simplement rouvrir la bannière sans recharger
|
||||||
@ -20,6 +21,11 @@ export const Footer = () => {
|
|||||||
const currentYear = new Date().getFullYear();
|
const currentYear = new Date().getFullYear();
|
||||||
|
|
||||||
const footerLinks = [
|
const footerLinks = [
|
||||||
|
{
|
||||||
|
icon: <Download className="w-4 h-4" />,
|
||||||
|
label: t("footer.downloadCV"),
|
||||||
|
onClick: () => setShowCVPopup(true)
|
||||||
|
},
|
||||||
{
|
{
|
||||||
icon: <FileText className="w-4 h-4" />,
|
icon: <FileText className="w-4 h-4" />,
|
||||||
label: t("footer.legalNotice"),
|
label: t("footer.legalNotice"),
|
||||||
@ -35,12 +41,12 @@ export const Footer = () => {
|
|||||||
const socialLinks = [
|
const socialLinks = [
|
||||||
{
|
{
|
||||||
icon: <Github className="w-5 h-5" />,
|
icon: <Github className="w-5 h-5" />,
|
||||||
label: "GitHub",
|
label: t("footer.github"),
|
||||||
href: "https://github.com/kinou-p"
|
href: "https://github.com/kinou-p"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
icon: <Mail className="w-5 h-5" />,
|
icon: <Mail className="w-5 h-5" />,
|
||||||
label: "Email",
|
label: t("footer.email"),
|
||||||
href: "mailto:contact@apommier.com"
|
href: "mailto:contact@apommier.com"
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
@ -125,7 +131,7 @@ export const Footer = () => {
|
|||||||
className="space-y-4 md:max-w-xs"
|
className="space-y-4 md:max-w-xs"
|
||||||
>
|
>
|
||||||
<h3 className="font-semibold text-lg">{t("footer.information")}</h3>
|
<h3 className="font-semibold text-lg">{t("footer.information")}</h3>
|
||||||
<nav className="space-y-2">
|
<nav className="flex flex-col space-y-2">
|
||||||
{footerLinks.map((link, index) => (
|
{footerLinks.map((link, index) => (
|
||||||
<Button
|
<Button
|
||||||
key={link.label}
|
key={link.label}
|
||||||
@ -179,6 +185,21 @@ export const Footer = () => {
|
|||||||
isOpen={showLegalNotice}
|
isOpen={showLegalNotice}
|
||||||
onClose={() => setShowLegalNotice(false)}
|
onClose={() => setShowLegalNotice(false)}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
{/* Popup CV en travaux */}
|
||||||
|
{showCVPopup && (
|
||||||
|
<div className="fixed inset-0 bg-black/50 flex items-center justify-center z-50" onClick={() => setShowCVPopup(false)}>
|
||||||
|
<div className="bg-background p-6 rounded-lg shadow-lg max-w-sm mx-4" onClick={(e) => e.stopPropagation()}>
|
||||||
|
<h3 className="text-lg font-semibold mb-2">{t("footer.cvWorkInProgressTitle")}</h3>
|
||||||
|
<p className="text-muted-foreground mb-4">
|
||||||
|
{t("footer.cvWorkInProgress")}
|
||||||
|
</p>
|
||||||
|
<Button onClick={() => setShowCVPopup(false)} className="w-full">
|
||||||
|
{t("footer.understood")}
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
</footer>
|
</footer>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
@ -32,10 +32,10 @@ const ProjectPageContent = () => {
|
|||||||
return (
|
return (
|
||||||
<div className="min-h-screen flex items-center justify-center">
|
<div className="min-h-screen flex items-center justify-center">
|
||||||
<div className="text-center">
|
<div className="text-center">
|
||||||
<h1 className="text-4xl font-bold mb-4">{t("project.notFound") || "Project not found"}</h1>
|
<h1 className="text-4xl font-bold mb-4">{t("project.notFound")}</h1>
|
||||||
<Button onClick={() => navigate("/")}>
|
<Button onClick={() => navigate("/")}>
|
||||||
<ArrowLeft className="w-4 h-4 mr-2" />
|
<ArrowLeft className="w-4 h-4 mr-2" />
|
||||||
{t("project.backToHome") || "Back to Home"}
|
{t("project.backToHome")}
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -43,7 +43,7 @@ const ProjectPageContent = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="min-h-screen">
|
<div className="min-h-screen overflow-y-hidden">
|
||||||
<ScrollProgress />
|
<ScrollProgress />
|
||||||
<Header />
|
<Header />
|
||||||
|
|
||||||
@ -56,7 +56,7 @@ const ProjectPageContent = () => {
|
|||||||
transition={{ duration: 0.5 }}
|
transition={{ duration: 0.5 }}
|
||||||
className="max-w-4xl mx-auto text-center mb-12"
|
className="max-w-4xl mx-auto text-center mb-12"
|
||||||
>
|
>
|
||||||
<h1 className="text-5xl md:text-7xl font-bold mb-6">
|
<h1 className="text-3xl sm:text-4xl md:text-5xl lg:text-6xl xl:text-7xl font-bold mb-6">
|
||||||
{project.title[language]}
|
{project.title[language]}
|
||||||
</h1>
|
</h1>
|
||||||
<p className="text-xl md:text-2xl text-muted-foreground mb-8">
|
<p className="text-xl md:text-2xl text-muted-foreground mb-8">
|
||||||
@ -261,7 +261,7 @@ const ProjectPageContent = () => {
|
|||||||
className="gap-2"
|
className="gap-2"
|
||||||
>
|
>
|
||||||
<ArrowLeft className="w-5 h-5" />
|
<ArrowLeft className="w-5 h-5" />
|
||||||
{t("project.backToHome") || "Back to Home"}
|
{t("project.backToHome")}
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
</motion.div>
|
</motion.div>
|
||||||
|
|||||||
@ -73,9 +73,21 @@ export const translations = {
|
|||||||
information: "Informations",
|
information: "Informations",
|
||||||
legalNotice: "Mentions légales",
|
legalNotice: "Mentions légales",
|
||||||
cookieManagement: "Gestion des cookies",
|
cookieManagement: "Gestion des cookies",
|
||||||
|
downloadCV: "Télécharger mon CV",
|
||||||
|
cvWorkInProgressTitle: "CV en travaux",
|
||||||
|
cvWorkInProgress: "Mon CV est actuellement en cours de préparation. Il sera bientôt disponible !",
|
||||||
|
understood: "Compris",
|
||||||
|
github: "GitHub",
|
||||||
|
email: "Email",
|
||||||
copyright: "Tous droits réservés.",
|
copyright: "Tous droits réservés.",
|
||||||
builtWith: "Construit avec",
|
builtWith: "Construit avec",
|
||||||
},
|
},
|
||||||
|
cookies: {
|
||||||
|
title: "Cookies",
|
||||||
|
description: "Nous utilisons des cookies pour améliorer votre expérience et analyser le trafic.",
|
||||||
|
accept: "Accepter",
|
||||||
|
reject: "Refuser",
|
||||||
|
},
|
||||||
project: {
|
project: {
|
||||||
back: "Retour",
|
back: "Retour",
|
||||||
backToHome: "Retour à l'accueil",
|
backToHome: "Retour à l'accueil",
|
||||||
@ -166,9 +178,21 @@ export const translations = {
|
|||||||
information: "Information",
|
information: "Information",
|
||||||
legalNotice: "Legal Notice",
|
legalNotice: "Legal Notice",
|
||||||
cookieManagement: "Cookie Management",
|
cookieManagement: "Cookie Management",
|
||||||
|
downloadCV: "Download my CV",
|
||||||
|
cvWorkInProgressTitle: "CV Work in Progress",
|
||||||
|
cvWorkInProgress: "My CV is currently being prepared. It will be available soon!",
|
||||||
|
understood: "Understood",
|
||||||
|
github: "GitHub",
|
||||||
|
email: "Email",
|
||||||
copyright: "All rights reserved.",
|
copyright: "All rights reserved.",
|
||||||
builtWith: "Built with",
|
builtWith: "Built with",
|
||||||
},
|
},
|
||||||
|
cookies: {
|
||||||
|
title: "Cookies",
|
||||||
|
description: "We use cookies to improve your experience and analyze traffic.",
|
||||||
|
accept: "Accept",
|
||||||
|
reject: "Reject",
|
||||||
|
},
|
||||||
project: {
|
project: {
|
||||||
back: "Back",
|
back: "Back",
|
||||||
backToHome: "Back to Home",
|
backToHome: "Back to Home",
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user