feat: สร้างปุ่ม trigger
This commit is contained in:
parent
c41367bda4
commit
71f73899cc
1 changed files with 39 additions and 0 deletions
39
src/components/01_branch-management/BtnAddComponet.vue
Normal file
39
src/components/01_branch-management/BtnAddComponet.vue
Normal 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>
|
||||||
Loading…
Add table
Add a link
Reference in a new issue