Spaces:
Running
Running
File size: 1,397 Bytes
662d5af a1a6daf 662d5af a1a6daf 662d5af a1a6daf 662d5af |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 |
<script lang="ts">
import type { Message } from "$lib/types/Message";
import CarbonThumbsUp from "~icons/carbon/thumbs-up";
import CarbonThumbsDown from "~icons/carbon/thumbs-down";
import { createEventDispatcher } from "svelte";
interface Props {
message: Message;
}
let { message }: Props = $props();
const dispatch = createEventDispatcher<{
vote: { score: Message["score"]; id: Message["id"] };
}>();
</script>
<button
class="btn rounded-sm p-1 text-sm text-gray-400 hover:text-gray-500 focus:ring-0 dark:text-gray-400 dark:hover:text-gray-300
{message.score && message.score > 0
? 'text-green-500 hover:text-green-500 dark:text-green-400 hover:dark:text-green-400'
: ''}"
title={message.score === 1 ? "Remove +1" : "+1"}
type="button"
onclick={() => dispatch("vote", { score: message.score === 1 ? 0 : 1, id: message.id })}
>
<CarbonThumbsUp class="h-[1.14em] w-[1.14em]" />
</button>
<button
class="btn rounded-sm p-1 text-sm text-gray-400 hover:text-gray-500 focus:ring-0 dark:text-gray-400 dark:hover:text-gray-300
{message.score && message.score < 0
? 'text-red-500 hover:text-red-500 dark:text-red-400 hover:dark:text-red-400'
: ''}"
title={message.score === -1 ? "Remove -1" : "-1"}
type="button"
onclick={() => dispatch("vote", { score: message.score === -1 ? 0 : -1, id: message.id })}
>
<CarbonThumbsDown class="h-[1.14em] w-[1.14em]" />
</button>
|