mirror of
https://github.com/System-End/scraps.git
synced 2026-04-19 19:45:14 +00:00
26 lines
591 B
Svelte
26 lines
591 B
Svelte
<script lang="ts">
|
|
import { Heart } from '@lucide/svelte'
|
|
|
|
let {
|
|
count = 0,
|
|
hearted = false,
|
|
onclick
|
|
}: {
|
|
count: number
|
|
hearted: boolean
|
|
onclick: () => void
|
|
} = $props()
|
|
</script>
|
|
|
|
<button
|
|
{onclick}
|
|
class="flex items-center gap-1 p-2 rounded-full border-2 border-black transition-colors {hearted
|
|
? 'bg-red-100 border-red-500'
|
|
: 'hover:bg-gray-100'}"
|
|
title={hearted ? 'Remove from wishlist' : 'Add to wishlist'}
|
|
>
|
|
<Heart size={16} class={hearted ? 'fill-red-500 text-red-500' : ''} />
|
|
{#if count > 0}
|
|
<span class="text-xs font-bold">{count}</span>
|
|
{/if}
|
|
</button>
|