From 81a7dcc192e1193a7b919ebfdce1d50338af67d7 Mon Sep 17 00:00:00 2001
From: MarconLP <13001502+MarconLP@users.noreply.github.com>
Date: Tue, 25 Apr 2023 20:22:23 +0200
Subject: [PATCH] add left & right fade effect to companies marquee

---
 src/pages/index.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index ca255ff..3d24165 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -173,7 +173,7 @@ const Home: NextPage = () => {
               <p className="mt-6 text-xl font-semibold leading-8 text-gray-600">
                 TRUSTED BY THE BEST BRANDS
               </p>
-              <div className="relative flex overflow-x-hidden">
+              <div className="relative relative flex overflow-x-hidden before:absolute before:left-0 before:z-10 before:h-full before:w-[15vw] before:bg-gradient-to-r before:from-white before:to-transparent after:absolute after:right-0 after:h-full after:w-[15vw] after:bg-gradient-to-r after:from-transparent after:to-white">
                 {[1, 2].map((x) => (
                   <div
                     key={x}