@extends('layouts.app')
@section('content')
    <main class="container-fluid my-5 body-content">
        <div class="card p-5">
            <h3 class="text-secondary text-center">{{ settings('pages-title') }}</h3>
            <p class="text-center text-justify">{{ settings('pages-description') }}</p>
            <hr>
            <div class="row">
                @foreach($pages as $page)
                    <div class="col-sm-3">
                        <div class="card">
                            <a href="{{ route('pages.show', $page->slug) }}">
                                <img class="card-img-top"
                                     src="{{ asset($page->thumb_image) }}"
                                     alt="{{ $page->title }}">
                            </a>
                            <div class="card-body">
                                <h5 class="card-title">{{ $page->title }}</h5>
                                <a href="{{ route('pages.show', $page->slug) }}" class="btn btn-sm btn-primary float-end">{{ __('More') }}</a>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
            <div class="mt-3">{{ $pages->links() }}</div>
        </div>
    </main>
@endsection