qyg2297248353/svgl
qyg2297248353/svgl
1
0
Fork 0
mirror of https://github.com/pheralb/svgl.git synced 2025-02-06 06:58:04 +08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

⚒️ Clear svgCard.

Browse Source
This commit is contained in:
pheralb 2022-07-24 23:40:18 +01:00
parent ed1468a24e
commit 2cd7c66462
1 changed files with 33 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
src/components/svgCard.tsx
View File

@ -1,35 +1,44 @@
import React from "react";
import { SVGCardProps } from "@/interfaces/components";
import { Box, Center, Image, Text, useColorModeValue } from "@chakra-ui/react";
import {
Box,
Center,
Image,
Text,
useColorModeValue,
useDisclosure,
} from "@chakra-ui/react";
import Tap from "@/animations/tap";
import CustomLink from "@/common/link";
const SVGCard = (props: SVGCardProps) => {
const bg = useColorModeValue("bg.light", "bg.dark");
return (
<Tap>
<CustomLink href={`/svg/${props.id}`}>
<Box
bg={bg}
p={4}
cursor="pointer"
borderRadius="10px"
borderWidth="1px"
mb="2"
_hover={{
shadow: "md",
}}
transition="all 0.2s"
>
<Center>
<Image boxSize="50px" src={props.svg} alt={props.title} />
</Center>
<Text mt="2" fontWeight="light" textAlign="center">
{props.title}
</Text>
</Box>
</CustomLink>
</Tap>
<>
<Tap>
<CustomLink href={`/svg/${props.id}`}>
<Box
bg={bg}
p={4}
cursor="pointer"
borderRadius="10px"
borderWidth="1px"
mb="2"
_hover={{
shadow: "md",
}}
transition="all 0.2s"
>
<Center>
<Image boxSize="50px" src={props.svg} alt={props.title} />
</Center>
<Text mt="2" fontWeight="light" textAlign="center">
{props.title}
</Text>
</Box>
</CustomLink>
</Tap>
</>
);
};