-
-
-
- {import.meta.env.VITE_APP_NAME}
-
-
-
+
);
}
+
+
diff --git a/resources/js/components/common/Container.tsx b/resources/js/components/common/Container.tsx
new file mode 100644
index 0000000..c01e748
--- /dev/null
+++ b/resources/js/components/common/Container.tsx
@@ -0,0 +1,8 @@
+import { cn } from '@/lib/utils';
+import React from "react";
+
+export function Container({ className, ...props }: React.ComponentProps<'div'>) {
+ return (
+
+ );
+}
diff --git a/resources/js/components/common/ScrollToTop.tsx b/resources/js/components/common/ScrollToTop.tsx
new file mode 100644
index 0000000..11fc524
--- /dev/null
+++ b/resources/js/components/common/ScrollToTop.tsx
@@ -0,0 +1,33 @@
+import { useEffect, useState } from 'react';
+import { ChevronUp } from 'lucide-react';
+
+export function ScrollToTop() {
+ const [isVisible, setIsVisible] = useState(false);
+
+ useEffect(() => {
+ const hero = document.getElementById('hero');
+ if (!hero) return;
+
+ const observer = new IntersectionObserver(
+ ([entry]) => setIsVisible(!entry.isIntersecting),
+ { threshold: 0 },
+ );
+
+ observer.observe(hero);
+ return () => observer.disconnect();
+ }, []);
+
+ const scrollToTop = () => window.scrollTo({ top: 0, behavior: 'smooth' });
+
+ if (!isVisible) return null;
+
+ return (
+
+ );
+}
\ No newline at end of file
diff --git a/resources/js/components/common/SectionHeading.tsx b/resources/js/components/common/SectionHeading.tsx
new file mode 100644
index 0000000..54957ae
--- /dev/null
+++ b/resources/js/components/common/SectionHeading.tsx
@@ -0,0 +1,27 @@
+import {cn} from '@/lib/utils';
+
+interface SectionHeadingProps {
+ title: string;
+ color?: string;
+ subtitle?: string;
+ align?: 'left' | 'center';
+ className?: string;
+}
+
+export function SectionHeading({title, color, subtitle, align = 'center', className}: SectionHeadingProps) {
+ return (
+
+
+ );
+}
diff --git a/public/favicon.ico b/resources/js/components/common/ServiceCard.tsx
similarity index 100%
rename from public/favicon.ico
rename to resources/js/components/common/ServiceCard.tsx
diff --git a/resources/js/components/features/home/AboutSection.tsx b/resources/js/components/features/home/AboutSection.tsx
new file mode 100644
index 0000000..eba87be
--- /dev/null
+++ b/resources/js/components/features/home/AboutSection.tsx
@@ -0,0 +1,41 @@
+import {SectionHeading} from "@/components/common/SectionHeading";
+
+export function AboutSection() {
+ return (
+ + {title} +
+ {subtitle && ( +{subtitle}
+ )} +
+
+
+
+
+
+ Une association locale
++ Le Retzien Libre est une association engagée pour la promotion du logiciel libre + et la protection de vos données personnelles sur le territoire du Pays de Retz. +
+
+
+ Notre mission
++ Nous sensibilisons et accompagnons les citoyens vers des pratiques numériques + plus respectueuses, libres et indépendantes des grandes plateformes commerciales. +
+
+
+ Surveillance massive
++ Les GAFAM collectent et exploitent vos données personnelles à des fins commerciales, + sans transparence sur l'usage qui en est fait. +
+
+
+ Monopole numérique
++ Concentration excessive du pouvoir et dépendance aux services centralisés. + Il existe des alternatives libres, locales et respectueuses. +
+
+
+
+
+
+
+ + Notre alternative : Le Retzien Libre +
++ Une association locale engagée pour la promotion du logiciel libre + et la protection de vos données personnelles. +
+ {auth.user ? ( + + + + ) : ( + + + + )} +
+ 
+
+
+
+
+ {/* Flèche vers la première section */}
+
+
+ + Pour un internet éthique ! +
+
+ "Dégooglisons"
+ nos ordinateurs, nos tablettes et nos smartphones.
+ "Le chemin est long, mais la voie est libre"
+
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/resources/js/components/features/home/ServicesSection.tsx b/resources/js/components/features/home/ServicesSection.tsx
new file mode 100644
index 0000000..87cb074
--- /dev/null
+++ b/resources/js/components/features/home/ServicesSection.tsx
@@ -0,0 +1,82 @@
+import { type Service } from '@/types';
+import { ServiceCard } from './ServiceCard';
+import { SectionHeading } from '@/components/common/SectionHeading';
+import { Container } from '@/components/common/Container';
+
+const services: Service[] = [
+ {
+ title: 'Boîte mail',
+ description: 'Service de messagerie électronique sécurisé et respectueux de votre vie privée',
+ colorTitle: 'white',
+ bgTitle: 'accent',
+ bgColor: 'secondary',
+ link: '#',
+ illustration: '../../img/utils/lrl-logo.svg'
+ },
+ {
+ title: 'Stockage Cloud',
+ description: 'Stockage en ligne et collaboration avec vos données hébergées localement',
+ colorTitle: 'black',
+ bgTitle: 'white',
+ bgColor: 'primary',
+ link: '#',
+ illustration: '../../img/utils/lrl-logo.svg'
+ },
+ {
+ title: 'Hébergement de site',
+ description: "Solutions d'hébergement web éthiques et performantes",
+ colorTitle: 'black',
+ bgTitle: 'primary',
+ bgColor: 'accent',
+ link: '#',
+ illustration: '../../img/utils/lrl-logo.svg'
+ },
+ {
+ title: 'Email Marketing',
+ description: "Gérez vos communications de groupe efficacement",
+ colorTitle: 'black',
+ bgTitle: 'secondary',
+ bgColor: 'gray',
+ link: '#',
+ illustration: '../../img/utils/lrl-logo.svg'
+ },
+ {
+ title: 'Partage de fichiers',
+ description: 'Partager facielement vos fichiers en toute sécurité',
+ colorTitle: 'black',
+ bgTitle: 'white',
+ bgColor: 'primary',
+ link: '#',
+ illustration: '../../img/utils/lrl-logo.svg'
+ },
+ {
+ title: 'Outil de Sondage',
+ description: 'Créez et partagez des sondages en ligne en toute confidentialité',
+ colorTitle: 'black',
+ bgTitle: 'primary',
+ bgColor: 'accent',
+ link: '#',
+ illustration: '../../img/utils/lrl-logo.svg'
+ },
+
+];
+
+export function ServicesSection() {
+ return (
+
+ 
+
+
+ {services.map((service) => (
+
+
-
-
-
-
-