xwx.moe/el.xwx.moe
xwx.moe/ el.xwx.moe
1
0
Disbranĉigi 0
Fontkodo Issues Tirpetoj Actions Packages Projects Eldonoj Wiki Activity

change link icon to component

This commit is contained in:
Yee Jia Wei 2023-12-16 12:05:19 +08:00
parent a2b1513dbc
commit b246cdbc44
1 changed files with 4 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
components/LinkCard.tsx
View File

@ -17,6 +17,7 @@ import unescapeString from "@/lib/client/unescapeString";
import LinkActions from "@/components/LinkViews/LinkComponents/LinkActions"; import LinkActions from "@/components/LinkViews/LinkComponents/LinkActions";
import LinkDate from "@/components/LinkViews/LinkComponents/LinkDate"; import LinkDate from "@/components/LinkViews/LinkComponents/LinkDate";
import LinkCollection from "@/components/LinkViews/LinkComponents/LinkCollection"; import LinkCollection from "@/components/LinkViews/LinkComponents/LinkCollection";
import LinkIcon from "@/components/LinkViews/LinkComponents/LinkIcon";
type Props = { type Props = {
link: LinkIncludingShortenedCollectionAndTags; link: LinkIncludingShortenedCollectionAndTags;
@ -65,30 +66,9 @@ export default function LinkCard({link, count, className}: Props) {
onClick={() => link.url && window.open(link.url || "", "_blank")} onClick={() => link.url && window.open(link.url || "", "_blank")}
className="flex flex-col justify-between cursor-pointer h-full w-full gap-1 p-3" className="flex flex-col justify-between cursor-pointer h-full w-full gap-1 p-3"
> >
{link.url && url ? ( <div className="absolute bottom-3 right-3">
<Image <LinkIcon link={link} />
src={`https://t2.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=${link.url}&size=32`} </div>
width={64}
height={64}
alt=""
className={`absolute w-12 bg-white shadow rounded-md p-1 bottom-3 right-3 select-none z-10`}
draggable="false"
onError={(e) => {
const target = e.target as HTMLElement;
target.style.display = "none";
}}
/>
) : link.type === "pdf" ? (
<FontAwesomeIcon
icon={faFilePdf}
className="absolute h-12 w-12 bg-primary/20 text-primary shadow rounded-md p-2 bottom-3 right-3 select-none z-10"
/>
) : link.type === "image" ? (
<FontAwesomeIcon
icon={faFileImage}
className="absolute h-12 w-12 bg-primary/20 text-primary shadow rounded-md p-2 bottom-3 right-3 select-none z-10"
/>
) : undefined}
<div className="flex items-baseline gap-1"> <div className="flex items-baseline gap-1">
<p className="text-sm text-neutral">{count + 1}</p> <p className="text-sm text-neutral">{count + 1}</p>