Fix footer aesthetics of images, sizing, proportion, etc.

Marjona6 · Jul 2, 2024 · 813f431 · 813f431
1 parent 1d99fc0
commit 813f431
Showing 1 changed file with 10 additions and 2 deletions.
diff --git a/pages/layout.tsx b/pages/layout.tsx
@@ -10,60 +10,68 @@ const Layout = ({ children }) => {
     if (menuItem) {
       menuItem.parentElement.classList.add('search-button')
     }
-  }, [document])
+  }, [])
 
   return (
     <>
       <div className="mb-[240px]">{children}</div>
       <div className="absolute bg-gray-300 h-[200px] w-screen bottom-0 left-0 px-6 md:px-10 pb-10">
-        <div className="w-full flex items-center justify-between gap-x-4 mt-4">
+        <div className="w-full flex items-center justify-between gap-x-2 md:gap-x-4 mt-4 flex-wrap">
           <img
             src="/public/images/project-logos/white-bg.png"
             alt="FULFIL logo"
             height={100}
             width={100}
+            className="w-[50px] sm:w-[65px] md:w-[72px] lg:w-[100px]"
           />
           <img
             src="/public/images/partner-logos/ewla.png"
             alt="EWLA logo"
             height={100}
             width={100}
+            className="w-[50px] sm:w-[65px] md:w-[72px] lg:w-[100px]"
           />
           <img
             src="/public/images/partner-logos/iroko.png"
             alt="IROKO logo"
             height={100}
             width={100}
+            className="w-[50px] sm:w-[65px] md:w-[72px] lg:w-[100px]"
           />
           <img
             src="/public/images/partner-logos/chiara-parolin.jpeg"
             alt="Parolin logo"
             height={100}
             width={100}
+            className="w-[50px] sm:w-[65px] md:w-[72px] lg:w-[100px]"
           />
           <img
             src="/public/images/partner-logos/olympe.png"
             alt="Olympe logo"
             height={100}
             width={100}
+            className="w-[50px] sm:w-[65px] md:w-[72px] lg:w-[100px]"
           />
           <img
             src="/public/images/partner-logos/enomw-small.jpg"
             alt="ENoMW logo"
             height={100}
             width={100}
+            className="w-[50px] sm:w-[65px] md:w-[72px] lg:w-[100px]"
           />
           <img
             src="/public/images/partner-logos/acf.png"
             alt="ACF logo"
             height={100}
             width={100}
+            className="w-[50px] sm:w-[65px] md:w-[72px] lg:w-[100px]"
           />
           <img
             src="/public/images/eu-emblems/vertical/PNG/EN V Co-funded by_PANTONE.png"
             alt="EU emblem"
             height={100}
             width={100}
+            className="w-[50px] sm:w-[65px] md:w-[72px] lg:w-[100px]"
           />
         </div>
         <div className="flex md:gap-x-10 justify-between md:justify-start absolute bottom-10 text-xs w-[calc(100%-48px)] md:w-[calc(100%-80px)]">