w33b
1f582d71d6
- Add label prop to nav-link component to display text labels only when active on large screens - Restructure navigation layout to use grid with left column for brand and inline links - Show icon-only links with title tooltips on mobile, full labels on larger screens - Adjust live search input widths for better responsive scaling across breakpoints
16 lines
818 B
PHP
16 lines
818 B
PHP
@props(['active' => false, 'label' => null])
|
|
|
|
@php
|
|
$classes = $active
|
|
? 'inline-flex h-9 min-w-0 items-center justify-center gap-1.5 rounded-full bg-gradient-to-r from-rose-600 to-pink-600 text-white shadow-md shadow-rose-600/25 max-lg:w-9 lg:px-3.5 [&>i]:shrink-0'
|
|
: 'inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-full text-gray-600 ring-1 ring-gray-200 transition-colors hover:bg-rose-50 hover:text-rose-700 dark:text-gray-300 dark:ring-neutral-700 dark:hover:bg-rose-950/30 dark:hover:text-rose-300';
|
|
@endphp
|
|
|
|
<a {{ $attributes->merge(['class' => $classes]) }} @if ($label && ! $active) title="{{ $label }}" @endif>
|
|
{{ $slot }}
|
|
|
|
@if ($active && $label)
|
|
<span class="hidden truncate text-sm font-semibold lg:inline-flex">{{ $label }}</span>
|
|
@endif
|
|
</a>
|