diff options
| author | MohamedBassem <me@mbassem.com> | 2024-02-28 12:42:33 +0000 |
|---|---|---|
| committer | MohamedBassem <me@mbassem.com> | 2024-02-28 12:42:33 +0000 |
| commit | 0f0e7ca8d134c2cfc02ac62539ad10c811319b38 (patch) | |
| tree | 62b21e50da659c42a8247bfb087d3b8048be903b | |
| parent | 836185c961d2e05d454b0216388ceb4f8300caf8 (diff) | |
| download | karakeep-0f0e7ca8d134c2cfc02ac62539ad10c811319b38.tar.zst | |
feature: Show a visual indication when an item is favourited
| -rw-r--r-- | packages/web/app/dashboard/bookmarks/components/LinkCard.tsx | 8 |
1 files changed, 8 insertions, 0 deletions
diff --git a/packages/web/app/dashboard/bookmarks/components/LinkCard.tsx b/packages/web/app/dashboard/bookmarks/components/LinkCard.tsx index 8d7a01d0..56e3d243 100644 --- a/packages/web/app/dashboard/bookmarks/components/LinkCard.tsx +++ b/packages/web/app/dashboard/bookmarks/components/LinkCard.tsx @@ -14,6 +14,7 @@ import Link from "next/link"; import BookmarkOptions from "./BookmarkOptions"; import { api } from "@/lib/trpc"; import { Skeleton } from "@/components/ui/skeleton"; +import { Star } from "lucide-react"; function isStillCrawling(bookmark: ZBookmark) { return ( @@ -92,6 +93,13 @@ export default function LinkCard({ "border-grey-100 border bg-gray-50 duration-300 ease-in hover:border-blue-300 hover:transition-all" } > + {bookmark.favourited && ( + <Star + className="absolute m-1 size-8 rounded bg-gray-100 p-1" + color="#ebb434" + fill="#ebb434" + /> + )} <Link href={link.url}> <ImageCardBanner src={isCrawling ? "/blur.avif" : image} /> </Link> |