@extends('front.layout.app')

@section('title')
        
@stop
 

@section('content')
  
 <section class="background-dark">
    <div class="container">
    <h2 class="font-weight-400 m-b-0 text-white">Everything is designed.</h2>
    <h2 class="font-weight-400 text-white">Few things are <span class="text-rotator font-weight-700" data-animation="flash" data-speed="3000">designed well.,designed simply.,designed better.</span></h2>
    </div>
    </section>
    
    
    <section class="background-black">
        <div class="container">
           <div class="portfolio">
              <nav class="grid-filter gf-outline gf-light" data-layout="#portfolio">
                 <ul>
                    <li class = "active"> <a href="#" data-category="*"> إظهار الكل </a> </li>
                    @foreach ($categories as $category)
                    <li> <a href="#" data-category=".c{{ $category->id }}">{{ $category->title_ar }}</a> </li>
                    @endforeach 
                 </ul>
              </nav>
              <div id="portfolio" class="grid-layout portfolio-4-columns" data-margin="10">
                 @foreach ($categories as $category) 
                 @foreach ($category->workes as $item)
                 <div class="portfolio-item img-zoom c{{ $category->id }}">  
                     <div class="portfolio-item-wrap">
                         <div class="portfolio-image">
                            <a href="{{ route('view.work',$item->id )}}"><img src="{{ asset('storage/works/' . ($item->image ?? '')) }}" alt=""></a>
                         </div>
                         <div class="portfolio-description">
                             @if ($item->v_link)
                             <a title="Paper Pouch!" data-lightbox="iframe" href="{{$item->v_link}}"><i class="fa fa-play"></i></a>
                             @endif 
                             <a href="{{ route('view.work',$item->id )}}">
                               <h3>@if (LaravelLocalization::getCurrentLocale() == 'ar')
                                 {{ $item->title_ar }}@else{{ $item->title }}
                                 @endif
                               </h3> 
                            </a>
                         </div>
                      </div> 
                 </div>
                 @endforeach 
                 @endforeach 
                  
              </div>
           </div>
        </div>
     </section>
    
     
@endsection

@section('js')
    
@endsection