Brand code

@props([
    'href' => '/',
    'name' => null,
    'icon' => null,
])

@php
    /*
    | Brand lockup: a custom "harbour" monogram — an H whose crossbar is a
    | wave — in an accent tile, plus the app name. Pass `icon` to swap the
    | monogram for any Phosphor icon.
    |
    | Usage:
    |   <x-ui.brand />
    |   <x-ui.brand name="Acme" icon="cube" href="/" />
    */
    $name ??= config('app.name', 'Harbour');
@endphp

<a href="{{ $href }}" {{ $attributes->merge(['class' => 'inline-flex items-center gap-2.5 group']) }} aria-label="{{ $name }}">
    <span class="flex h-9 w-9 items-center justify-center rounded-xl bg-brand-600 text-white shadow-sm transition-[box-shadow,transform] group-hover:scale-105 group-hover:bg-brand-500">
        @if ($icon)
            <x-ui.icon :name="$icon" weight="fill" size="lg" />
        @else
            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.25" stroke-linecap="round" stroke-linejoin="round" class="h-5 w-5" aria-hidden="true">
                <path d="M6.5 4.75v14.5" />
                <path d="M17.5 4.75v14.5" />
                <path d="M6.5 12c1.833-2.4 3.667-2.4 5.5 0s3.667 2.4 5.5 0" />
            </svg>
        @endif
    </span>
    <span class="text-lg font-semibold tracking-tight text-gray-900 dark:text-white">{{ $name }}</span>
</a>