wip(Home Design)

resources/js/components/features/home/AlternativeSection.tsx

@@ -2,22 +2,29 @@ import { Link, usePage } from '@inertiajs/react';
 import { Button } from '@/components/ui/button';
 import { dashboard, register } from '@/routes';
 import { type SharedData } from '@/types';
-import illustrationImage from '@/img/utils/lrl-illustration.png';
+import IllustrationLogo from '@/img/utils/lrl-logo-full.svg';
 
 export function AlternativeSection() {
     const { auth } = usePage<SharedData>().props;
 
     return (
         <section className="w-full py-16">
-            <div className="max-w-7xl mx-auto px-4">
+            <div className="bg-gray-100 rounded-4xl max-w-7xl mx-auto px-4">
                 <div className="flex flex-col lg:flex-row items-center gap-12">
+                    <div className="lg:w-1/2 flex justify-center">
+                        <img
+                            src={IllustrationLogo}
+                            alt="Le Retzien Libre"
+                            className="rounded-lg max-w-md w-full"
+                        />
+                    </div>
                     <div className="flex flex-col gap-6 lg:w-1/2">
-                        <h2 className="text-3xl font-bold">
+                        <h2 className="text-3xl text-black font-medium">
                             Notre alternative : Le Retzien Libre
                         </h2>
                         <p>
-                            Une association locale engagée pour la promotion du logiciel libre
-                            et la protection de vos données personnelles.
+                            Ici, pas d’exploitation des vos données personnelles à des fins commerciales, ni de dépense aux services centralisés.<br/>
+                            Le Retzien Libre, c’est une association locale engagée pour la promotion du logiciel libre et la protection de vos données personnelles.
                         </p>
                         {auth.user ? (
                             <Link href={dashboard()}>
@@ -25,17 +32,10 @@ export function AlternativeSection() {
                             </Link>
                         ) : (
                             <Link href={register()}>
-                                <Button variant="default">Rejoignez-nous</Button>
+                                <Button variant="secondary">Rejoignez-nous</Button>
                             </Link>
                         )}
                     </div>
-                    <div className="lg:w-1/2 flex justify-center">
-                        <img
-                            src={illustrationImage}
-                            alt="Le Retzien Libre"
-                            className="rounded-lg max-w-md w-full"
-                        />
-                    </div>
                 </div>
             </div>
         </section>