blob: bd8af67cfc14fbe5c2539567257e6135b040ba1e (
plain) (
blame)
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
|
<script lang="ts">
interface Props {
large?: boolean;
favourite?: boolean;
hoverable?: boolean;
}
let { large = false, favourite, hoverable = false }: Props = $props();
</script>
{#if favourite}
<span class:hoverable class:large class="icon-yellow icon-[material-symbols--star-rounded]"
></span>
{:else}
<span
class:hoverable
class:large
class="icon-yellow dim icon-[material-symbols--star-outline-rounded]"
></span>
{/if}
<style lang="postcss">
span {
@apply -m-px -translate-y-px text-[26px];
}
span.large {
@apply text-[34px];
}
</style>
|
