@extends('User.layouts.layout')
@section('desc_text',__('messages.blogs'))
@section('breadcrumb',__('messages.blogs'))
@section('left_image',$setting['blogs_image'])
@section('contents')
<style>
    .card_item{
        border-radius: 5px;
        overflow: hidden;
        border: 1px solid #cdcdcd;
        cursor: pointer;
    }
    .card_item:hover{
        background-color: #a5262d;
        color: white;
        transform: scale(1.02);
    }
</style>

@if (count($Blogs))
    <div class="title my-4">
        <h1 class="pb-3" >{{ $SEO['blog']['title_'.lang()]['value'] }}</h1>
    </div>
    <div>
        <div class="row">
            @foreach ($Blogs as $Blog)
            <div class="col-12 col-lg-4 mx-auto {{ ($loop->iteration % 2) < 1 ? 'transform__item_left' : 'transform__item_right' }}">
                <div class="my-4 card_item transition-me" onclick="window.open('{{ route('user.blogs_details', ['title' => str_replace(' ', '-', $Blog['title_' . app()->getlocale() ]),'lang' => app()->getLocale()]) }}','_self')">
                    <div class="">
                        <img src="{{ asset(($Blog['image'] ?? $Blog['slider']) ?? '/logo.png') }}" style="width: 100%; max-height: 180px; overflow: hidden;" class="img-fluid" alt="{{ $Blog['title_'.lang()] }}">
                    </div>
                    <div class="px-4" style="height: 70px;">
                        <h5 class="py-2">{{ $Blog['title_'.lang()] }}</h5>
                    </div>
                    <div class="px-4">
                        <h6 class="py-2"><i class="fas fa-calendar mx-2"></i>{{$Blog->created_at->diffForHumans()}}</h6>
                    </div>
                </div>
            </div>
            @endforeach
        </div>
    </div>

@endif

@endsection



@section('SEO')
    <title>{{ $SEO['blog']['title_'.lang()]['value'] }}</title>
    <link rel="canonical" href="{{ url()->full() }}">
    <link rel="sitemap" href="/sitemap.xml" title="Sitemap" type="application/xml">
    <link href="https://emcan-group.com/emcan.webp" rel="shortcut icon">
    <meta name="robots" content="max-snippet:-1,max-image-preview:large,max-video-preview:-1">
    <meta name="description" content="{{ $SEO['blog']['desc_'.lang()]['value'] }}">
    <meta name="keywords" content="{{ $SEO['blog']['keywords_'.lang()]['value'] }}">
    <meta name="author" content="Emcan Solutions">
    <meta name="image" content="https://emcan-group.com/emcan.jpg">
    <meta property="og:title" content="{{ $SEO['blog']['title_'.lang()]['value'] }}">
    <meta property="og:description" content="{{ $SEO['blog']['desc_'.lang()]['value'] }}">
    <meta property="og:locale" content="en">
    <meta property="og:image" content="https://emcan-group.com/emcan.webp">
    <meta property="og:url" content="{{ url()->full() }}">
    <meta property="og:site_name" content="Emcan Solutions">
    <meta property="og:type" content="website">
    <meta name="twitter:card" content="{{ $SEO['blog']['title_'.lang()]['value'] }}">
    <meta name="twitter:title" content="{{ $SEO['blog']['title_'.lang()]['value'] }}">
    <meta name="twitter:description" content="{{ $SEO['blog']['desc_'.lang()]['value'] }}">
    <meta name="twitter:site" content="@EmcanSolutions">
@endsection