27 lines
560 B
Vue
27 lines
560 B
Vue
<script setup lang="ts">
|
|
defineProps<{
|
|
name: string
|
|
type: 'indoor' | 'outdoor'
|
|
}>()
|
|
</script>
|
|
|
|
<template>
|
|
<div class="rounded-lg bg-white flex-grow flex justify-between overflow-hidden">
|
|
<div class="py-4 px-6 text-center flex-grow">
|
|
{{ name }}
|
|
</div>
|
|
<div
|
|
class="px-4 flex items-center justify-center"
|
|
:class="{
|
|
'bg-yellow-400': type === 'indoor',
|
|
'bg-lime-500': type === 'outdoor'
|
|
}"
|
|
>
|
|
<Icon
|
|
:name="type === 'indoor' ? 'bi:house' : 'bi:tree'"
|
|
class="text-white"
|
|
></Icon>
|
|
</div>
|
|
</div>
|
|
</template>
|