New design, added category & bug fixes

components/card/index.js

@@ -1,9 +1,9 @@
 import React from "react";
 import Link from "next/link";
-import { Box, Text, Icon } from "@chakra-ui/react";
+import { Box, Text, Icon, Image, Center } from "@chakra-ui/react";
 import Hover from "animations/hover";
 
-const Index = ({ title, url, icon }) => {
+const Index = ({ title, url, href }) => {
   return (
     <Hover>
       <Link href={url} passHref>
@@ -14,8 +14,10 @@ const Index = ({ title, url, icon }) => {
           p={4}
           cursor="pointer"
         >
-          <Icon as={icon} alt={title} boxSize="60px" />
-          <Text mt="2" fontWeight="semibold">
+          <Center>
+            <Image src={href} alt={title} boxSize="60px" />
+          </Center>
+          <Text mt="2" fontWeight="light" textAlign={"center"}>
             {title}
           </Text>
         </Box>