@extends('layouts.app')
@section('page_title', __('projects.title'))
@section('page_description', __('projects.description'))
@section('page_keywords', __('projects.keywords'))
@section('og_title', __('projects.title'))
@section('og_description', __('projects.description'))
@section('twitter_title', __('projects.title'))
@section('twitter_description', __('projects.description'))
@section('page_content')
    <div class="page-content bg-white">
        <div class="dlab-bnr-inr bg-pt" style="background-image:url({{ asset('assets/images/about/banner.jpg') }});">
            <div class="container">
                <div class="dlab-bnr-inr-entry">
                    <h1 class="text-white">@lang('projects.title')</h1>
                    <div class="breadcrumb-row">
                        <ul class="list-inline">
                            <li><a href="{{ route('static.home') }}">@lang('home.title')</a></li>
                            <li>@lang('projects.title')</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <div class="content-block">
            <div class="section-full content-inner-2 portfolio bg-gray" id="portfolio">
                <div class="container">
                    <h6>@lang('home.section3.description')</h6>
                    <div class="clearfix" id="lightgallery">
                        <ul id="masonry" class="portfolio-ic dlab-gallery-listing gallery-grid-4 gallery row p-l0 sp10 lightgallery text-center">
                           @foreach($projects as $project)
                                <li class="web design card-container col-lg-3 col-md-6 col-sm-6 p-a0">
                                <div class="dlab-box dlab-gallery-box">
                                    <div class="dlab-media dlab-img-overlay1 dlab-img-effect">
                                        <a href="{{ route('static.project', $project->slug )}}"> <img src="{{ $project->cover_image_url }}"  alt=""> </a>
                                        <div class="overlay-bx">
                                            <div class="overlay-icon">
                                                <div class="text-white">
                                                    <a href="{{ route('static.project', $project->slug )}}"><i class="fa fa-link icon-bx-xs"></i></a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="dez-info p-a30 bg-white">
                                        <p class="dez-title m-t0"><a href="{{ route('static.project', $project->slug )}}">{{ Str::limit($project -> name, 60)}}</a></p>
                                        <p><small>{{ $project -> short_description }}</small></p>
                                    </div>
                                </div>
                            </li>
                            @endforeach
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection