@extends('opac.layouts.layout_home')

@section("title") Detail Informasi Perpustakaan @endsection

@section("breadcrumb")
    <a class="text-white" href="/opac">Home</a> /
    <a class="text-white" href="/b"> Informasi Perpustakaan </a> /
    <a class="text-info" href=""> <b> Detail Informasi Perpustakaan </b> </a>
@endsection

@section('content')


    <div class="section mt-0">
        <div class="container mb-5">
            <div class="main main-raised main-product ">
                <div class="row">
                    <div class="col-md-9">
                        <div class="text-sm-left text-center ">
                            <h2 class="title mt-2 mb-1"> {{ $berita->judul }} </h2>
                            <p class="card-category text-blsck mb-5"> {{ $berita->author }} </p>
                        </div>
                            <img src="{{asset('storage/berita/'. $berita->gambar)}}" class="img-raised rounded img-fluid"  style="object-fit: cover; object-position: top;"
                                 onerror="this.src='https://ui-avatars.com/api/?size=235&background=c9c9c9&name='+'{{ $berita->judul }}'" />
                            <div class="colored-shadow"
                                 style="background-image: url(&quot;{{asset('storage/berita/'. $berita->gambar)}}&quot;); opacity: 1;">
                            </div>

                            <div class="text-sm-left text-center">
                                <h6 class="mt-4 mb-1 text-rose"> {{ Carbon\Carbon::parse($berita->created_at)->diffForHumans()}}
                                </h6>
                            </div>

                            <div class=""></div>

                    </div>

                    <div class="col-md-3">
                        <div class="text-sm-left text-center ">
                            <h3 class="title"> Informasi Lainnya </h3>
                        </div>
                        @foreach($berita_terbaru as $key => $b)
                            <div class="card card-plain card-blog">
                                <div class="card-header card-header-image">
                                    <a href="{{route('b.show',[$b->id])}}">
                                        <img class="img img-raised" src="{{asset('storage/berita/'.$b->gambar)}}"  style="object-fit: cover; object-position: top;"
                                             onerror="this.src='https://ui-avatars.com/api/?size=235&background=c9c9c9&name='+'{{ $b->judul }}'">
                                    </a>
                                    <div class="colored-shadow"
                                         style="background-image: url(&quot;{{asset('storage/berita/'.$b->gambar)}}&quot;); opacity: 1;"></div>
                                </div>
                                <div class="card-body">
                                    <p class="author">
                                        by
                                        <b>{{$b->author}}</b>
                                        , {{ Carbon\Carbon::parse($b->created_at)->diffForHumans()}}
                                    </p>
                                    <h4 class="card-title">
                                        <a href="{{route('b.show',[$b->id])}}">{{$b->judul}}</a>
                                    </h4>
                                    <p class="card-description">.
                                            <a
                                            href="{{route('b.show',[$b->id])}}"> Read More </a>
                                    </p>
                                </div>
                            </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection