1234567891011121314151617181920212223242526272829303132333435 |
- <template>
- <Menu as="div" class="relative inline-block text-left">
- <div>
- <MenuButton class="flex items-center text-grey-400 hover:text-grey-600 focus:outline-none">
- <span class="sr-only">Open options</span>
- <icon
- name="more"
- class="block w-6 h-6 text-grey-300 fill-current cursor-pointer outline-none"
- aria-hidden="true"
- />
- </MenuButton>
- </div>
- <transition
- enter-active-class="transition ease-out duration-100"
- enter-from-class="transform opacity-0 scale-95"
- enter-to-class="transform opacity-100 scale-100"
- leave-active-class="transition ease-in duration-75"
- leave-from-class="transform opacity-100 scale-100"
- leave-to-class="transform opacity-0 scale-95"
- >
- <MenuItems
- class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none z-10"
- >
- <div class="py-1">
- <slot></slot>
- </div>
- </MenuItems>
- </transition>
- </Menu>
- </template>
- <script setup>
- import { Menu, MenuButton, MenuItem, MenuItems } from '@headlessui/vue'
- </script>
|