add together section

Benefactorum · Nov 10, 2024 · 9d31423 · 9d31423
1 parent 5364d61
commit 9d31423
Show file tree

Hide file tree

Showing 7 changed files with 68 additions and 19 deletions.
diff --git a/app/frontend/assets/images/aboutUs/benefactorum.svg b/app/frontend/assets/images/aboutUs/benefactorum.svg
diff --git a/app/frontend/assets/images/aboutUs/togetherness.svg b/app/frontend/assets/images/aboutUs/togetherness.svg
diff --git a/app/frontend/components/aboutUs/HeroSection.tsx b/app/frontend/components/aboutUs/HeroSection.tsx
@@ -26,7 +26,6 @@ export default function HeroSection() {
               src={BenefactorumLogo}
               alt={imageDescription}
               title={imageDescription}
-              className="rounded-3xl"
             />
           </AspectRatio>
         </div>

diff --git a/app/frontend/components/aboutUs/OurMission.tsx b/app/frontend/components/aboutUs/OurMission.tsx
@@ -15,7 +15,6 @@ export default function OurMission() {
                 src={BrainHeartLogo}
                 alt={imageDescription}
                 title={imageDescription}
-                className="rounded-3xl"
               />
             </AspectRatio>
           </div>

diff --git a/app/frontend/components/aboutUs/Together.tsx b/app/frontend/components/aboutUs/Together.tsx
@@ -0,0 +1,54 @@
+import TogethernessLogo from "/assets/images/aboutUs/togetherness.svg";
+import { AspectRatio } from "@/components/ui/aspect-ratio";
+import { Link } from "@inertiajs/react";
+import { buttonVariants } from "@/components/ui/button";
+
+const imageDescription = "";
+
+export default function OurMission() {
+  return (
+    <div className="flex flex-col md:flex-row py-8 lg:py-16 2xl:container mx-auto px-2 sm:px-8 gap-8 lg:gap-16">
+      <div className="flex flex-grow xl:flex-none md:w-2/3 flex-col justify-center gap-8">
+        <h2 className=" text-xl sm:text-2xl lg:text-3xl whitespace-pre-line font-semibold">
+          <span className="leading-snug">
+            Toi + Moi + Eux + Tous ceux qui le veulent
+          </span>
+        </h2>
+        <p className="">
+          Benefactorum est un projet militant, créé par des donateurs ... pour
+          des donateurs.
+        </p>
+        <p className="">
+          Benefactorum est un projet ouvert à toutes les bonnes volontés. La
+          plateforme est <span className="italic">open source</span>, son
+          contenu est participatif, sa gouvernance est horizontale.
+        </p>
+        <div className="flex items-center gap-8 flex-wrap">
+          <Link
+            href="/nous-rejoindre"
+            className={`${buttonVariants({
+              variant: "",
+              size: "lg",
+            })}`}
+          >
+            Nous rejoindre
+          </Link>
+          <Link href="/co-fondateurs" className="underline hover:text-primary">
+            Voir l’équipe de cofondateurs
+          </Link>
+        </div>
+      </div>
+      <div className="flex md:w-1/3 justify-center items-center">
+        <div className="w-[177.59px]">
+          <AspectRatio ratio={177.59 / 200}>
+            <img
+              src={TogethernessLogo}
+              alt={imageDescription}
+              title={imageDescription}
+            />
+          </AspectRatio>
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/app/frontend/components/homepage/FaqSection.tsx b/app/frontend/components/homepage/FaqSection.tsx
@@ -32,25 +32,19 @@ export default function JoinUs() {
               toutes vos questions.
             </h3>
             <ul className="pl-4 sm:pl-8 list-disc flex flex-col space-y-4">
-              <li>
-                <Link className="underline" href="/">
+              <li className="underline hover:text-primary">
+                <Link href="/">
                   C’est quoi une association d’intérêt général ?
                 </Link>
               </li>
-              <li>
-                <Link className="underline" href="/">
-                  Pourquoi donner ?
-                </Link>
+              <li className="underline hover:text-primary">
+                <Link href="/">Pourquoi donner ?</Link>
               </li>
-              <li>
-                <Link className="underline" href="/">
-                  Qu'est-ce-qu'une réduction d’impôt ?
-                </Link>
+              <li className="underline hover:text-primary">
+                <Link href="/">Qu'est-ce-qu'une réduction d’impôt ?</Link>
               </li>
-              <li>
-                <Link className="underline" href="/">
-                  À qui donner ?
-                </Link>
+              <li className="underline hover:text-primary">
+                <Link href="/">À qui donner ?</Link>
               </li>
             </ul>
             <div className="ml-auto">

diff --git a/app/frontend/pages/Pages/AboutUs.tsx b/app/frontend/pages/Pages/AboutUs.tsx
@@ -1,11 +1,13 @@
 import HeroSection from "../../components/aboutUs/HeroSection";
-import OurMisson from "../../components/aboutUs/OurMission";
+import OurMission from "../../components/aboutUs/OurMission";
+import Together from "../../components/aboutUs/Together";
 
 export default function Home() {
   return (
     <>
       <HeroSection />
-      <OurMisson />
+      <OurMission />
+      <Together />
     </>
   );
 }