mirror of
https://github.com/pheralb/svgl.git
synced 2025-12-29 08:01:36 +08:00
New site, new svgs and bug fixes
This commit is contained in:
pheralb
+32
-15
@@ -5,9 +5,9 @@ import Head from "next/head";
|
||||
import { ChakraProvider, Container } from "@chakra-ui/react";
|
||||
|
||||
// 📦 Components ->
|
||||
import Sidebar from "components/sidebar";
|
||||
import Layout from "components/layout";
|
||||
import Header from "components/header";
|
||||
import Footer from "components/footer";
|
||||
import Footer from "components/sidebar/by";
|
||||
|
||||
// 💙 Global CSS ->
|
||||
import "styles/globals.css";
|
||||
@@ -17,6 +17,7 @@ import theme from "styles/theme";
|
||||
|
||||
// 🐢 Animations ->
|
||||
import Transitions from "animations/transitions";
|
||||
import { Toaster } from "react-hot-toast";
|
||||
|
||||
function MyApp({ Component, pageProps, router }) {
|
||||
return (
|
||||
@@ -26,31 +27,47 @@ function MyApp({ Component, pageProps, router }) {
|
||||
|
||||
<title>SVGL - Beautiful SVG vector logos</title>
|
||||
<meta property="og:title" content="SVGL - Beautiful SVG vector logos" />
|
||||
<meta property="og:description" content="Beautiful SVG logos. Free and open source."/>
|
||||
<meta
|
||||
property="og:description"
|
||||
content="Beautiful SVG logos. Free and open source."
|
||||
/>
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:url" content="https://svgl.vercel.app/" />
|
||||
<meta property="og:image" content="https://svgl.vercel.app/images/banner.png" />
|
||||
|
||||
<meta
|
||||
property="og:image"
|
||||
content="https://svgl.vercel.app/images/banner.png"
|
||||
/>
|
||||
|
||||
<meta name="twitter:site" content="@pheralb_" />
|
||||
<meta property="twitter:title" content="SVGL - Beautiful SVG vector logos" />
|
||||
<meta
|
||||
property="twitter:title"
|
||||
content="SVGL - Beautiful SVG vector logos"
|
||||
/>
|
||||
<meta property="twitter:card" content="summary_large_image" />
|
||||
<meta property="twitter:creator" content="@pheralb" />
|
||||
<meta property="twitter:description" content="Beautiful SVG logos. Free and open source." />
|
||||
<meta name="twitter:image" content="https://svgl.vercel.app/images/banner.png" />
|
||||
<meta
|
||||
property="twitter:description"
|
||||
content="Beautiful SVG logos. Free and open source."
|
||||
/>
|
||||
<meta
|
||||
name="twitter:image"
|
||||
content="https://svgl.vercel.app/images/banner.png"
|
||||
/>
|
||||
|
||||
<meta name="keywords" content="svg,vector,logo,logos,download" />
|
||||
<meta content="#16161a" name="theme-color" />
|
||||
<link rel="icon" href="/icons/icon.ico" />
|
||||
</Head>
|
||||
<ChakraProvider theme={theme}>
|
||||
<Header />
|
||||
<Layout>
|
||||
<Transitions key={router.route}>
|
||||
<Component {...pageProps} />
|
||||
</Transitions>
|
||||
</Layout>
|
||||
<Footer />
|
||||
<Sidebar>
|
||||
<Layout>
|
||||
<Transitions key={router.route}>
|
||||
<Component {...pageProps} />
|
||||
</Transitions>
|
||||
</Layout>
|
||||
</Sidebar>
|
||||
</ChakraProvider>
|
||||
<Toaster position="bottom-center" reverseOrder={false} />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -8,16 +8,6 @@ export default function Index() {
|
||||
<>
|
||||
<Box mt="6">
|
||||
<Box w="full" border="solid 1px transparent">
|
||||
<chakra.h1
|
||||
fontSize={{ base: "25px", sm: "35px", md: "5xl", lg: "6xl" }}
|
||||
letterSpacing="tight"
|
||||
textAlign="center"
|
||||
lineHeight="short"
|
||||
fontWeight="extrabold"
|
||||
mb="3"
|
||||
>
|
||||
Beautiful SVG vector logos
|
||||
</chakra.h1>
|
||||
<Search />
|
||||
<Box mt={{ base: 4, md: 8 }}>
|
||||
<Items />
|
||||
|
||||
+54
-60
@@ -6,7 +6,6 @@ import {
|
||||
SimpleGrid,
|
||||
Button,
|
||||
Image,
|
||||
Container,
|
||||
Center,
|
||||
} from "@chakra-ui/react";
|
||||
import { useRouter } from "next/router";
|
||||
@@ -56,73 +55,68 @@ export default function Icon() {
|
||||
<title>{data.title} - SVGL</title>
|
||||
</Head>
|
||||
<Show delay="0">
|
||||
<Container maxW="100%" borderWidth="1px" borderRadius="30px">
|
||||
<SimpleGrid columns={{ base: 1, md: 1, lg: 2 }} spacing={0}>
|
||||
<Box py={{ base: "10", md: "24" }}>
|
||||
<Center>
|
||||
<Image
|
||||
src={data.href}
|
||||
alt={data.title}
|
||||
w={{ base: "30%", md: "20%", lg: "30%" }}
|
||||
fit="cover"
|
||||
loading="lazy"
|
||||
/>
|
||||
</Center>
|
||||
</Box>
|
||||
<Flex
|
||||
direction="column"
|
||||
alignItems="start"
|
||||
justifyContent="center"
|
||||
px={{ base: 4, lg: 4 }}
|
||||
py={{ base: "3", md: "0", lg: "10" }}
|
||||
<Link href="/" passHref>
|
||||
<Button
|
||||
leftIcon={<IoArrowBackOutline />}
|
||||
fontWeight="light"
|
||||
variant="ghost"
|
||||
mb="4"
|
||||
>
|
||||
Continue discovering
|
||||
</Button>
|
||||
</Link>
|
||||
<SimpleGrid columns={{ base: 1, md: 1, lg: 2 }} spacing={0}>
|
||||
<Box py={{ base: "10", md: "24" }}>
|
||||
<Center>
|
||||
<Image
|
||||
src={data.href}
|
||||
alt={data.title}
|
||||
w={{ base: "30%", md: "20%", lg: "30%" }}
|
||||
fit="cover"
|
||||
loading="lazy"
|
||||
/>
|
||||
</Center>
|
||||
</Box>
|
||||
<Flex
|
||||
direction="column"
|
||||
alignItems="start"
|
||||
justifyContent="center"
|
||||
px={{ base: 4, lg: 4 }}
|
||||
py={{ base: "3", md: "0", lg: "10" }}
|
||||
>
|
||||
<chakra.h1
|
||||
mb={3}
|
||||
fontSize={{ base: "4xl", md: "4xl", lg: "5xl" }}
|
||||
fontWeight="semibold"
|
||||
lineHeight="shorter"
|
||||
>
|
||||
<chakra.h1
|
||||
mb={3}
|
||||
fontSize={{ base: "4xl", md: "4xl", lg: "5xl" }}
|
||||
fontWeight="semibold"
|
||||
lineHeight="shorter"
|
||||
{data.title}
|
||||
</chakra.h1>
|
||||
<Flex direction={{ base: "column", md: "row" }} w="100%" mt="2">
|
||||
<Button
|
||||
w={{ base: "100%", md: "auto" }}
|
||||
mb={{ base: "2", md: "0" }}
|
||||
leftIcon={<IoCloudDownloadOutline />}
|
||||
variant="primary"
|
||||
fontWeight="light"
|
||||
mr="2"
|
||||
onClick={() => downloadSvg(data.href)}
|
||||
>
|
||||
{data.title}
|
||||
</chakra.h1>
|
||||
<Flex direction={{ base: "column", md: "row" }} w="100%" mt="2">
|
||||
Download .svg
|
||||
</Button>
|
||||
<Link href={data.url} passHref>
|
||||
<Button
|
||||
w={{ base: "100%", md: "auto" }}
|
||||
mb={{ base: "2", md: "0" }}
|
||||
leftIcon={<IoCloudDownloadOutline />}
|
||||
variant="primary"
|
||||
fontWeight="light"
|
||||
mr="2"
|
||||
onClick={() => downloadSvg(data.href)}
|
||||
borderWidth="1px"
|
||||
rightIcon={<BiLinkExternal />}
|
||||
>
|
||||
Download .svg
|
||||
{data.title} website
|
||||
</Button>
|
||||
<Link href={data.url} passHref>
|
||||
<Button
|
||||
w={{ base: "100%", md: "auto" }}
|
||||
fontWeight="light"
|
||||
borderWidth="1px"
|
||||
rightIcon={<BiLinkExternal />}
|
||||
>
|
||||
{data.title} website
|
||||
</Button>
|
||||
</Link>
|
||||
</Flex>
|
||||
</Link>
|
||||
</Flex>
|
||||
</SimpleGrid>
|
||||
<Link href="/" passHref>
|
||||
<Button
|
||||
leftIcon={<IoArrowBackOutline />}
|
||||
variant="outline"
|
||||
fontWeight="light"
|
||||
w="100%"
|
||||
border="0"
|
||||
mt="4"
|
||||
mb="4"
|
||||
>
|
||||
Continue discovering
|
||||
</Button>
|
||||
</Link>
|
||||
</Container>
|
||||
</Flex>
|
||||
</SimpleGrid>
|
||||
</Show>
|
||||
</>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user