@extends('frontend.template.index')
@push('after-script')
    <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-6295901a7ea9d584"></script>
@endpush
@push('meta')
    <meta property="og:title" content="{{ Str::limit($post->title, 35) }}" />
    <meta property="og:description" content="{{ Str::limit($post->excercept, 155) }}" />
    <meta property="og:image" content="{{ url('storage') . '/' . $post->thumb }}" />
@endpush
@section('content')
    <!-- SECTION 1 -->
    <section id="section-1" class="container mt-5">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
                <li class="breadcrumb-item "><a href="#" class="text-dark text-decoration-none">INFORMASI</a></li>
                <li class="breadcrumb-item active" aria-current="page">
                    <span class="text-uppercase">{{ @$nav }}</span>
                </li>
            </ol>
        </nav>
        <img src="{{ url('storage') . '/' . $post->thumb }}" class="rounded-4" width="100%" height="400vh" alt="">
    </section>
    <!-- END SECTION 1 -->

    <!-- SECTION 2 -->
    <section id="section-2" class="container mt-4">
        <h1 class="fw-bold text-dark">{{ $post->title }}</h1>

        <!-- Go to www.addthis.com/dashboard to customize your tools -->
        <div class="addthis_inline_share_toolbox"></div>

        <div class="mt-3 d-flex align-items-center">
            <span class="text-secondary me-4 fw-bold">{{ date_ID($post->created_at, 'd F Y h:i:s') }}</span>
            <span class="text-secondary fw-bold">Admin : {{ @$post->office->name }}</span>
        </div>
        <div>
            <h6 class="mt-4 text-dark fw-bold">Editor : {{ @$post->office->user->name }}</h6>
        </div>
        <div class="row">
            <div class="col-12 col-md-8">
                <div>
                    {!! $post->body !!}
                </div>
            </div>
            <div class="col-12 col-md-4">
                <h6 class="fw-bold text-dark">PROFIL</h6>
                <div class="list-group">
                    <a href="#"
                        class="list-group-item list-group-item-action bg-transparent border-0 p-0 text-decoration-underline mb-3">
                        {{ $office->name }}
                    </a>
                    <a href="#"
                        class="list-group-item list-group-item-action bg-transparent border-0 p-0 text-decoration-underline mb-3">
                        Profil Pegawai
                    </a>
                    <a href="#"
                        class="list-group-item list-group-item-action bg-transparent border-0 p-0 text-decoration-underline mb-3">
                        Sejarah Pembentukan
                    </a>
                    <a href="#"
                        class="list-group-item list-group-item-action bg-transparent border-0 p-0 text-decoration-underline mb-3">
                        Visi & Misi
                    </a>
                    <a href="#"
                        class="list-group-item list-group-item-action bg-transparent border-0 p-0 text-decoration-underline mb-3">
                        Struktur Organisasi
                    </a>
                </div>
                <h6 class="fw-bold text-dark mt-4 text-uppercase">{{ @$nav }} LAINNYA</h6>
                @php
                    $beritas = @$office
                        ->posts()
                        ->whereHas('postCategories', function ($query) use ($nav) {
                            return $query->where('name', $nav);
                        })
                        ->orderBy('id', 'DESC')
                        ->where('id', '!=', $post->id)
                        ->limit(4)
                        ->get();
                @endphp
                @foreach ($beritas as $berita)
                    <a href="{{ route('f.post.show', [$office->subdomain, 'berita', $berita->uuid]) }}"
                        data-aos="zoom-out-up" data-aos-duration="1500"
                        class="card mt-4 border-0 rounded-4 text-decoration-none">
                        <div class="card-body">
                            <img src="{{ url('storage') . '/' . $berita->thumb }}" class="rounded-4" height="200vh"
                                width="100%" alt="">
                            <h5 class="mt-3 fw-bold text-dark">
                                {{ $berita->title }}
                            </h5>
                            <span class="text-secondary">{{ date_ID($berita->created_at, 'd F Y') }}</span>
                            <p class="mt-3 text-dark">
                                {{ $berita->excercept }}
                            </p>
                        </div>
                    </a>
                @endforeach
            </div>
        </div>
    </section>
    <!-- END SECTION 2 -->
@endsection