@extends('layouts.front')
@section('meta')
<title>{{$searchKey}}</title>
<meta property="og:title" content="{{$searchKey}}" />
<meta property="og:image" content="{{asset('assets/images/'.$gs->og_baner)}}" />
@endsection
@section('contents')

<!-- main div -->
<div class="mainDiv">
  <!-- mobile header categories -->
  <div class="bg2 marginT-15 marginB10 visible-xs">
    <div class="">
      <div class=" padding0">
        <div class="positionRelative" style="border-bottom: 3px solid #9b090d">
          <div class="mobileHeaderCategoryDiv">
            <a class="sidebarCatTitle colorBlack hoverBlue paddingLR15 textDecorationNone" aria-label="হোম"
              href="{{ route('frontend.index') }}"><strong>হোম</strong></a>
            @foreach ($categories->take(7) as $category)
              <a class="sidebarCatTitle colorBlack hoverBlue paddingLR15 textDecorationNone" aria-label="{{ $category->title }}"
                href="{{ route('frontend.category', $category->slug) }}"><strong>{{ $category->title }}</strong></a>
            @endforeach
          </div>
        </div>
      </div>
    </div>
  </div>
  <!-- mobile header categories end -->

  <!-- desktop and mobile version start -->
  <div class="bgWHite">
    <div class="container">
      <div class="row">

        <!-- header -->
        <div class="col-sm-12 col-md-12 marginB20 hidden-xs marginT10">
          <h1 class="desktopCategoryTitle"><span class="titleLeftDesign1"></span> <a href="{{ url('/search') }}"><strong>অনুসন্ধান <i class="fa fa-angle-right title1_8 verticalAlignMiddle"></i></strong></a></h1>
        </div>
        <div class="col-sm-12 col-md-12 paddingLR20 xs-paddingL15 marginB10 visible-xs paddingT10">
          <h1 class="sectionTitle displayInline border0 margin0 marginB0"><span class="titleLeftDesign1"></span> <a href="{{ url('/search') }}"><strong>অনুসন্ধান <i class="fa fa-angle-right title1_8 verticalAlignMiddle"></i></strong></a></h1>
        </div>

        <div class="col-sm-9 col-md-9">
          <div class="row">
            <!-- search box -->
            <div class="col-sm-12 col-md-12 marginB20">
              <form method="get" action="{{ route('front.news_search') }}">
                <div class="panel panel-default borderC1-1 borderRadius4 marginB0">
                  <div class="panel-body">
                    <div class="row marginLR-10">
                      <div class="col-md-9 paddingLR7">
                        <div>
                          <input value="{{ $searchKey ?? '' }}" name="search" class="form-control borderRadius5 h40" type="text" placeholder="এখানে খুঁজুন...">
                        </div>
                      </div>
                      <div class="col-md-3 paddingLR7 xs-marginT10">
                        <button type="submit" class="btn btn-block borderRadius5 width100P bgBrand title1_8 colorWhite h40 padding3"><i class="fa fa-search title1_6 verticalAlignMiddle"></i> খুঁজুন</button>
                      </div>
                    </div>
                  </div>
                </div>
              </form>
            </div>

            <!-- search results -->
            <div class="col-sm-12 col-md-12 marginT10">
              @if ($results->count() > 0)
              <div class="desktopSectionListMedia listItemLastBB0 marginT-15">
                @foreach ($results as $post)
                <div class="media positionRelative">
                  <div class="media-left">
                    <img src="{{asset('assets/images/post/'.$post->image_big)}}" class="borderRadius0" style="width:120px;height:80px;object-fit:cover;"
                      alt="{{ strlen($post->title)>100 ? mb_substr($post->title,0,100,'utf-8').'...' : $post->title}}">
                  </div>
                  <div class="media-body paddingL10">
                    <h4 class="margin0 marginB5 title11 hoverBlue"><strong>{{ strlen($post->title)>100 ? mb_substr($post->title,0,100,'utf-8').'...' : $post->title}}</strong></h4>
                    <p class="desktopTime marginB0"><i class="fa fa-clock title1_4 color2 verticalAlignMiddle marginT2"></i> {{ $post->createdAt() }}</p>
                  </div>
                  <a href="{{ route('frontend.postBySubcategory.details',[$post->category->slug ?? '',$post->slug])}}" class="linkOverlay"></a>
                </div>
                @endforeach
              </div>

              <!-- pagination -->
              @if ($results->hasPages())
              <div class="text-center marginT20 marginB20">
                {{ $results->appends(request()->query())->links() }}
              </div>
              @endif

              @else
              <div class="text-center padding20">
                <p class="colorBrand">কোন তথ্য পাওয়া যায়নি।</p>
              </div>
              @endif
            </div>
          </div>
        </div>

        <!-- sidebar -->
        <div class="col-sm-3 col-md-3 hidden-xs">
          <!-- latest popular news -->
          <div class="row">
            <div class="col-sm-12 col-md-12 marginB20">
              @include('partial.front.sidebar-latest-popular')
            </div>
          </div>
          <!-- latest popular news end -->

          <!-- sidebar ads -->
          <div class="marginB20">
            {!!$gs->sidebar_ads!!}
          </div>
        </div>

      </div>
    </div>
  </div>
  <!-- desktop and mobile version end -->
</div>
<!-- main div end -->

@endsection