Fix download button & improvements

components/search/index.js

@@ -6,37 +6,40 @@ import {
   Input,
   InputLeftElement,
   InputGroup,
-  Button,
   Flex,
   HStack,
   Text,
   Image,
   Icon,
 } from "@chakra-ui/react";
-import { IoCloudDownloadOutline, IoLink, IoSearch } from "react-icons/io5";
+import { IoSearch } from "react-icons/io5";
+import { BiLinkExternal } from "react-icons/bi";
 import { Algolia } from "components/svg";
+import Tap from "animations/tap";
 
 const AutocompleteItem = ({ id, title, href, url }) => {
   return (
     <>
-      <Link href={`/svg/${id}`} passHref>
-        <Box
-          id={id}
-          w="100%"
-          borderWidth="1px"
-          borderRadius="6px"
-          mt="3"
-          cursor="pointer"
-        >
-          <HStack py={6} px={6} spacing={2}>
-            <Image src={href} alt={title} boxSize="20px" mr="2" />
-            <Text fontSize="18px" fontWeight="light">
-              {title}
-            </Text>
-            <Icon as={IoLink} />
-          </HStack>
-        </Box>
-      </Link>
+      <Tap>
+        <Link href={`/svg/${id}`} passHref>
+          <Box
+            id={id}
+            w="100%"
+            borderWidth="1px"
+            borderRadius="6px"
+            mt="3"
+            cursor="pointer"
+          >
+            <HStack py={6} px={6} spacing={2}>
+              <Image src={href} alt={title} boxSize="20px" mr="2" />
+              <Text fontSize="18px" fontWeight="light">
+                {title}
+              </Text>
+              <Icon as={BiLinkExternal} />
+            </HStack>
+          </Box>
+        </Link>
+      </Tap>
     </>
   );
 };