@extends('frontend.layouts.app')

@section('frontend_content')

<div class="page-header text-center" style="background-image: url('{{ asset('frontend_asset/images/page-header-bg.jpg')}}')">
    <div class="container">
        <h1 class="page-title">Blog Page</h1>
    </div><!-- End .container -->
</div><!-- End .page-header -->
<nav aria-label="breadcrumb" class="breadcrumb-nav mb-2">
    <div class="container">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ url('/') }}">Home</a></li>
            <li class="breadcrumb-item"><a href="{{ url('/blog-page') }}">Blog Page</a></li>
            {{-- <li class="breadcrumb-item active" aria-current="page">Blog Page</li> --}}
        </ol>
    </div><!-- End .container -->
</nav><!-- End .breadcrumb-nav -->

<div class="page-content">
    <div class="container">
        {{-- <nav class="blog-nav">
            <ul class="menu-cat entry-filter justify-content-center">
                <li class="active"><a href="#" data-filter="*">All Blog Posts<span>8</span></a></li>
                <li><a href="#" data-filter=".lifestyle">Lifestyle<span>3</span></a></li>
                <li><a href="#" data-filter=".shopping">Shopping<span>1</span></a></li>
                <li><a href="#" data-filter=".fashion">Fashion<span>2</span></a></li>
                <li><a href="#" data-filter=".travel">Travel<span>3</span></a></li>
                <li><a href="#" data-filter=".hobbies">Hobbies<span>2</span></a></li>
            </ul><!-- End .blog-menu --> --}}
        {{-- </nav><!-- End .blog-nav --> --}}

        <div class="entry-container max-col-4" data-layout="fitRows">
            <div class="entry-item lifestyle shopping col-sm-6 col-md-4 col-lg-3">
                <article class="entry entry-grid text-center">
                    <figure class="entry-media">
                        <a href="single.html">
                            <img src="{{ asset('frontend_asset/images/blog/grid/4cols/post-1.jpg')}}" alt="image desc">
                        </a>
                    </figure><!-- End .entry-media -->

                    <div class="entry-body">
                        <div class="entry-meta">
                            <a href="#">Nov 22, 2018</a>
                            <span class="meta-separator">|</span>
                            <a href="#">2 Comments</a>
                        </div><!-- End .entry-meta -->

                        <h2 class="entry-title">
                            <a href="{{ url('/blog-details-page') }}">Cras ornare tristique elit.</a>
                        </h2><!-- End .entry-title -->

                        <div class="entry-cats">
                            in <a href="{{ url('/blog-page') }}">Lifestyle</a>,
                            <a href="{{ url('/blog-page') }}">Shopping</a>
                        </div><!-- End .entry-cats -->

                        <div class="entry-content">
                            <p>Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh. </p>
                            <a href="{{ url('/blog-details-page') }}" class="read-more">Continue Reading</a>
                        </div><!-- End .entry-content -->
                    </div><!-- End .entry-body -->
                </article><!-- End .entry -->
            </div><!-- End .entry-item -->

            <div class="entry-item lifestyle col-sm-6 col-md-4 col-lg-3">
                <article class="entry entry-grid text-center">
                    <figure class="entry-media entry-video">
                        <a href="{{ url('blog-details-page') }}">
                            <img src="{{ asset('frontend_asset/images/blog/grid/4cols/post-2.jpg')}}" alt="image desc">
                        </a>
                    </figure><!-- End .entry-media -->

                    <div class="entry-body">
                        <div class="entry-meta">
                            <a href="#">Nov 21, 2018</a>
                            <span class="meta-separator">|</span>
                            <a href="#">0 Comments</a>
                        </div><!-- End .entry-meta -->

                        <h2 class="entry-title">
                            <a href="{{ url('/blog-details-page') }}">Vivamus vestibulum ntulla necante.</a>
                        </h2><!-- End .entry-title -->

                        <div class="entry-cats">
                            in <a href="{{ url('/blog-page') }}">Lifestyle</a>
                        </div><!-- End .entry-cats -->

                        <div class="entry-content">
                            <p>Morbi purus libero, faucibus commodo quis, gravida id, est. Vestibulumvo lutpat, lacus a ultrices sagittis ... </p>
                            <a href="{{ url('/blog-details-page') }}" class="read-more">Continue Reading</a>
                        </div><!-- End .entry-content -->
                    </div><!-- End .entry-body -->
                </article><!-- End .entry -->
            </div><!-- End .entry-item -->

            <div class="entry-item lifestyle fashion col-sm-6 col-md-4 col-lg-3">
                <article class="entry entry-grid text-center">
                    <figure class="entry-media">
                        <div class="owl-carousel owl-simple owl-light owl-nav-inside" data-toggle="owl">
                            <a href="{{ url('/blog-details-page') }}">
                                <img src="{{ asset('frontend_asset/images/blog/grid/4cols/post-3.jpg')}}" alt="image desc">
                            </a>
                            <a href="{{ url('/blog-details-page') }}">
                                <img src="{{ asset('frontend_asset/images/blog/grid/4cols/post-4.jpg')}}" alt="image desc">
                            </a>
                        </div><!-- End .owl-carousel -->
                    </figure><!-- End .entry-media -->

                    <div class="entry-body">
                        <div class="entry-meta">
                            <a href="#">Nov 18, 2018</a>
                            <span class="meta-separator">|</span>
                            <a href="#">3 Comments</a>
                        </div><!-- End .entry-meta -->

                        <h2 class="entry-title">
                            <a href="{{ url('/blog-details-page') }}">Utaliquam sollicitudin leo.</a>
                        </h2><!-- End .entry-title -->

                        <div class="entry-cats">
                            in <a href="{{ url('/blog-page') }}">Fashion</a>,
                            <a href="{{ url('/blog-page') }}">Lifestyle</a>
                        </div><!-- End .entry-cats -->

                        <div class="entry-content">
                            <p>Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh ... </p>
                            <a href="{{ url('/blog-details-page') }}" class="read-more">Continue Reading</a>
                        </div><!-- End .entry-content -->
                    </div><!-- End .entry-body -->
                </article><!-- End .entry -->
            </div><!-- End .entry-item -->

            <div class="entry-item travel col-sm-6 col-md-4 col-lg-3">
                <article class="entry entry-grid text-center">
                    <figure class="entry-media">
                        <a href="{{ url('/blog-details-page') }}">
                            <img src="{{ asset('frontend_asset/images/blog/grid/4cols/post-4.jpg')}}" alt="image desc">
                        </a>
                    </figure><!-- End .entry-media -->

                    <div class="entry-body">
                        <div class="entry-meta">
                            <a href="#">Nov 15, 2018</a>
                            <span class="meta-separator">|</span>
                            <a href="#">4 Comments</a>
                        </div><!-- End .entry-meta -->

                        <h2 class="entry-title">
                            <a href="{{ url('/blog-details-page') }}">Fusce pellentesque suscipit.</a>
                        </h2><!-- End .entry-title -->

                        <div class="entry-cats">
                            in <a href="{{ url('/blog-page') }}">Travel</a>
                        </div><!-- End .entry-cats -->

                        <div class="entry-content">
                            <p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas auguae, eu vulputate magna eros ...</p>
                            <a href="{{ url('/blog-details-page') }}" class="read-more">Continue Reading</a>
                        </div><!-- End .entry-content -->
                    </div><!-- End .entry-body -->
                </article><!-- End .entry -->
            </div><!-- End .entry-item -->

            {{-- <div class="entry-item travel hobbies col-sm-6 col-md-4 col-lg-3">
                <article class="entry entry-grid text-center">
                    <figure class="entry-media">
                        <a href="single.html">
                            <img src="{{ asset('frontend_asset/images/blog/grid/4cols/post-5.jpg')}}" alt="image desc">
                        </a>
                    </figure><!-- End .entry-media -->

                    <div class="entry-body">
                        <div class="entry-meta">
                            <a href="#">Nov 11, 2018</a>
                            <span class="meta-separator">|</span>
                            <a href="#">2 Comments</a>
                        </div><!-- End .entry-meta -->

                        <h2 class="entry-title">
                            <a href="single.html">Aenean dignissim pellente squefelis.</a>
                        </h2><!-- End .entry-title -->

                        <div class="entry-cats">
                            in <a href="#">Travel</a>,
                            <a href="#">Hobbies</a>
                        </div><!-- End .entry-cats -->

                        <div class="entry-content">
                            <p>Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus ... </p>
                            <a href="single.html" class="read-more">Continue Reading</a>
                        </div><!-- End .entry-content -->
                    </div><!-- End .entry-body -->
                </article><!-- End .entry -->
            </div><!-- End .entry-item --> --}}

            {{-- <div class="entry-item hobbies col-sm-6 col-md-4 col-lg-3">
                <article class="entry entry-grid text-center">
                    <figure class="entry-media">
                        <a href="single.html">
                            <img src="{{ asset('frontend_asset/images/blog/grid/4cols/post-6.jpg')}}" alt="image desc">
                        </a>
                    </figure><!-- End .entry-media -->

                    <div class="entry-body">
                        <div class="entry-meta">
                            <a href="#">Nov 10, 2018</a>
                            <span class="meta-separator">|</span>
                            <a href="#">4 Comments</a>
                        </div><!-- End .entry-meta -->

                        <h2 class="entry-title">
                            <a href="single.html">Quisque volutpat mattiseros.</a>
                        </h2><!-- End .entry-title -->

                        <div class="entry-cats">
                            in <a href="#">Hobbies</a>
                        </div><!-- End .entry-cats -->

                        <div class="entry-content">
                            <p>Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus. Phasellus ultrices nulla quis ...</p>
                            <a href="single.html" class="read-more">Continue Reading</a>
                        </div><!-- End .entry-content -->
                    </div><!-- End .entry-body -->
                </article><!-- End .entry -->
            </div><!-- End .entry-item --> --}}

            {{-- <div class="entry-item travel col-sm-6 col-md-4 col-lg-3">
                <article class="entry entry-grid text-center">
                    <figure class="entry-media">
                        <div class="owl-carousel owl-simple owl-light owl-nav-inside" data-toggle="owl">
                            <a href="single.html">
                                <img src="{{ asset('frontend_asset/images/blog/grid/4cols/post-7.jpg')}}" alt="image desc">
                            </a>
                            <a href="single.html">
                                <img src="{{ asset('frontend_asset/images/blog/grid/4cols/post-6.jpg')}}" alt="image desc">
                            </a>
                        </div><!-- End .owl-carousel -->
                    </figure><!-- End .entry-media -->

                    <div class="entry-body">
                        <div class="entry-meta">
                            <a href="#">Nov 11, 2018</a>
                            <span class="meta-separator">|</span>
                            <a href="#">3 Comments</a>
                        </div><!-- End .entry-meta -->

                        <h2 class="entry-title">
                            <a href="single.html">Utaliquam sollicitudin leo.</a>
                        </h2><!-- End .entry-title -->

                        <div class="entry-cats">
                            in <a href="#">Travel</a>
                        </div><!-- End .entry-cats -->

                        <div class="entry-content">
                            <p>Praesent dapibus, neque id cursus faucibus, tortor neque egestas auguae, eu vulputate magna eros ...</p>
                            <a href="single.html" class="read-more">Continue Reading</a>
                        </div><!-- End .entry-content -->
                    </div><!-- End .entry-body -->
                </article><!-- End .entry -->
            </div><!-- End .entry-item --> --}}

            {{-- <div class="entry-item fashion col-sm-6 col-md-4 col-lg-3">
                <article class="entry entry-grid text-center">
                    <figure class="entry-media">
                        <a href="single.html">
                            <img src="{{ asset('frontend_asset/images/blog/grid/4cols/post-8.jpg')}}" alt="image desc">
                        </a>
                    </figure><!-- End .entry-media -->

                    <div class="entry-body">
                        <div class="entry-meta">
                            <a href="#">Nov 08, 2018</a>
                            <span class="meta-separator">|</span>
                            <a href="#">0 Comments</a>
                        </div><!-- End .entry-meta -->

                        <h2 class="entry-title">
                            <a href="single.html">Quisque a lectus. </a>
                        </h2><!-- End .entry-title -->

                        <div class="entry-cats">
                            in <a href="#">Fashion</a>
                        </div><!-- End .entry-cats -->

                        <div class="entry-content">
                            <p>Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus ... </p>
                            <a href="single.html" class="read-more">Continue Reading</a>
                        </div><!-- End .entry-content -->
                    </div><!-- End .entry-body -->
                </article><!-- End .entry -->
            </div><!-- End .entry-item --> --}}
        </div><!-- End .entry-container -->

        <nav aria-label="Page navigation">
            <ul class="pagination justify-content-center">
                <li class="page-item disabled">
                    <a class="page-link page-link-prev" href="#" aria-label="Previous" tabindex="-1" aria-disabled="true">
                        <span aria-hidden="true"><i class="icon-long-arrow-left"></i></span>Prev
                    </a>
                </li>
                <li class="page-item active" aria-current="page"><a class="page-link" href="#">1</a></li>
                <li class="page-item"><a class="page-link" href="#">2</a></li>
                <li class="page-item">
                    <a class="page-link page-link-next" href="#" aria-label="Next">
                        Next <span aria-hidden="true"><i class="icon-long-arrow-right"></i></span>
                    </a>
                </li>
            </ul>
        </nav>
    </div><!-- End .container -->
</div><!-- End .page-content -->

@endsection