qyg2297248353/svgl
1
0
Fork 0
mirror of https://github.com/pheralb/svgl.git synced 2025-12-29 08:01:36 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

New design, added category & bug fixes

Browse Source
This commit is contained in:
pheralb
2022-01-21 22:30:32 +00:00
parent 2706236410
commit 57f2339589
43 changed files with 1916 additions and 191 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/index.js
+25 -55
View File
@@ -1,67 +1,37 @@
import { chakra, Box } from "@chakra-ui/react";
import { chakra, Box, Container } from "@chakra-ui/react";
import Search from "components/search";
import Grid from "components/grid";
import Card from "components/card";
import Icons from "data/icons";
import Items from "components/items/all";
import Show from "animations/show";
export default function Index() {
return (
<>
<Box overflow="hidden">
<Box mx="auto">
<Box
pos="relative"
pb={{ base: 2, sm: 16, md: 20, lg: 28, xl: 32 }}
w="full"
border="solid 1px transparent"
>
<Box
mt={{ base: "4", md: "8" }}
mx="auto"
maxW={{ base: "8xl" }}
px={{ base: 4, sm: 6, lg: 8 }}
>
<Box
textAlign="center"
w={{ base: "full", md: 11 / 12, xl: 8 / 12 }}
mx="auto"
>
<Show delay="0">
<chakra.h1
fontSize={{ base: "30px", sm: "5xl", md: "6xl" }}
letterSpacing="tight"
lineHeight="short"
fontWeight="extrabold"
mb={{ base: 4, md: 8 }}
>
Beautiful SVG vector icons
</chakra.h1>
</Show>
<Show delay="0.2">
<Search />
</Show>
<Show delay="0.4">
<Box mt={{ base: 4, md: 8 }}>
<Grid>
{Icons.map((link) => (
<>
<div key={link.id}>
<Card
title={link.title}
url={link.href}
icon={link.icon}
/>
</div>
</>
))}
</Grid>
</Box>
</Show>
</Box>
<Container maxW={{ base: "100%", md: "90%" }}>
<Box w="full" border="solid 1px transparent">
<Box textAlign="center">
<Show delay="0">
<chakra.h1
fontSize={{ base: "30px", sm: "35px", md: "6xl" }}
letterSpacing="tight"
lineHeight="short"
fontWeight="extrabold"
mb={{ base: 4, md: 8 }}
>
Beautiful SVG vector icons
</chakra.h1>
</Show>
<Show delay="0.2">
<Search />
</Show>
<Show delay="0.2">
<Box mt={{ base: 4, md: 8 }}>
<Items />
</Box>
</Show>
</Box>
</Box>
</Box>
</Container>
</Box>
</>
);