Fixing missing parts

dust-tt · Dec 17, 2024 · 6f5020e · 6f5020e
1 parent 0314520
commit 6f5020e
Show file tree

Hide file tree

Showing 2 changed files with 69 additions and 42 deletions.
diff --git a/front/components/home/TrustedBy.tsx b/front/components/home/TrustedBy.tsx
@@ -18,59 +18,59 @@ export default function TrustedBy() {
         </H3>
         <div
           className={classNames(
-            "mt-8 max-w-[400px] sm:w-full sm:max-w-none",
-            "grid grid-cols-2 gap-x-2",
-            "sm:grid-cols-3 sm:gap-x-16",
-            "md:grid-cols-4 md:gap-x-16"
+            "mt-8 w-full",
+            "grid grid-cols-2 place-items-center gap-1",
+            "sm:grid-cols-3 sm:gap-0",
+            "md:grid-cols-4 md:gap-0"
           )}
         >
           <Image
             alt="alan"
             src="/static/landing/logos/alan.png"
-            width={600}
-            height={300}
+            width={250}
+            height={100}
           />
           <Image
             alt="watershed"
             src="/static/landing/logos/watershed.png"
-            width={600}
-            height={300}
+            width={250}
+            height={100}
           />
           <Image
             alt="qonto"
             src="/static/landing/logos/qonto.png"
-            width={600}
-            height={300}
+            width={250}
+            height={100}
           />
           <Image
             alt="pennylane"
             src="/static/landing/logos/pennylane.png"
-            width={600}
-            height={300}
+            width={250}
+            height={100}
           />
           <Image
             alt="payfit"
             src="/static/landing/logos/payfit.png"
-            width={600}
-            height={300}
+            width={250}
+            height={100}
           />
           <Image
-            alt="watershed"
+            alt="malt"
             src="/static/landing/logos/malt.png"
-            width={600}
-            height={300}
+            width={250}
+            height={100}
           />
           <Image
             alt="hivebrite"
             src="/static/landing/logos/hivebrite.png"
-            width={600}
-            height={300}
+            width={250}
+            height={100}
           />
           <Image
             alt="blueground"
             src="/static/landing/logos/blueground.png"
-            width={600}
-            height={300}
+            width={250}
+            height={100}
           />
         </div>
       </div>

diff --git a/front/components/home/content/Product/IntroSection.tsx b/front/components/home/content/Product/IntroSection.tsx
@@ -9,7 +9,8 @@ import {
 import Link from "next/link";
 import React, { useEffect, useState } from "react";
 
-import { H1, P } from "@app/components/home/ContentComponents";
+import { H1, P, Strong } from "@app/components/home/ContentComponents";
+import TrustedBy from "@app/components/home/TrustedBy";
 
 const ResponsiveIframe = () => {
   return (
@@ -109,28 +110,54 @@ export function IntroSection() {
 
   return (
     <div className="w-full pt-[6vh] sm:pt-[8vh] xl:pt-[12vh] 2xl:pt-[18vh]">
-      <div className="flex flex-col gap-16 md:flex-row md:gap-32">
-        <div className="flex flex-col gap-8">
-          <H1 from="from-red-200" to="to-red-400">
-            Build custom AI&nbsp;assistants to speed up your work
-          </H1>
-          <div className="w-full md:hidden">{MainVisualImage()}</div>
-          <P size="lg" className="text-slate-50">
-            Amplify your team's performance with personalized assistants
-            connected to your proprietary knowledge and data.
-          </P>
-          <div>
-            <Link href="/home/pricing" shallow={true}>
-              <Button
-                variant="highlight"
-                size="md"
-                label="Get started"
-                icon={RocketIcon}
-              />
-            </Link>
+      <div className="flex flex-col gap-16">
+        <div className="flex flex-col items-center gap-16 md:flex-row md:gap-32">
+          <div className="flex flex-col gap-8">
+            <H1 from="from-red-200" to="to-red-400">
+              Build custom AI&nbsp;assistants to speed up your work
+            </H1>
+            <div className="w-full md:hidden">{MainVisualImage()}</div>
+            <P size="lg" className="text-slate-50">
+              Amplify your team's performance with personalized assistants
+              connected to your proprietary knowledge and data.
+            </P>
+            <div>
+              <Link href="/home/pricing" shallow={true}>
+                <Button
+                  variant="highlight"
+                  size="md"
+                  label="Get started"
+                  icon={RocketIcon}
+                />
+              </Link>
+            </div>
           </div>
+          <div className="hidden md:block">{MainVisualImage()}</div>
+        </div>
+
+        <TrustedBy />
+
+        <div className="grid grid-cols-1 gap-12 sm:grid-cols-2 lg:grid-cols-4">
+          <P size="md" dotCSS="text-amber-300" shape="triangle">
+            Connect <Strong>your team's data</Strong> and{" "}
+            <Strong>break&nbsp;down knowledge silos</Strong> with
+            context&#8209;aware&nbsp;assistants.
+          </P>
+          <P size="md" dotCSS="text-red-400" shape="rectangle">
+            Empower your teams with&nbsp;
+            <Strong>assistants tailored to&nbsp;their needs</Strong>{" "}
+            on&nbsp;concrete use&nbsp;cases.
+          </P>
+          <P size="md" dotCSS="text-sky-400" shape="circle">
+            Remain model agnostic: effortlessly{" "}
+            <Strong>switch to the most advanced AI&nbsp;models</Strong> without
+            touching your&nbsp;workflows.
+          </P>
+          <P size="md" dotCSS="text-emerald-400" shape="hexagon">
+            <Strong>Control data access granularly</Strong> with a{" "}
+            <Strong>safe and privacy-obsessed</Strong> application.
+          </P>
         </div>
-        <div className="hidden md:block">{MainVisualImage()}</div>
       </div>
     </div>
   );