feat: Enhance UI components and add command palette

- Updated dropdown component styles and transitions for improved UX.
- Refined checkbox, input, radio, select, and textarea components with consistent error messaging and styling.
- Introduced a new card component for better layout options.
- Added a stat card component for displaying metrics with trends.
- Implemented a command palette for global search and navigation, accessible via Cmd/Ctrl+K.
- Enhanced modal and navigation components with new styles and transitions.
- Improved layout styles for better responsiveness and visual appeal.
This commit is contained in:
2026-04-22 10:40:33 -04:00
parent a910d41e6e
commit 8baf7d6c7d
19 changed files with 859 additions and 82 deletions

View File

@@ -21,11 +21,11 @@
</button>
<div x-ref="dropdown"
class="absolute mt-2 w-48 bg-background-secondary rounded-xl shadow-xl shadow-black/5 z-10 border border-neutral/50 overflow-hidden"
class="absolute mt-3 w-48 glass-panel shadow-floating z-10 overflow-hidden"
x-show="open"
x-transition:enter="transition ease-out duration-150" x-transition:enter-start="opacity-0 scale-95 -translate-y-2"
x-transition:enter-end="opacity-100 scale-100 translate-y-0" x-transition:leave="transition ease-in duration-100"
x-transition:leave-start="opacity-100 scale-100" x-transition:leave-end="opacity-0 scale-95"
x-transition:enter="transition ease-out duration-180" x-transition:enter-start="opacity-0 scale-[0.96] -translate-y-2"
x-transition:enter-end="opacity-100 scale-100 translate-y-0" x-transition:leave="transition ease-in duration-120"
x-transition:leave-start="opacity-100 scale-100" x-transition:leave-end="opacity-0 scale-[0.96]"
x-on:click.outside="open = false" x-cloak>
<div class="py-1 [&>a]:block [&>a]:px-4 [&>a]:py-2.5 [&>a]:text-sm [&>a]:text-color-base [&>a]:transition-colors [&>a]:duration-150 [&>a:hover]:bg-primary/10 [&>a:hover]:text-primary [&>a:focus]:bg-primary/10 [&>a:focus]:text-primary [&>a:focus]:outline-none">
{{ $content }}