26 lines
667 B
Vue
26 lines
667 B
Vue
<template>
|
|
<div class="flex items-center gap-1" :title="tooltip">
|
|
<UIcon
|
|
v-for="(star, i) in stars"
|
|
:key="i"
|
|
name="i-heroicons-star-20-solid"
|
|
class="w-4 h-4"
|
|
:class="star ? 'text-amber-400' : 'text-gray-200'"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const props = defineProps<{
|
|
enrollment: boolean;
|
|
sideload: boolean;
|
|
app: boolean;
|
|
}>();
|
|
|
|
const stars = computed(() => [props.enrollment, props.sideload, props.app]);
|
|
const tooltip = computed(() => {
|
|
const labels = ["Enrollment", "Sideload", "ReBreak App"];
|
|
return stars.value.map((ok, i) => `${labels[i]}: ${ok ? "✓" : "✗"}`).join(" · ");
|
|
});
|
|
</script>
|