item handling

src/components/ui/button/action.vue

@@ -1,18 +1,18 @@
 <template>
-  <div class="z-10">
+  <div class="z-10 pointer-events-auto">
     <div
       class="dropdown relative inline-flex [--placement:top] [--strategy:absolute]"
     >
       <button
         :id
-        class="dropdown-toggle btn btn-primary btn-lg btn-square dropdown-open:rotate-45 transition-transform"
+        class="dropdown-toggle btn btn-primary btn-xl btn-square dropdown-open:rotate-45 transition-transform"
         aria-haspopup="menu"
         aria-expanded="false"
         aria-label="Menu"
       >
         <Icon
           :name="icon"
-          size="46"
+          class="size-11 shrink-0"
         />
       </button>
 
@@ -25,7 +25,7 @@
       >
         <li
           v-for="link in menu"
-          class="dropdown-item hover:bg-transparent px-0"
+          class="dropdown-item hover:bg-transparent px-0 py-1"
         >
           <NuxtLinkLocale
             v-if="link.to"

src/components/ui/button/index.vue

@@ -1,14 +1,22 @@
 <template>
-  <button class="btn join-item" :type>
-    <slot />
+  <button
+    class="btn join-item pointer-events-auto"
+    :type
+  >
+    <UiTooltip
+      :tooltip
+      v-if="tooltip"
+    >
+      <slot />
+    </UiTooltip>
+
+    <slot v-else />
   </button>
 </template>
 
 <script setup lang="ts">
-defineProps({
-  type: {
-    type: String as PropType<"reset" | "submit" | "button">,
-    default: "button",
-  },
-});
-</script>
+const { type = 'button' } = defineProps<{
+  type?: 'reset' | 'submit' | 'button'
+  tooltip?: string
+}>()
+</script>