Assets/svg logo

package.json

@@ -20,7 +20,8 @@
     "@heroicons/react": "^1.0.4",
     "next": "^11.1.2",
     "react": "^17.0.2",
-    "react-dom": "^17.0.2"
+    "react-dom": "^17.0.2",
+    "react-icons": "^4.3.1"
   },
   "devDependencies": {
     "@types/react": "17.0.19",

src/components/footer.tsx

@@ -1,5 +1,7 @@
 import Image from 'next/image'
 import CustomLink from './customLink'
+import ScribeDAOLogo from '../../public/static/ScribeDAO_Logo.svg'
+import { FaDiscord, FaGithub, FaTwitter } from 'react-icons/fa'
 
 import { FOOTER_NAV_LIST } from '../data/constants'
 
@@ -11,7 +13,7 @@ export default function Footer() {
         <div className="col-span-2 md:col-span-4 lg:col-span-2">
           <div className="mb-6 lg:mb-10 w-60 md:w-80 lg:w-60">
             <Image
-              src="/static/logo_footer.png"
+              src={ScribeDAOLogo}
               alt="ScribeDAO"
               layout="responsive"
               width={180}
@@ -29,30 +31,15 @@ export default function Footer() {
           </p>
           <div>
             <h5>Connect with us</h5>
-            <div>
+            <div className="flex">
               <CustomLink className="hover:text-gray-800 mr-4" href="#">
-                <Image
-                  src="/static/icons/twitter.png"
-                  alt="Twitter"
-                  width={25}
-                  height={25}
-                />
+                <FaTwitter className="text-2xl" />
               </CustomLink>
               <CustomLink className="hover:text-gray-800 mr-4" href="#">
-                <Image
-                  src="/static/icons/github.png"
-                  alt="Github"
-                  width={25}
-                  height={25}
-                />
+                <FaGithub className="text-2xl" />
               </CustomLink>
               <CustomLink className="hover:text-gray-800 mr-4" href="#">
-                <Image
-                  src="/static/icons/discord.png"
-                  alt="Discord"
-                  width={25}
-                  height={25}
-                />
+                <FaDiscord className="text-2xl" />
               </CustomLink>
             </div>
           </div>

src/components/navbar.tsx

@@ -3,6 +3,7 @@ import { Dialog, Menu, Popover, Transition } from '@headlessui/react'
 import { ChevronDownIcon, MenuIcon, XIcon } from '@heroicons/react/solid'
 import Image from 'next/image'
 import CustomLink from './customLink'
+import ScribeDAOLogo from '../../public/static/ScribeDAO_Logo.svg'
 
 import { HEADER_NAV_LIST } from '../data/constants'
 
@@ -16,7 +17,7 @@ export default function Nav() {
           <section>
             <CustomLink href="/">
               <Image
-                src="/static/logo_footer.png"
+                src={ScribeDAOLogo}
                 alt="ScribeDAO"
                 width={180}
                 height={35}