update (icons) footer gradient

growthepie · Jan 9, 2025 · ad76d4e · ad76d4e
1 parent f212a7b
commit ad76d4e
Showing 1 changed file with 23 additions and 15 deletions.
diff --git a/app/(icons)/icons/Footer.tsx b/app/(icons)/icons/Footer.tsx
@@ -10,15 +10,15 @@ export default function Footer({ downloadCSV, downloadJSON }) {
   const { isMobile } = useUIContext();
 
   return (
-    <div className="fixed z-50 flex flex-col justify-end top-0 left-0 right-0 bottom-0 overflow-hidden pointer-events-none">
+    <div className="pointer-events-none fixed bottom-0 left-0 right-0 top-0 z-50 flex flex-col justify-end overflow-hidden">
       <div className="relative">
         <div
-          className="bg-[#151a19] -z-10 fixed inset-0 pointer-events-none"
+          className="pointer-events-none fixed inset-0 -z-10 bg-[#151a19]"
           style={{
             backgroundPosition: "bottom",
             maskImage: isMobile
-              ? "linear-gradient(to top, white 0, white 150px, transparent 215px)"
-              : "linear-gradient(to top, white 0, white 80px, transparent 120px)",
+              ? `linear-gradient(to top, white 0, white 150px, transparent 215px)`
+              : `linear-gradient(to top, white 0, white 100px, transparent 180px)`,
           }}
         >
           <div className="background-gradient-group">
@@ -28,18 +28,20 @@ export default function Footer({ downloadCSV, downloadJSON }) {
         </div>
       </div>
 
-      <Container className="w-full mx-auto bottom-0 pointer-events-auto">
-        <Container className="!px-0 flex items-center justify-between w-full pb-5 md:pb-9 z-10">
+      <Container className="pointer-events-auto bottom-0 mx-auto w-full">
+        <Container className="z-10 flex w-full items-center justify-between !px-0 pb-5 md:pb-9">
           {/* Left Side Links */}
-          <div className="flex justify-center md:justify-start px-4">
-            <div className="flex flex-col md:flex-row gap-x-4 gap-y-2 items-center text-xs text-[#CDD8D3]">
+          <div className="flex justify-center px-4 md:justify-start">
+            <div className="flex flex-col items-center gap-x-4 gap-y-2 text-xs text-[#CDD8D3] md:flex-row">
               <Link
                 href="/privacy-policy"
                 className="underline"
                 target="_blank"
                 rel="noopener"
                 aria-label="Privacy Policy"
-                onClick={() => track("click", { location: "footer", link: "privacy-policy" })}
+                onClick={() =>
+                  track("click", { location: "footer", link: "privacy-policy" })
+                }
               >
                 Privacy Policy
               </Link>
@@ -49,7 +51,9 @@ export default function Footer({ downloadCSV, downloadJSON }) {
                 target="_blank"
                 rel="noopener"
                 aria-label="Imprint"
-                onClick={() => track("click", { location: "footer", link: "imprint" })}
+                onClick={() =>
+                  track("click", { location: "footer", link: "imprint" })
+                }
               >
                 Imprint
               </Link>
@@ -59,7 +63,9 @@ export default function Footer({ downloadCSV, downloadJSON }) {
                 target="_blank"
                 rel="noopener"
                 aria-label="Feedback"
-                onClick={() => track("click", { location: "footer", link: "feedback" })}
+                onClick={() =>
+                  track("click", { location: "footer", link: "feedback" })
+                }
               >
                 Feedback
               </Link>
@@ -68,12 +74,14 @@ export default function Footer({ downloadCSV, downloadJSON }) {
           </div>
 
           {/* Right Side Share Button */}
-          <div className="flex items-center justify-center w-28 h-14 rounded-full p-1 gap-4 bg-[#344240]">
-            <div className="flex items-center w-[109px] h-11 rounded-[40px] p-2.5 gap-2.5 bg-[#1F2726]">
-              <div className="w-6 h-6 flex items-center justify-center text-[#CDD8D3]">
+          <div className="flex h-14 w-28 items-center justify-center gap-4 rounded-full bg-[#344240] p-1">
+            <div className="flex h-11 w-[109px] items-center gap-2.5 rounded-[40px] bg-[#1F2726] p-2.5">
+              <div className="flex h-6 w-6 items-center justify-center text-[#CDD8D3]">
                 <ShareIcon />
               </div>
-              <span className="font-raleway font-bold text-sm text-[#CDD8D3]">Share</span>
+              <span className="font-raleway text-sm font-bold text-[#CDD8D3]">
+                Share
+              </span>
             </div>
           </div>
         </Container>