bender/b6d5bfc0-bbe5-4f89-8ea0-8eeff61adf10
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_2 into main #2

Merged
bender merged 8 commits from version_2 into main 2026-03-06 13:39:30 +00:00
Conversation 0 Commits 8 Files Changed 8 +79 -265
8 changed files with 79 additions and 265 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
src/app/about/page.tsx
View File

@@ -30,12 +30,10 @@ export default function AboutPage() {
secondaryButtonStyle="radial-glow"
headingFontWeight="bold"
>
{/* Navbar */}
<div id="nav" data-section="nav">
<NavbarStyleApple brandName="Rami Haddad" navItems={navItems} />
</div>
{/* About Section */}
<div id="about" data-section="about">
<SplitAbout
title="Qui est Rami Haddad"
@@ -44,28 +42,20 @@ export default function AboutPage() {
tagAnimation="slide-up"
bulletPoints={[
{
title: "Créativité",
description: "Chaque projet est une opportunité d'explorer de nouvelles perspectives et de repousser les limites créatives.",
icon: Sparkles,
title: "Créativité", description: "Chaque projet est une opportunité d'explorer de nouvelles perspectives et de repousser les limites créatives.", icon: Sparkles,
},
{
title: "Moments authentiques",
description: "Je capture des instants vrais et spontanés qui racontent une histoire émotionnelle.",
icon: Heart,
title: "Moments authentiques", description: "Je capture des instants vrais et spontanés qui racontent une histoire émotionnelle.", icon: Heart,
},
{
title: "Attention au détail",
description: "Chaque élément, de la lumière à la composition, est pensé avec soin pour un résultat impeccable.",
icon: Eye,
title: "Attention au détail", description: "Chaque élément, de la lumière à la composition, est pensé avec soin pour un résultat impeccable.", icon: Eye,
},
{
title: "Narration visuelle",
description: "La photographie est un langage ; je raconte des histoires à travers mes images.",
icon: BookOpen,
title: "Narration visuelle", description: "La photographie est un langage ; je raconte des histoires à travers mes images.", icon: BookOpen,
},
]}
imageSrc="http://img.b2bpic.net/free-photo/full-shot-woman-working-as-photographer_52683-110079.jpg?_wi=2"
imageAlt="Rami Haddad, photographe"
imageSrc="https://images.unsplash.com/photo-1502920917128-1aa500764cbd?w=800&q=80"
imageAlt="Rami Haddad, photographe professionnel"
mediaAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
@@ -74,7 +64,6 @@ export default function AboutPage() {
/>
</div>
{/* Portfolio Categories */}
<div id="categories" data-section="categories">
<FeatureCardTwentySeven
title="Domaines de spécialité"
@@ -83,26 +72,11 @@ export default function AboutPage() {
tagAnimation="slide-up"
features={[
{
id: "portrait",
title: "Portrait",
description: "Portraits professionnels, marque personnelle et portraits artistiques qui capturent l'essence du sujet.",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021812.jpg?_wi=3",
imageAlt: "Portrait photography",
},
id: "portrait", title: "Portrait", description: "Portraits professionnels, marque personnelle et portraits artistiques qui capturent l'essence du sujet.", imageSrc: "https://images.unsplash.com/photo-1535632066927-ab7c9ab60908?w=800&q=80", imageAlt: "Portrait photography male professional"},
{
id: "event",
title: "Événement",
description: "Couverture complète des événements corporatifs, célébrations et événements culturels avec une perspective dynamique.",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-friends-hanging-out_23-2149143994.jpg?_wi=3",
imageAlt: "Event photography",
},
id: "event", title: "Événement", description: "Couverture complète des événements corporatifs, célébrations et événements culturels avec une perspective dynamique.", imageSrc: "https://images.unsplash.com/photo-1492684223066-81342ee5ff30?w=800&q=80", imageAlt: "Event photography professional"},
{
id: "nature",
title: "Nature",
description: "Photographie de paysages et de nature du Québec et au-delà, explorant la beauté brute de l'environnement.",
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-shot-blue-lake-surrounded-with-tall-trees_181624-22773.jpg?_wi=3",
imageAlt: "Nature photography",
},
id: "nature", title: "Nature", description: "Photographie de paysages et de nature du Québec et au-delà, explorant la beauté brute de l'environnement.", imageSrc: "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=800&q=80", imageAlt: "Nature photography landscape"},
]}
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
@@ -112,7 +86,6 @@ export default function AboutPage() {
/>
</div>
{/* Call to Action */}
<div id="contact-cta" data-section="contact-cta">
<ContactText
text="Vous avez un projet photo en tête ? Parlons de votre vision et créons quelque chose d'extraordinaire ensemble."
@@ -120,26 +93,21 @@ export default function AboutPage() {
background={{ variant: "plain" }}
useInvertedBackground={false}
buttons={[
{ text: "Contactez-moi", href: "/contact" },
{ text: "Voir Portfolio", href: "/portfolio" },
{ text: "Contactez-moi", href: "contact" },
{ text: "Voir Portfolio", href: "portfolio" },
]}
/>
</div>
{/* Footer */}
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Rami Haddad"
leftLink={{
text: "Politique de confidentialité",
href: "#",
}}
text: "Politique de confidentialité", href: "#"}}
rightLink={{
text: "Conditions d'utilisation",
href: "#",
}}
text: "Conditions d'utilisation", href: "#"}}
/>
</div>
</ThemeProvider>
);
}
}

7
src/app/contact/page.tsx
View File

@@ -27,7 +27,6 @@ export default function ContactPage() {
secondaryButtonStyle="radial-glow"
headingFontWeight="bold"
>
{/* Navigation */}
<div id="nav" data-section="nav">
<NavbarStyleApple
brandName="Rami Haddad"
@@ -40,7 +39,6 @@ export default function ContactPage() {
/>
</div>
{/* Contact Section */}
<div id="contact-cta" data-section="contact-cta">
<ContactText
text="Vous avez un projet photo en tête ? Parlons de votre vision et créons quelque chose d'extraordinaire ensemble."
@@ -49,12 +47,11 @@ export default function ContactPage() {
useInvertedBackground={false}
buttons={[
{ text: "Contactez-moi", href: "#" },
{ text: "Voir Portfolio", href: "#" },
{ text: "Voir Portfolio", href: "portfolio" },
]}
/>
</div>
{/* Footer */}
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Rami Haddad"
@@ -64,4 +61,4 @@ export default function ContactPage() {
</div>
</ThemeProvider>
);
}
}

51
src/app/layout.tsx
View File

@@ -1,54 +1,31 @@
import type { Metadata } from "next";
import { Halant } from "next/font/google";
import { Inter } from "next/font/google";
import { Lato } from "next/font/google";
import { Poppins } from "next/font/google";
import { Manrope } from "next/font/google";
import "./globals.css";
import { ServiceWrapper } from "@/components/ServiceWrapper";
import Tag from "@/tag/Tag";
const halant = Halant({
variable: "--font-halant",
subsets: ["latin"],
weight: ["300", "400", "500", "600", "700"],
const poppins = Poppins({
variable: "--font-poppins", subsets: ["latin"],
weight: ["100", "200", "300", "400", "500", "600", "700", "800", "900"],
});
const inter = Inter({
variable: "--font-inter",
subsets: ["latin"],
});
const lato = Lato({
variable: "--font-lato",
subsets: ["latin"],
weight: ["100", "300", "400", "700", "900"],
const manrope = Manrope({
variable: "--font-manrope", subsets: ["latin"],
});
export const metadata: Metadata = {
title: "Rami Haddad Photographe | Portrait • Événement • Nature au Québec",
description: "Photographe professionnel au Québec spécialisé en portrait, événement et photographie de nature. Exploration créative et moments authentiques capturés avec passion.",
keywords: "photographe québec, portrait photography, event photography, nature photography, rami haddad",
metadataBase: new URL("https://ramihaddad.com"),
title: "Rami Haddad Photographe | Portrait • Événement • Nature au Québec", description: "Photographe professionnel au Québec spécialisé en portrait, événement et photographie de nature. Exploration créative et moments authentiques capturés avec passion.", keywords: "photographe québec, portrait photography, event photography, nature photography, rami haddad", metadataBase: new URL("https://ramihaddad.com"),
alternates: {
canonical: "https://ramihaddad.com",
},
canonical: "https://ramihaddad.com"},
openGraph: {
title: "Rami Haddad Photographe | Portrait • Événement • Nature",
description: "Découvrez le portfolio de Rami Haddad, photographe professionnel basé au Québec.",
url: "https://ramihaddad.com",
siteName: "Rami Haddad Photographe",
type: "website",
images: [
title: "Rami Haddad Photographe | Portrait • Événement • Nature", description: "Découvrez le portfolio de Rami Haddad, photographe professionnel basé au Québec.", url: "https://ramihaddad.com", siteName: "Rami Haddad Photographe", type: "website", images: [
{
url: "http://img.b2bpic.net/free-photo/woman-taking-photo_53876-32442.jpg",
alt: "Rami Haddad Photography Portfolio",
},
url: "http://img.b2bpic.net/free-photo/woman-taking-photo_53876-32442.jpg", alt: "Rami Haddad Photography Portfolio"},
],
},
twitter: {
card: "summary_large_image",
title: "Rami Haddad Photographe",
description: "Portrait • Événement • Nature",
images: ["http://img.b2bpic.net/free-photo/woman-taking-photo_53876-32442.jpg"],
card: "summary_large_image", title: "Rami Haddad Photographe", description: "Portrait • Événement • Nature", images: ["http://img.b2bpic.net/free-photo/woman-taking-photo_53876-32442.jpg"],
},
robots: {
index: true,
@@ -65,7 +42,7 @@ export default function RootLayout({
<html lang="en" suppressHydrationWarning>
<ServiceWrapper>
<body
className={`${halant.variable} ${inter.variable} ${lato.variable} antialiased`}
className={`${poppins.variable} ${manrope.variable} antialiased`}
>
<Tag />
{children}
@@ -1440,4 +1417,4 @@ export default function RootLayout({
</ServiceWrapper>
</html>
);
}
}

103
src/app/page.tsx
View File

@@ -46,19 +46,15 @@ export default function HomePage() {
background={{ variant: "plain" }}
mediaItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/portrait-bearded-black-man-wool-suit_613910-16021.jpg",
imageAlt: "Professional portrait photography black background",
},
imageSrc: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=800&q=80", imageAlt: "Professional male photographer portrait studio"},
{
imageSrc: "http://img.b2bpic.net/free-photo/good-friends-having-new-year-party_23-2149144094.jpg",
imageAlt: "Event photography celebration moment",
},
imageSrc: "https://images.unsplash.com/photo-1502920917128-1aa500764cbd?w=800&q=80", imageAlt: "Professional event photography male photographer at work"},
]}
rating={5}
ratingText="Capturing authentic moments"
buttons={[
{ text: "Voir le Portfolio", href: "/portfolio" },
{ text: "Réserver une séance", href: "#contact" },
{ text: "Voir le Portfolio", href: "portfolio" },
{ text: "Réserver une séance", href: "contact" },
]}
buttonAnimation="slide-up"
mediaAnimation="slide-up"
@@ -69,26 +65,11 @@ export default function HomePage() {
<FeatureCardTwentySeven
features={[
{
id: "portrait",
title: "Portrait",
description: "Portraits professionnels, marque personnelle et portraits artistiques qui capturent l'essence du sujet.",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021812.jpg?_wi=1",
imageAlt: "Professional portrait photography studio elegant",
},
id: "portrait", title: "Portrait", description: "Portraits professionnels, marque personnelle et portraits artistiques qui capturent l'essence du sujet.", imageSrc: "https://images.unsplash.com/photo-1535632066927-ab7c9ab60908?w=800&q=80", imageAlt: "Professional male portrait photography studio elegant"},
{
id: "event",
title: "Événement",
description: "Couverture complète des événements corporatifs, célébrations et événements culturels avec une perspective dynamique.",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-friends-hanging-out_23-2149143994.jpg?_wi=1",
imageAlt: "Event photography celebration moment",
},
id: "event", title: "Événement", description: "Couverture complète des événements corporatifs, célébrations et événements culturels avec une perspective dynamique.", imageSrc: "https://images.unsplash.com/photo-1492684223066-81342ee5ff30?w=800&q=80", imageAlt: "Event photography celebration moment professional"},
{
id: "nature",
title: "Nature",
description: "Photographie de paysages et de nature du Québec et au-delà, explorant la beauté brute de l'environnement.",
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-shot-blue-lake-surrounded-with-tall-trees_181624-22773.jpg?_wi=1",
imageAlt: "Landscape photography nature scenic",
},
id: "nature", title: "Nature", description: "Photographie de paysages et de nature du Québec et au-delà, explorant la beauté brute de l'environnement.", imageSrc: "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=800&q=80", imageAlt: "Landscape photography nature scenic mountain vista"},
]}
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
@@ -110,28 +91,20 @@ export default function HomePage() {
tagAnimation="slide-up"
bulletPoints={[
{
title: "Créativité",
description: "Chaque projet est une opportunité d'explorer de nouvelles perspectives et de repousser les limites créatives.",
icon: Sparkles,
title: "Créativité", description: "Chaque projet est une opportunité d'explorer de nouvelles perspectives et de repousser les limites créatives.", icon: Sparkles,
},
{
title: "Moments authentiques",
description: "Je capture des instants vrais et spontanés qui racontent une histoire émotionnelle.",
icon: Heart,
title: "Moments authentiques", description: "Je capture des instants vrais et spontanés qui racontent une histoire émotionnelle.", icon: Heart,
},
{
title: "Attention au détail",
description: "Chaque élément, de la lumière à la composition, est pensé avec soin pour un résultat impeccable.",
icon: Eye,
title: "Attention au détail", description: "Chaque élément, de la lumière à la composition, est pensé avec soin pour un résultat impeccable.", icon: Eye,
},
{
title: "Narration visuelle",
description: "La photographie est un langage ; je raconte des histoires à travers mes images.",
icon: BookOpen,
title: "Narration visuelle", description: "La photographie est un langage ; je raconte des histoires à travers mes images.", icon: BookOpen,
},
]}
imageSrc="http://img.b2bpic.net/free-photo/full-shot-woman-working-as-photographer_52683-110079.jpg?_wi=1"
imageAlt="Rami Haddad, photographe"
imageSrc="https://images.unsplash.com/photo-1502920917128-1aa500764cbd?w=800&q=80"
imageAlt="Rami Haddad, photographe professionnel au travail"
mediaAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
@@ -144,26 +117,11 @@ export default function HomePage() {
<ProductCardThree
products={[
{
id: "gallery-item-1",
name: "Portrait Studio",
price: "À partir de 250$",
imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-chair-being-photographed_23-2148565559.jpg?_wi=1",
imageAlt: "Professional portrait photography studio",
},
id: "gallery-item-1", name: "Portrait Studio", price: "À partir de 250$", imageSrc: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=800&q=80", imageAlt: "Professional portrait photography studio male model"},
{
id: "gallery-item-2",
name: "Événement Pro",
price: "À partir de 800$",
imageSrc: "http://img.b2bpic.net/free-photo/fancy-dressed-man-woman-silver-gown-hug-each-other-tender-standing-before-christmas-tree_8353-9054.jpg?_wi=1",
imageAlt: "Event photography celebration capture",
},
id: "gallery-item-2", name: "Événement Pro", price: "À partir de 800$", imageSrc: "https://images.unsplash.com/photo-1492684223066-81342ee5ff30?w=800&q=80", imageAlt: "Event photography professional coverage celebration"},
{
id: "gallery-item-3",
name: "Nature & Paysage",
price: "À partir de 300$",
imageSrc: "http://img.b2bpic.net/free-photo/skjolden-norway-may-16-2023-mountain_58702-16470.jpg?_wi=1",
imageAlt: "Landscape photography nature scenic beautiful",
},
id: "gallery-item-3", name: "Nature & Paysage", price: "À partir de 300$", imageSrc: "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=800&q=80", imageAlt: "Landscape photography nature scenic mountain beautiful"},
]}
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
@@ -181,26 +139,11 @@ export default function HomePage() {
<FeatureCardTwentySeven
features={[
{
id: "service-portrait",
title: "Photographie de Portrait",
description: "Portraits professionnels pour la marque personnelle, shootings artistiques et portraits en studio ou en extérieur avec éclairage premium.",
imageSrc: "http://img.b2bpic.net/free-photo/fashion-beautiful-elegant-young-woman-pretty-black-sweater_114579-81915.jpg?_wi=1",
imageAlt: "Professional portrait photography session",
},
id: "service-portrait", title: "Photographie de Portrait", description: "Portraits professionnels pour la marque personnelle, shootings artistiques et portraits en studio ou en extérieur avec éclairage premium.", imageSrc: "https://images.unsplash.com/photo-1535632066927-ab7c9ab60908?w=800&q=80", imageAlt: "Professional portrait photography session male subject"},
{
id: "service-event",
title: "Photographie d'Événement",
description: "Couverture complète d'événements corporatifs, mariages, célébrations avec capture des moments clés et ambiance générale.",
imageSrc: "http://img.b2bpic.net/free-photo/beach-party-sunset_1098-13571.jpg?_wi=1",
imageAlt: "Event photography celebration professional",
},
id: "service-event", title: "Photographie d'Événement", description: "Couverture complète d'événements corporatifs, mariages, célébrations avec capture des moments clés et ambiance générale.", imageSrc: "https://images.unsplash.com/photo-1514320291840-2e0a9bf2a9ae?w=800&q=80", imageAlt: "Event photography professional celebration moment"},
{
id: "service-nature",
title: "Photographie de Nature",
description: "Photographie de paysages et exploration de la nature, du Québec aux destinations lointaines, avec expertise en conditions variées.",
imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-trees-lake-maksimir-park-zagreb-croatia-springtime_181624-22043.jpg?_wi=1",
imageAlt: "Landscape photography nature scenic",
},
id: "service-nature", title: "Photographie de Nature", description: "Photographie de paysages et exploration de la nature, du Québec aux destinations lointaines, avec expertise en conditions variées.", imageSrc: "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=800&q=80", imageAlt: "Landscape photography nature scenic professional"},
]}
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
@@ -209,7 +152,7 @@ export default function HomePage() {
tag="Services"
tagIcon={Camera}
tagAnimation="slide-up"
buttons={[{ text: "Vous avez un projet ?", href: "#contact" }]}
buttons={[{ text: "Vous avez un projet ?", href: "contact" }]}
textboxLayout="default"
useInvertedBackground={false}
buttonAnimation="slide-up"
@@ -223,8 +166,8 @@ export default function HomePage() {
background={{ variant: "plain" }}
useInvertedBackground={false}
buttons={[
{ text: "Contactez-moi", href: "#contact" },
{ text: "Voir Portfolio", href: "/portfolio" },
{ text: "Contactez-moi", href: "contact" },
{ text: "Voir Portfolio", href: "portfolio" },
]}
/>
</div>
@@ -238,4 +181,4 @@ export default function HomePage() {
</div>
</ThemeProvider>
);
}
}

46
src/app/portfolio/page.tsx
View File

@@ -37,26 +37,11 @@ export default function PortfolioPage() {
<FeatureCardTwentySeven
features={[
{
id: "portfolio-portrait",
title: "Portrait",
description: "Exploration approfondie de la photographie de portrait, capturant l'essence et la personnalité de chaque sujet avec éclairage et composition maîtrisés.",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021812.jpg?_wi=2",
imageAlt: "Professional portrait photography studio elegant",
},
id: "portfolio-portrait", title: "Portrait", description: "Exploration approfondie de la photographie de portrait, capturant l'essence et la personnalité de chaque sujet avec éclairage et composition maîtrisés.", imageSrc: "https://images.unsplash.com/photo-1535632066927-ab7c9ab60908?w=800&q=80", imageAlt: "Professional male portrait photography studio elegant"},
{
id: "portfolio-event",
title: "Événement",
description: "Couverture complète d'événements, des mariages aux événements corporatifs, capturant les moments émouvants et la dynamique de chaque occasion.",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-friends-hanging-out_23-2149143994.jpg?_wi=2",
imageAlt: "Event photography celebration moment",
},
id: "portfolio-event", title: "Événement", description: "Couverture complète d'événements, des mariages aux événements corporatifs, capturant les moments émouvants et la dynamique de chaque occasion.", imageSrc: "https://images.unsplash.com/photo-1492684223066-81342ee5ff30?w=800&q=80", imageAlt: "Event photography celebration moment professional"},
{
id: "portfolio-nature",
title: "Nature",
description: "Photographie de paysages et de nature showcasing la beauté sauvage du Québec et au-delà, explorant la lumière naturelle et les compositions époustouflantes.",
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-shot-blue-lake-surrounded-with-tall-trees_181624-22773.jpg?_wi=2",
imageAlt: "Landscape photography nature scenic",
},
id: "portfolio-nature", title: "Nature", description: "Photographie de paysages et de nature showcasing la beauté sauvage du Québec et au-delà, explorant la lumière naturelle et les compositions époustouflantes.", imageSrc: "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=800&q=80", imageAlt: "Landscape photography nature scenic professional"},
]}
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
@@ -74,26 +59,11 @@ export default function PortfolioPage() {
<ProductCardThree
products={[
{
id: "work-1",
name: "Séance Portrait Studio",
price: "Galerie 1",
imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-chair-being-photographed_23-2148565559.jpg?_wi=2",
imageAlt: "Professional portrait photography studio",
},
id: "work-1", name: "Séance Portrait Studio", price: "Galerie 1", imageSrc: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=800&q=80", imageAlt: "Professional portrait photography studio male model"},
{
id: "work-2",
name: "Capture Événement",
price: "Galerie 2",
imageSrc: "http://img.b2bpic.net/free-photo/fancy-dressed-man-woman-silver-gown-hug-each-other-tender-standing-before-christmas-tree_8353-9054.jpg?_wi=2",
imageAlt: "Event photography celebration capture",
},
id: "work-2", name: "Capture Événement", price: "Galerie 2", imageSrc: "https://images.unsplash.com/photo-1492684223066-81342ee5ff30?w=800&q=80", imageAlt: "Event photography professional celebration capture"},
{
id: "work-3",
name: "Paysage Nature",
price: "Galerie 3",
imageSrc: "http://img.b2bpic.net/free-photo/skjolden-norway-may-16-2023-mountain_58702-16470.jpg?_wi=2",
imageAlt: "Landscape photography nature scenic beautiful",
},
id: "work-3", name: "Paysage Nature", price: "Galerie 3", imageSrc: "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=800&q=80", imageAlt: "Landscape photography nature scenic mountain beautiful"},
]}
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
@@ -114,7 +84,7 @@ export default function PortfolioPage() {
background={{ variant: "plain" }}
useInvertedBackground={false}
buttons={[
{ text: "Contactez-moi", href: "#contact" },
{ text: "Contactez-moi", href: "contact" },
{ text: "Retour à l'accueil", href: "/" },
]}
/>
@@ -129,4 +99,4 @@ export default function PortfolioPage() {
</div>
</ThemeProvider>
);
}
}

65
src/app/services/page.tsx
View File

@@ -30,12 +30,10 @@ export default function ServicesPage() {
secondaryButtonStyle="radial-glow"
headingFontWeight="bold"
>
{/* Navbar */}
<div id="nav" data-section="nav">
<NavbarStyleApple brandName="Rami Haddad" navItems={navItems} />
</div>
{/* Services Section */}
<div id="services" data-section="services">
<FeatureCardTwentySeven
title="Services Photographiques"
@@ -45,26 +43,11 @@ export default function ServicesPage() {
tagAnimation="slide-up"
features={[
{
id: "service-portrait",
title: "Photographie de Portrait",
description: "Portraits professionnels pour la marque personnelle, shootings artistiques et portraits en studio ou en extérieur avec éclairage premium.",
imageSrc: "http://img.b2bpic.net/free-photo/fashion-beautiful-elegant-young-woman-pretty-black-sweater_114579-81915.jpg?_wi=2",
imageAlt: "Professional portrait service",
},
id: "service-portrait", title: "Photographie de Portrait", description: "Portraits professionnels pour la marque personnelle, shootings artistiques et portraits en studio ou en extérieur avec éclairage premium.", imageSrc: "https://images.unsplash.com/photo-1535632066927-ab7c9ab60908?w=800&q=80", imageAlt: "Professional portrait service male photographer"},
{
id: "service-event",
title: "Photographie d'Événement",
description: "Couverture complète d'événements corporatifs, mariages, célébrations avec capture des moments clés et ambiance générale.",
imageSrc: "http://img.b2bpic.net/free-photo/beach-party-sunset_1098-13571.jpg?_wi=2",
imageAlt: "Event photography service",
},
id: "service-event", title: "Photographie d'Événement", description: "Couverture complète d'événements corporatifs, mariages, célébrations avec capture des moments clés et ambiance générale.", imageSrc: "https://images.unsplash.com/photo-1514320291840-2e0a9bf2a9ae?w=800&q=80", imageAlt: "Event photography service professional"},
{
id: "service-nature",
title: "Photographie de Nature",
description: "Photographie de paysages et exploration de la nature, du Québec aux destinations lointaines, avec expertise en conditions variées.",
imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-trees-lake-maksimir-park-zagreb-croatia-springtime_181624-22043.jpg?_wi=2",
imageAlt: "Nature photography service",
},
id: "service-nature", title: "Photographie de Nature", description: "Photographie de paysages et exploration de la nature, du Québec aux destinations lointaines, avec expertise en conditions variées.", imageSrc: "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=800&q=80", imageAlt: "Nature photography service landscape"},
]}
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
@@ -72,15 +55,12 @@ export default function ServicesPage() {
useInvertedBackground={false}
buttons={[
{
text: "Vous avez un projet ?",
href: "/contact",
},
text: "Vous avez un projet ?", href: "contact"},
]}
buttonAnimation="slide-up"
/>
</div>
{/* Gallery Showcase */}
<div id="gallery" data-section="gallery">
<ProductCardThree
title="Galerie Mise en avant"
@@ -89,26 +69,11 @@ export default function ServicesPage() {
tagAnimation="slide-up"
products={[
{
id: "gallery-item-1",
name: "Portrait Studio",
price: "À partir de 250$",
imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-chair-being-photographed_23-2148565559.jpg?_wi=3",
imageAlt: "Studio portrait session",
},
id: "gallery-item-1", name: "Portrait Studio", price: "À partir de 250$", imageSrc: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=800&q=80", imageAlt: "Studio portrait session male model"},
{
id: "gallery-item-2",
name: "Événement Pro",
price: "À partir de 800$",
imageSrc: "http://img.b2bpic.net/free-photo/fancy-dressed-man-woman-silver-gown-hug-each-other-tender-standing-before-christmas-tree_8353-9054.jpg?_wi=3",
imageAlt: "Professional event coverage",
},
id: "gallery-item-2", name: "Événement Pro", price: "À partir de 800$", imageSrc: "https://images.unsplash.com/photo-1492684223066-81342ee5ff30?w=800&q=80", imageAlt: "Professional event coverage celebration"},
{
id: "gallery-item-3",
name: "Nature & Paysage",
price: "À partir de 300$",
imageSrc: "http://img.b2bpic.net/free-photo/skjolden-norway-may-16-2023-mountain_58702-16470.jpg?_wi=3",
imageAlt: "Landscape photography",
},
id: "gallery-item-3", name: "Nature & Paysage", price: "À partir de 300$", imageSrc: "https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=800&q=80", imageAlt: "Landscape photography nature scenic"},
]}
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
@@ -118,7 +83,6 @@ export default function ServicesPage() {
/>
</div>
{/* Call to Action */}
<div id="contact-cta" data-section="contact-cta">
<ContactText
text="Vous avez un projet photo en tête ? Parlons de votre vision et créons quelque chose d'extraordinaire ensemble."
@@ -126,26 +90,21 @@ export default function ServicesPage() {
background={{ variant: "plain" }}
useInvertedBackground={false}
buttons={[
{ text: "Contactez-moi", href: "/contact" },
{ text: "Voir Portfolio", href: "/portfolio" },
{ text: "Contactez-moi", href: "contact" },
{ text: "Voir Portfolio", href: "portfolio" },
]}
/>
</div>
{/* Footer */}
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Rami Haddad"
leftLink={{
text: "Politique de confidentialité",
href: "#",
}}
text: "Politique de confidentialité", href: "#"}}
rightLink={{
text: "Conditions d'utilisation",
href: "#",
}}
text: "Conditions d'utilisation", href: "#"}}
/>
</div>
</ThemeProvider>
);
}
}

4
src/app/styles/base.css
View File

@@ -11,7 +11,7 @@ html {
body {
background-color: var(--background);
color: var(--foreground);
font-family: var(--font-lato), sans-serif;
font-family: var(--font-poppins), sans-serif;
position: relative;
min-height: 100vh;
overscroll-behavior: none;
@@ -24,5 +24,5 @@ h3,
h4,
h5,
h6 {
font-family: var(--font-lato), sans-serif;
font-family: var(--font-manrope), sans-serif;
}

8
src/app/styles/variables.css
View File

@@ -12,13 +12,13 @@
--background: #f7f6f7;
--card: #ffffff;
--foreground: #0c1325;
--primary-cta: #0798ff;
--foreground: #1a1a1a;
--primary-cta: #2c2c2c;
--primary-cta-text: #f7f6f7;
--secondary-cta: #ffffff;
--secondary-cta-text: #0c1325;
--accent: #93c7ff;
--background-accent: #a8cde8;
--accent: #5a5a5a;
--background-accent: #e0e0e0;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);