Files
Virtnet.bond/extensions/Servers/Proxmox/views/components/ui/dropdown-item.blade.php
Joseph.Rawlings abff5a381f Migrate UI components from AdminLTE to LucentUI Theme using Tailwind CSS
- Updated tab-panel component to use Tailwind for styling and transitions.
- Refactored table-row component to implement Tailwind classes for hover effects and borders.
- Converted table-td component to utilize Tailwind for alignment and text styles.
- Changed table-th component to apply Tailwind for header styling and sorting indicators.
- Revised table component to adopt Tailwind for layout, borders, and responsive design.
- Enhanced tabs component with Tailwind for navigation styles and transitions.
- Updated toggle component to use Tailwind for switch styles and accessibility.
- Refactored tooltip component to implement Tailwind for positioning and styling.
- Added visual enhancements to app.css for improved UI interactions and animations.
2026-02-01 14:16:57 -05:00

42 lines
1.3 KiB
PHP

{{--
Dropdown Item Component - LucentUI Theme
Migrated from AdminLTE to Tailwind
--}}
@props([
'href' => null,
'icon' => null,
'variant' => 'default',
'disabled' => false,
])
@php
$tag = $href ? 'a' : 'button';
$baseClasses = 'flex items-center gap-2.5 w-full px-3 py-2 text-sm text-left no-underline bg-transparent border-0 rounded-md cursor-pointer transition-colors duration-200';
$variantClasses = match($variant) {
'danger' => 'text-error hover:bg-error/10 focus:bg-error/10',
'success' => 'text-success hover:bg-success/10 focus:bg-success/10',
default => 'text-primary hover:bg-primary/5 hover:text-primary-hover focus:bg-primary/5 focus:text-primary-hover dark:text-gray-200 dark:hover:bg-white/5',
};
$disabledClasses = $disabled ? 'pointer-events-none opacity-50' : '';
@endphp
<{{ $tag }}
@if($href) href="{{ $href }}" @endif
@if($tag === 'button') type="button" @endif
@if($disabled) disabled @endif
{{ $attributes->class([
$baseClasses,
$variantClasses,
$disabledClasses,
]) }}
>
@if($icon)
<x-dynamic-component :component="$icon" class="shrink-0 w-4.5 h-4.5" />
@endif
<span class="flex-1">{{ $slot }}</span>
</{{ $tag }}>