@extends('main')
@section('styles')
  {!! Html::style(Theme::current()->assetPath.'/prettyPhoto/css/prettyPhoto.min.css') !!}
@endsection
@section('page-title')
  <div class="heading-banner-area overlay-bg">
    <div class="container">
      <div class="row">
        <div class="col-md-12">
          <div class="heading-banner">
            <div class="heading-banner-title">
              <h2>{{ $category->title }}</h2>
            </div>
            <div class="breadcumbs pb-15">
              <ul>
                <li class="breadcrumb-item">
                  <a href="{{ Route('mobily.site.home.page') }}">
                    {{ __('Home') }}
                  </a>
                </li>
                <li class="breadcrumb-item">
                  <a href="{{ Route('mobily.product.index') }}">
                    {{ __('Products') }}
                  </a>
                </li>
                <li class="breadcrumb-item active">{{ $category->title }}</li>
              </ul>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
@endsection
@section('content')
  <div class="product-area pt-80 pb-80 product-style-2">
    <div class="container">
      <!-- Shop-Content End -->
      <div class="shop-content">
        <div class="row">
          <div class="col-md-12">
            <div class="row">
              @if ($categories->count())
							<ul class="work-list">
				      @foreach ($categories as $key => $item)
                <!-- Single-product start -->
                <div class="col-lg-3 col-md-4 col-sm-4 col-xs-12">
                  <div class="single-product">
                    <div class="product-img">
                      <a href="{{ Route('mobily.product.category',[$item->slug]) }}">
                        @if (@$item->photo)
                          <img class="img-responsive" src="{{ path_img($item->photo) }}" alt="{{ $item->title }}" title="{{ $item->title }}" >
                        @else
                          <img class="img-responsive" src="{{ asset('images/no-image.png') }}" alt="{{ $item->title }}" title="{{ $item->title }}" >
                        @endif
                      </a>
                    </div>
                    <div class="product-info clearfix text-center">
                      <div class="fix">
                        <h4 class="post-title"><a href="{{ Route('mobily.product.category',[$item->slug]) }}">{{ $item->title }}</a></h4>
                      </div>
                      <div class="fix">
                      </div>
                    </div>
                  </div>
                </div>
                <!-- Single-product end -->
              @endforeach
              @endif
            </div>
          </div>

        </div>
      </div>
      <!-- Shop-Content End -->
    </div>
  </div>
@endsection
@section('scripts')
  {!! Html::script(Theme::current()->assetPath.'/prettyPhoto/js/jquery.prettyPhoto.min.js') !!}
  <script type="text/javascript">
    jQuery(document).ready(function($){
      $("a[rel^='prettyPhoto']").prettyPhoto({social_tools:''});
    });
  </script>
@endsection