aboutsummaryrefslogtreecommitdiff
path: root/src/ui/c-tooltip/c-tooltip.demo.vue
diff options
context:
space:
mode:
authorGravatar Corentin THOMASSET <corentin.thomasset74@gmail.com> 2023-10-14 18:24:54 +0200
committerGravatar GitHub <noreply@github.com> 2023-10-14 16:24:54 +0000
commit025f556023c29f8f31dc00870c80a9d790bbb2f4 (patch)
tree2886353373cc17b24f97c31f6e8880fd335c443c /src/ui/c-tooltip/c-tooltip.demo.vue
parent2d2dffb14a2b51f931934055b5a59e51a070ff93 (diff)
downloadit-tools-025f556023c29f8f31dc00870c80a9d790bbb2f4.tar.gz
it-tools-025f556023c29f8f31dc00870c80a9d790bbb2f4.tar.zst
it-tools-025f556023c29f8f31dc00870c80a9d790bbb2f4.zip
refactor(ui): switched naive tooltip components to custom ones (#661)
Diffstat (limited to 'src/ui/c-tooltip/c-tooltip.demo.vue')
-rw-r--r--src/ui/c-tooltip/c-tooltip.demo.vue18
1 files changed, 18 insertions, 0 deletions
diff --git a/src/ui/c-tooltip/c-tooltip.demo.vue b/src/ui/c-tooltip/c-tooltip.demo.vue
index d385257..edd1364 100644
--- a/src/ui/c-tooltip/c-tooltip.demo.vue
+++ b/src/ui/c-tooltip/c-tooltip.demo.vue
@@ -1,3 +1,7 @@
+<script lang="ts" setup>
+const positions = ['top', 'bottom', 'left', 'right'] as const;
+</script>
+
<template>
<div>
<c-tooltip>
@@ -14,4 +18,18 @@
Hover me
</c-tooltip>
</div>
+
+ <div mt-5>
+ <h2>Tooltip positions</h2>
+
+ <div class="flex flex-wrap gap-4">
+ <div v-for="position in positions" :key="position">
+ <c-tooltip :position="position" :tooltip="`Tooltip ${position}`">
+ <c-button>
+ {{ position }}
+ </c-button>
+ </c-tooltip>
+ </div>
+ </div>
+ </div>
</template>