@extends('layouts.app')
@section('content')
    <!-- Main Container -->
    <main id="main-container">
        <!-- Hero -->
        <div class="bg-image" style="background-image: url('{{asset('website/assets/media/photos/photo9@2x.jpg')}}');">
            <div class="bg-black-50">
                <div class="content content-top content-full text-center">
                    <h1 class=" text-white mb-1 py-5 text-white text-center">Publications</h1>
                </div>
            </div>
        </div>
        <!-- END Hero -->

        <!-- Page Content -->
        <div class="content content-full">
            <div class="row row-deck">
{{--            {{dd($data)}}--}}
                @foreach($data as $publication)
                <!-- Story -->
                <div class="col-lg-4 invisible" data-toggle="appear" data-offset="50" data-class="animated fadeIn">
                    <a class="block block-rounded block-link-pop" href="{{route('website.publications.show',$publication->id)}}">
                        <img class="img-fluid" src="{{asset($publication->image)}}" alt="{{$publication->title}}">
                        <div class="block-content">
                            <h4 class="mb-1">{{$publication->title}}</h4>
                            <p class="font-size-sm">
                                <span class="text-primary">{{$publication->by}}</span> on {{$publication->created_at->format('M d, Y')}} ·
                            </p>
                            <p>
                                {{strip_tags(\Illuminate\Support\Str::limit($publication->body))}}
                            </p>
                        </div>
                    </a>
                </div>
                <!-- END Story -->
               @endforeach
            </div>
        {{ $data->links() }}

        </div>
        <!-- END Page Content -->
    </main>
    <!-- END Main Container --
@endsection