arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-02-01 04:37:57 +01:00
Code Issues Packages Projects Releases Wiki Activity

playground(tooltip): use buttons

Browse Source
This commit is contained in:
Benjamin Canac
2024-11-06 14:57:12 +01:00
parent 104b926c2e
commit 3c443c631c
1 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
playground/app/pages/components/tooltip.vue
View File

@@ -1,21 +1,21 @@
<template> <template>
<div class="flex flex-col"> <div class="flex flex-col gap-2">
<UTooltip text="Top" :kbds="['meta', 'T']" :content="{ side: 'top' }" arrow> <UTooltip text="Top" :kbds="['meta', 'T']" :content="{ side: 'top' }" arrow>
<UAvatar text="T" /> <UButton label="Top" color="neutral" variant="outline" block />
</UTooltip> </UTooltip>
<div class="flex items-center gap-2 ms-[-20px]"> <div class="grid grid-cols-2 gap-2">
<UTooltip text="Left" :kbds="['meta', 'L']" :content="{ side: 'left' }" arrow> <UTooltip text="Left" :kbds="['meta', 'L']" :content="{ side: 'left' }" arrow>
<UAvatar text="L" /> <UButton label="Left" color="neutral" variant="outline" block />
</UTooltip> </UTooltip>
<UTooltip text="Right" :kbds="['meta', 'R']" :content="{ side: 'right' }" arrow> <UTooltip text="Right" :kbds="['meta', 'R']" :content="{ side: 'right' }" arrow>
<UAvatar text="R" /> <UButton label="Right" color="neutral" variant="outline" block />
</UTooltip> </UTooltip>
</div> </div>
<UTooltip text="Bottom" :kbds="['meta', 'B']" arrow> <UTooltip text="Bottom" :kbds="['meta', 'B']" arrow>
<UAvatar text="B" /> <UButton label="Bottom" color="neutral" variant="outline" block />
</UTooltip> </UTooltip>
</div> </div>
</template> </template>