floating-ui-vue-skilld
CommunityPosition Vue UI elements with precision.
Authorharlan-zw
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill simplifies the complex task of positioning UI elements like tooltips, dropdowns, and popovers in Vue applications, ensuring they are always visible and correctly anchored.
Core Features & Use Cases
- Precise Positioning: Accurately places floating elements relative to reference elements, handling scrolling, viewport boundaries, and element resizing.
- Interactive Elements: Enables the creation of accessible and dynamic UI components like tooltips, menus, and dialogs.
- Use Case: Quickly implement a custom dropdown menu for a Vue project that correctly positions itself below the trigger button, flips to the top if space is limited, and shifts to stay within the viewport boundaries.
Quick Start
Use the floating-ui-vue-skilld to position a tooltip element relative to a button element.
Dependency Matrix
Required Modules
@floating-ui/vue
Components
scriptsreferences
💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: floating-ui-vue-skilld Download link: https://github.com/harlan-zw/vue-ecosystem-skills/archive/main.zip#floating-ui-vue-skilld Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.