31 lines
620 B
Vue
31 lines
620 B
Vue
<template>
|
|
<div class="phase" :class="{ ready: ready === true, unknown: ready === undefined }">
|
|
<p v-if="ready === true">Ready</p>
|
|
<p v-if="ready === false">Not Ready</p>
|
|
<p v-if="ready === undefined">Unknown</p>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
defineProps<{
|
|
ready: boolean | undefined
|
|
}>();
|
|
</script>
|
|
|
|
<style scoped>
|
|
.phase {
|
|
padding: 0.25rem;
|
|
border-radius: 0.25rem;
|
|
cursor: pointer;
|
|
background-color: red;
|
|
}
|
|
.phase * {
|
|
color: white;
|
|
}
|
|
.phase.ready {
|
|
background-color: green;
|
|
}
|
|
.phase.unknown {
|
|
background-color: rgb(0, 119, 119);
|
|
}
|
|
</style> |