diff options
author | 2023-10-14 18:24:54 +0200 | |
---|---|---|
committer | 2023-10-14 16:24:54 +0000 | |
commit | 025f556023c29f8f31dc00870c80a9d790bbb2f4 (patch) | |
tree | 2886353373cc17b24f97c31f6e8880fd335c443c /src/ui/c-tooltip/c-tooltip.demo.vue | |
parent | 2d2dffb14a2b51f931934055b5a59e51a070ff93 (diff) | |
download | it-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.vue | 18 |
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> |