feat: replace some icons with heroicons
This commit is contained in:
DIYgod
parent
c6a26354ab
commit
936d530dab
|
|
@ -4,12 +4,11 @@ import { useAccount, useDisconnect } from "wagmi"
|
|||
import { Avatar } from "~/components/ui/Avatar"
|
||||
import type { HeaderLinkType } from "~/components/site/SiteHeader"
|
||||
import { DashboardIcon } from "../icons/DashboardIcon"
|
||||
import { LogoutIcon } from "../icons/LogoutIcon"
|
||||
import { CopyIcon } from "../icons/CopyIcon"
|
||||
import { IS_PROD } from "~/lib/constants"
|
||||
import { OUR_DOMAIN } from "~/lib/env"
|
||||
import { UniLink } from "../ui/UniLink"
|
||||
import { useEffect, useState } from "react"
|
||||
import { DuplicateIcon, LogoutIcon } from "@heroicons/react/outline"
|
||||
|
||||
export const ConnectButton: React.FC<{
|
||||
left?: boolean
|
||||
|
|
@ -27,7 +26,7 @@ export const ConnectButton: React.FC<{
|
|||
|
||||
const dropdownLinks: HeaderLinkType[] = [
|
||||
{
|
||||
icon: <CopyIcon />,
|
||||
icon: <DuplicateIcon className="w-4 h-4" />,
|
||||
label: copyLabel,
|
||||
onClick() {
|
||||
navigator.clipboard.writeText(address || "")
|
||||
|
|
@ -43,7 +42,7 @@ export const ConnectButton: React.FC<{
|
|||
url: `${IS_PROD ? "https" : "http"}://${OUR_DOMAIN}/dashboard`,
|
||||
},
|
||||
{
|
||||
icon: <LogoutIcon />,
|
||||
icon: <LogoutIcon className="w-4 h-4" />,
|
||||
label: "Disconnect",
|
||||
onClick() {
|
||||
disconnect()
|
||||
|
|
|
|||
|
|
@ -1,21 +0,0 @@
|
|||
import React from "react"
|
||||
|
||||
export const CollectIcon: React.FC<React.ComponentPropsWithoutRef<"svg">> = (
|
||||
props,
|
||||
) => {
|
||||
return (
|
||||
<svg
|
||||
width="1em"
|
||||
height="1em"
|
||||
{...props}
|
||||
viewBox="0 0 1024 1024"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M388.821333 375.466667c14.506667-12.672 31.744-22.442667 50.773334-28.202667l10.538666-2.773333 6.826667-1.28 7.509333-1.066667 7.68-0.64 7.850667-0.213333h320a138.666667 138.666667 0 0 1 138.453333 130.773333l0.213334 7.893333v320a138.666667 138.666667 0 0 1-130.816 138.453334l-7.850667 0.213333h-320a138.666667 138.666667 0 0 1-138.453333-130.816L341.333333 800v-320l0.128-6.357333 0.597334-8.106667 1.109333-8.149333 1.536-7.936 2.517333-9.514667 3.413334-10.069333 3.712-8.618667 3.498666-6.912 4.010667-6.954667 6.229333-9.258666 4.010667-5.248 5.76-6.656 4.608-4.778667 6.357333-5.930667zM640 469.333333a32 32 0 0 0-31.701333 27.648l-0.298667 4.352v106.624h-106.666667a32 32 0 0 0-31.701333 27.648l-0.298667 4.352c0 16.213333 12.032 29.568 27.648 31.701334l4.352 0.298666h106.666667v106.709334c0 16.213333 12.032 29.610667 27.648 31.701333L640 810.666667a32 32 0 0 0 31.701333-27.648l0.298667-4.352v-106.709334h106.666667a32 32 0 0 0 31.701333-27.690666L810.666667 640a32 32 0 0 0-27.648-31.701333l-4.352-0.298667h-106.666667V501.333333a32 32 0 0 0-27.648-31.701333L640 469.333333z m24.832-288.725333l2.218667 7.552 29.610666 110.421333H480A181.333333 181.333333 0 0 0 298.666667 479.957333v274.517334a138.752 138.752 0 0 1-123.52-95.061334l-2.218667-7.509333-82.816-309.12a138.666667 138.666667 0 0 1 90.453333-167.594667l7.594667-2.218666 309.077333-82.816a138.666667 138.666667 0 0 1 167.594667 90.453333z"
|
||||
p-id="863"
|
||||
></path>
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,22 +0,0 @@
|
|||
import React from "react"
|
||||
|
||||
export const CopyIcon: React.FC<React.ComponentPropsWithoutRef<"svg">> = (
|
||||
props,
|
||||
) => {
|
||||
return (
|
||||
<svg
|
||||
width="1em"
|
||||
height="1em"
|
||||
{...props}
|
||||
viewBox="0 0 1024 1024"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
p-id="5253"
|
||||
>
|
||||
<path
|
||||
d="M832 128c-12.8-76.8-76.8-128-160-128h-448C102.4 0 0 102.4 0 224v448c0 76.8 57.6 140.8 128 160 12.8 76.8 76.8 128 160 128h512c89.6 0 160-70.4 160-160v-512c0-76.8-57.6-140.8-128-160zM64 672v-448C64 134.4 134.4 64 224 64h448c44.8 0 76.8 25.6 89.6 64H288C198.4 128 128 198.4 128 288v473.6c-38.4-12.8-64-44.8-64-89.6z m832 128c0 51.2-44.8 96-96 96h-512c-51.2 0-96-44.8-96-96v-512C192 236.8 236.8 192 288 192h512c51.2 0 96 44.8 96 96v512z"
|
||||
p-id="5254"
|
||||
></path>
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,23 +0,0 @@
|
|||
import React from "react"
|
||||
|
||||
export const LogoutIcon: React.FC<React.ComponentPropsWithoutRef<"svg">> = (
|
||||
props,
|
||||
) => {
|
||||
return (
|
||||
<svg
|
||||
width="1em"
|
||||
height="1em"
|
||||
{...props}
|
||||
viewBox="0 0 1024 1024"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
p-id="2564"
|
||||
>
|
||||
<path
|
||||
d="M896 512c0-14.16-6.128-26.896-15.888-35.68l-160-144a48 48 0 0 0-64.224 71.36L722.912 464H432a48 48 0 1 0 0 96h290.912l-67.008 60.32a48 48 0 1 0 64.208 71.36l160-144A47.84 47.84 0 0 0 896 512zM416 832H224V192h192a48 48 0 1 0 0-96H176a48 48 0 0 0-48 48v736a48 48 0 0 0 48 48h240a48 48 0 1 0 0-96z"
|
||||
fill=""
|
||||
p-id="2565"
|
||||
></path>
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,18 +0,0 @@
|
|||
import React from "react"
|
||||
|
||||
export const MoreIcon: React.FC<React.ComponentPropsWithoutRef<"svg">> = (
|
||||
props,
|
||||
) => {
|
||||
return (
|
||||
<svg
|
||||
{...props}
|
||||
width="1em"
|
||||
height="1em"
|
||||
fill="currentColor"
|
||||
viewBox="0 0 20 20"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M6 10a2 2 0 11-4 0 2 2 0 014 0zM12 10a2 2 0 11-4 0 2 2 0 014 0zM16 12a2 2 0 100-4 2 2 0 000 4z" />
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,26 +0,0 @@
|
|||
import React from "react"
|
||||
|
||||
export const RSS3Icon: React.FC<React.ComponentPropsWithoutRef<"svg">> = (
|
||||
props,
|
||||
) => {
|
||||
return (
|
||||
<svg
|
||||
width="1em"
|
||||
height="1em"
|
||||
{...props}
|
||||
viewBox="0 0 1024 1024"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
p-id="6994"
|
||||
>
|
||||
<path
|
||||
d="M139.093333 974.336a96.426667 96.426667 0 1 0 0-192.853333 96.426667 96.426667 0 0 0 0 192.853333zM926.122667 971.264c-26.453333 0-46.634667-20.224-46.634667-46.677333 0-433.962667-353.066667-788.608-788.608-788.608-26.453333 0-46.634667-20.224-46.634667-46.634667C44.202667 62.890667 64.426667 42.666667 90.88 42.666667 577.706667 42.666667 972.8 439.296 972.8 924.586667c0 26.453333-20.224 46.634667-46.677333 46.634666z"
|
||||
p-id="6995"
|
||||
></path>
|
||||
<path
|
||||
d="M601.045333 972.8c-26.453333 0-46.634667-20.224-46.634666-46.677333 0-255.061333-208.426667-463.488-463.530667-463.488-26.453333 0-46.634667-20.224-46.634667-46.677334 0-26.453333 20.181333-46.634667 46.634667-46.634666 307.968 0 556.842667 250.410667 556.842667 556.8 0 24.917333-21.76 46.677333-46.677334 46.677333z"
|
||||
p-id="6996"
|
||||
></path>
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
|
|
@ -1,6 +1,5 @@
|
|||
import { Note } from "~/lib/types"
|
||||
import { LikeIcon } from "~/components/icons/LikeIcon"
|
||||
import { CollectIcon } from "~/components/icons/CollectIcon"
|
||||
import {
|
||||
useLikePage,
|
||||
useUnlikePage,
|
||||
|
|
@ -17,6 +16,7 @@ import { useState, useEffect } from "react"
|
|||
import { Button } from "../ui/Button"
|
||||
import { useRouter } from "next/router"
|
||||
import { SITE_URL } from "~/lib/env"
|
||||
import { DuplicateIcon } from "@heroicons/react/solid"
|
||||
|
||||
export const PostFooter: React.FC<{
|
||||
page?: Note
|
||||
|
|
@ -176,7 +176,7 @@ export const PostFooter: React.FC<{
|
|||
: {}
|
||||
}
|
||||
>
|
||||
<CollectIcon className="mr-2 w-10 h-10" />
|
||||
<DuplicateIcon className="mr-2 w-10 h-10" />
|
||||
<span>{mints.data?.count || 0}</span>
|
||||
</Button>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -25,10 +25,9 @@ import {
|
|||
} from "~/queries/site"
|
||||
import { useConnectModal } from "@rainbow-me/rainbowkit"
|
||||
import { Menu } from "@headlessui/react"
|
||||
import { MoreIcon } from "~/components/icons/MoreIcon"
|
||||
import { RSS3Icon } from "~/components/icons/RSS3Icon"
|
||||
import { CrossbellIcon } from "~/components/icons/CrossbellIcon"
|
||||
import { BlockchainIcon } from "~/components/icons/BlockchainIcon"
|
||||
import { DotsHorizontalIcon, RssIcon } from "@heroicons/react/solid"
|
||||
|
||||
export type HeaderLinkType = {
|
||||
icon?: React.ReactNode
|
||||
|
|
@ -140,7 +139,7 @@ export const SiteHeader: React.FC<{
|
|||
},
|
||||
{
|
||||
text: "View on RSS3",
|
||||
icon: <RSS3Icon />,
|
||||
icon: <RssIcon className="w-4 h-4" />,
|
||||
url: `https://rss3.io/result?search=${site?.metadata?.owner}`,
|
||||
},
|
||||
{
|
||||
|
|
@ -223,7 +222,7 @@ export const SiteHeader: React.FC<{
|
|||
e.stopPropagation()
|
||||
}}
|
||||
>
|
||||
<MoreIcon className="w-5 h-5" />
|
||||
<DotsHorizontalIcon className="w-5 h-5" />
|
||||
</Button>
|
||||
</Menu.Button>
|
||||
<Menu.Items className="text-sm absolute z-20 left-0 top-8 bg-white shadow-modal rounded-lg overflow-hidden py-2 w-60 text-gray-500">
|
||||
|
|
|
|||
Loading…
Reference in New Issue