@extends('layouts.layout-inner')

@section('content')

<style>
#contentPage .row {
	/* column width */
	-moz-column-width: 25em;
	-webkit-column-width: 25em;
	/* space between columns */
	-moz-column-gap: 1em;
	-webkit-column-gap: 1em;
}
#contentPage .item {
	display: inline-block;
	width: 100%;
}
</style>

<div class="container-fluid no-padding">
  <div class="inner-page-title-wrap">
    <div class="inner-page-title">
      <h2>{{ isset($pageTitle) ? $pageTitle : 'Untitled' }}</h2>
    </div>
    <div class="inner-page-title-pointer"></div>
  </div>
</div>

<div id="contentPage" class="container top-bot-spacer-40">
  <div class="container">
    <div class="row">
        @foreach ($articles as $article)
        <div class="item well">
            <h2>{{ $article->title }}<br><span>Posted on {{ Carbon\Carbon::parse($article->created_at)->format('d, M Y') }}</span></h2>
            @if ($article->image)
                <div class="article-list-cont-img2"><img src="{{ asset('uploads/articles/thumbs/' . $article->image) }}" alt="" class="img-responsive"></div>
            @endif
            <div class="clearfix"></div>
            <p>{!! str_limit($article->description, 100) !!}</p>
            <a href="{{ route('frontend.article.details', ['id' => $article->id]) }}" class="article-btn2">Read More</a>
        </div>
        @endforeach

    </div>
  </div>
</div>
@endsection