@extends($site->themeView('layout'))

@section('content')
    <div class="container-site max-w-3xl py-10">
        <h1 class="text-3xl font-extrabold">{{ __('site.search') }}</h1>
        <form action="{{ lpath('/'.seg('search')) }}" method="get" role="search" class="mt-6 flex gap-2">
            <label for="q" class="sr-only">{{ __('site.search_terms') }}</label>
            <input id="q" name="q" type="search" value="{{ $q }}" class="field" placeholder="{{ __('site.search_what') }}" maxlength="100">
            <button class="btn-brand">{{ __('site.search_button') }}</button>
        </form>

        @if (mb_strlen($q) >= 2)
            <p class="mt-6 text-sm text-slate-500">{{ __('site.results_for', ['count' => $posts->count() + $tools->count(), 'q' => $q]) }}</p>
            <ul class="mt-4 space-y-4">
                @foreach ($tools as $tool)
                    <li class="card p-4"><a href="{{ $tool->path() }}" class="font-semibold hover:text-brand">{{ $tool->name }}</a><p class="text-sm text-slate-600">{{ $tool->summary }}</p></li>
                @endforeach
                @foreach ($posts as $post)
                    <li class="card p-4"><a href="{{ $post->path() }}" class="font-semibold hover:text-brand">{{ $post->title }}</a><p class="text-sm text-slate-600">{{ $post->excerpt }}</p></li>
                @endforeach
            </ul>
        @endif
    </div>
@endsection