refactor: Update UI components to TailAdmin theme

- Changed badge, button, card, dropdown, input, modal, select, table, tabs, toggle, and tooltip components to align with the TailAdmin design system.
- Updated class names and styles for consistency across components.
- Enhanced accessibility and responsiveness in various components.
- Improved hover and focus states for better user experience.
This commit is contained in:
2025-12-17 12:07:54 -05:00
parent 5004408751
commit 7a089f53e2
15 changed files with 184 additions and 180 deletions

View File

@@ -1,5 +1,5 @@
{{--
Tooltip Component - shadcn-style
Tooltip Component - TailAdmin style
Usage:
<x-proxmox::ui.tooltip text="This is a tooltip">
@@ -33,15 +33,15 @@
<div
x-show="show"
x-cloak
x-transition:enter="transition ease-out duration-100"
x-transition:enter="transition ease-out duration-150"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="transition ease-in duration-75"
x-transition:leave="transition ease-in duration-100"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
class="absolute z-50 {{ $positions[$position] ?? $positions['top'] }} pointer-events-none"
>
<div class="overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground">
<div class="overflow-hidden rounded-lg bg-gray-900 px-3 py-1.5 text-theme-xs font-medium text-white shadow-theme-md dark:bg-gray-700">
{{ $text }}
</div>
</div>