fix: added tooltip on action buttons

This commit is contained in:
Shariq Ansari 2024-02-28 21:38:39 +05:30
parent f080f22179
commit cf1b3ed82d

View File

@ -11,15 +11,17 @@
/> />
<div class="actions flex items-center justify-center"> <div class="actions flex items-center justify-center">
<Tooltip text="Set As Primary" v-if="!isNew && !option.selected">
<Button <Button
variant="ghost" variant="ghost"
size="sm" size="sm"
v-if="!isNew && !option.selected"
class="opacity-0 hover:bg-gray-300 group-hover:opacity-100" class="opacity-0 hover:bg-gray-300 group-hover:opacity-100"
@click="option.onClick" @click="option.onClick"
> >
<SuccessIcon /> <SuccessIcon />
</Button> </Button>
</Tooltip>
<Tooltip text="Edit">
<Button <Button
variant="ghost" variant="ghost"
size="sm" size="sm"
@ -28,6 +30,8 @@
> >
<EditIcon /> <EditIcon />
</Button> </Button>
</Tooltip>
<Tooltip text="Delete">
<Button <Button
variant="ghost" variant="ghost"
icon="x" icon="x"
@ -35,6 +39,7 @@
class="opacity-0 hover:bg-gray-300 group-hover:opacity-100" class="opacity-0 hover:bg-gray-300 group-hover:opacity-100"
@click="() => option.onDelete(option, isNew)" @click="() => option.onDelete(option, isNew)"
/> />
</Tooltip>
</div> </div>
</div> </div>
<div> <div>
@ -50,7 +55,7 @@
<script setup> <script setup>
import SuccessIcon from '@/components/Icons/SuccessIcon.vue' import SuccessIcon from '@/components/Icons/SuccessIcon.vue'
import EditIcon from '@/components/Icons/EditIcon.vue' import EditIcon from '@/components/Icons/EditIcon.vue'
import { TextInput } from 'frappe-ui' import { TextInput, Tooltip } from 'frappe-ui'
import { nextTick, ref, onMounted } from 'vue' import { nextTick, ref, onMounted } from 'vue'
const props = defineProps({ const props = defineProps({