@if($searchable)
<div class="search-panel">
    <div class="search-bar p-3 mb-4 bg-primary">



        <form action="{{ url()->current() }}">
            {{--<input type="hidden" name="template" value="{{ $template }}"/>--}}
            <div class="input-group position-relative">
                @if($searchable & \App\Models\Page::SEARCHABLE_BAR)
                <input type="text"
                       id="search-keyword"
                       name="q"
                       class="form-control rounded-pill-start"
                       placeholder="Search by Keyword"
                       aria-label="Search by Keyword"
                       aria-describedby="Search by Keyword"
                       value="{{ $formValue('q') }}"
                >
                @endif
                @if($searchable & \App\Models\Page::SEARCHABLE_FILTER)
                    <label for="search-category" class="d-none"></label>
                    <select id="search-category" class="form-control" name="category">
                        <option value="">All Categories</option>
                        @foreach($filters as $f)
                        <option value="{{ $f->id }}" style="{{ _style('background-color', $f) }} {{ _style('color', $f) }}" @if($isFormValue('category', $f->id)) selected @endif>{{ $f->name }}</option>
                        @endforeach
                    </select>
                @endif
                @if($page->template)
                    <div class="input-group-append">
                        <a href="{{ url()->current() }}" class="btn bg-white rounded-0 border border-1">
                            <i id="clean-keyword" class="far fa-times-circle"></i>
                        </a>
                    </div>
                @endif
                <div class="input-group-append">
                    <button class="btn btn-secondary rounded-pill-end px-4" type="submit">
                        <i class="fas fa-search"></i> <span class="d-none d-sm-inline-block">Search</span>
                    </button>
                </div>

                {{--@if($page->template)
                <a href="{{ route('template.page.show', ['template' => $page->template]) }}" class="far fa-times-circle position-absolute"></a>
                @endif--}}
                {{--<i id="clean-keyword" class="fas fa-times position-absolute @if(!$formValue('q')) d-none @endif"></i>--}}
            </div>

        </form>

    </div>
</div>
@endif

@push('js')
<script>
    SearchBar.init({
        url: '{{ url()->current() }}'
    });
</script>
@endpush