refactor: change footer logo icon

techemmy · Nov 5, 2024 · 14f30ff · 14f30ff
1 parent 3e1e518
commit 14f30ff
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 3 deletions.
diff --git a/public/images/syncswap_dark.png b/public/images/syncswap_dark.png
diff --git a/public/images/syncswap_light.png b/public/images/syncswap_light.png
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
@@ -1,15 +1,25 @@
-import Logo from "@/components/Logo";
+import useImageTheme from "@/hooks/useImageTheme";
 import { cn } from "@/lib/utils";
 
 export default function Footer({ className = "" }: { className?: string }) {
+  const logoTheme = useImageTheme();
+  const footerLogo = {
+    light: "/images/syncswap_dark.png",
+    dark: "/images/syncswap_light.png",
+  };
   return (
     <footer
       className={cn(
-        "md:px-32 pt-10 py-28 md:pb-32 grid grid-cols-2 md:grid-cols-5 gap-6 text-center md:text-left",
+        "md:px-32 pt-10 py-28 md:pb-32 grid grid-cols-2 md:grid-cols-5 gap-8 text-center md:text-left",
         className,
       )}
     >
-      <Logo className="w-[48px] h-[48px] hidden md:block" />
+      <img
+        src={footerLogo[logoTheme]}
+        height={36}
+        alt="Sync swap logo"
+        className=" hidden md:block"
+      />
 
       <article className="grid gap-y-5">
         <p className="text-card-foreground text-sm font-semibold">Community</p>