feat: สร้างปุ่ม trigger

This commit is contained in:
Net 2024-04-02 17:46:24 +07:00
parent c41367bda4
commit 71f73899cc

View file

@ -0,0 +1,39 @@
<script setup lang="ts">
defineProps<{
label?: string;
}>();
</script>
<template>
<div class="column items-center box" :class="{ dark: $q.dark.isActive }">
<div class="row">
<q-btn
@click="$emit('trigger')"
size="lg"
class="color-btn"
icon="mdi-plus"
round
/>
</div>
<div class="row q-mt-sm color-text">{{ label }}</div>
</div>
</template>
<style scoped>
.box {
--_btn-add-color: var(--cyan-6-hsl);
.color-btn {
color: hsl(var(--_btn-add-color));
background: hsla(var(--_btn-add-color) / 0.1) !important;
}
.color-text {
color: var(--stone-6);
}
&.dark {
--_btn-add-color: var(--cyan-5-hsl);
}
}
</style>