mirror of
https://github.com/pheralb/svgl.git
synced 2025-12-29 08:01:36 +08:00
Fix download and add metatags
This commit is contained in:
+9
-7
@@ -23,15 +23,17 @@ function MyApp({ Component, pageProps, router }) {
|
||||
<>
|
||||
<Head>
|
||||
<title>SVGL - Beautiful SVG vector logos</title>
|
||||
<meta name="description" content="SVGs for everyone, totally free" />
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:title" content="SVGL - Beautiful SVG logos" />
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:url" content="https://svgl.vercel.app/" />
|
||||
<meta
|
||||
property="og:description"
|
||||
content="Beautiful SVG logos. Free and open source."
|
||||
/>
|
||||
<meta property="og:image" content="/images/logo.png" />
|
||||
<meta property="og:description" content="Beautiful SVG logos. Free and open source."/>
|
||||
<meta property="og:image" content="/images/banner.png" />
|
||||
<meta property="twitter:title" content="SVGL - Beautiful SVG logos" />
|
||||
<meta property="twitter:url" content="https://svgl.vercel.app/" />
|
||||
<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 property="twitter:image:src" content="/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" />
|
||||
|
||||
+16
-11
@@ -17,7 +17,8 @@ import { BiLinkExternal } from "react-icons/bi";
|
||||
import Link from "next/link";
|
||||
import Show from "animations/show";
|
||||
import Loader from "animations/loader";
|
||||
import Hover from "animations/hover";
|
||||
import confetti from "canvas-confetti";
|
||||
import download from "downloadjs";
|
||||
|
||||
const fetcher = async (url) => {
|
||||
const res = await fetch(url);
|
||||
@@ -38,6 +39,11 @@ export default function Icon() {
|
||||
if (error) return <Error />;
|
||||
if (!data) return <Loader />;
|
||||
|
||||
const downloadSvg = (name, url) => {
|
||||
confetti();
|
||||
download(url, `${name}.svg`, "image/svg+xml");
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Head>
|
||||
@@ -73,16 +79,15 @@ export default function Icon() {
|
||||
{data.title}
|
||||
</chakra.h1>
|
||||
<Flex direction={{ base: "column", md: "row" }} mt="2">
|
||||
<Link href={data.href} passHref>
|
||||
<Button
|
||||
leftIcon={<IoCloudDownloadOutline />}
|
||||
variant="primary"
|
||||
fontWeight="light"
|
||||
mr="2"
|
||||
>
|
||||
Download .svg
|
||||
</Button>
|
||||
</Link>
|
||||
<Button
|
||||
leftIcon={<IoCloudDownloadOutline />}
|
||||
variant="primary"
|
||||
fontWeight="light"
|
||||
mr="2"
|
||||
onClick={() => downloadSvg(data.title, data.href)}
|
||||
>
|
||||
Download .svg
|
||||
</Button>
|
||||
<Link href={data.url} passHref>
|
||||
<Button
|
||||
fontWeight="light"
|
||||
|
||||
Reference in New Issue
Block a user