@extends('opac.layouts.layout_home')

@section("title") Pustaka Multimedia @endsection

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

@section('content')

    <div class="section">
        <div class="container mb-5">
            <div class="main main-raised main-product pl-md-5 pr-md-5 pt-md-3 p-3">
                <div class="row p-md-0 pl-3 pr-3 pb-0 pt-1 ">
                    <h2 class="title mt-0"> Pustaka Multimedia </h2>
                    <form action="{{route('pm.index')}}" class="form-inline ml-auto">
                        <div class="form-group has-info bmd-form-group pt-0">
                            <input type="text" value="{{Request::get('keyword')}}" name="keyword" class="form-control" width="" placeholder="Pencarian Pustaka Multimedia">
                        </div>
                        <button type="submit" class="btn btn-info btn-raised btn-fab btn-round">
                            <i class="material-icons">search</i>
                        </button>
                    </form>
                </div>
                <div class="row  p-md-0 pl-3 pr-3 pb-0 pt-1 ">
                    <div class="filter-result">
                        Terdapat {{ $pus_mm->total() }} Judul <br>
                        {{ ceil($pus_mm->total() / $pus_mm->perpage()) }} halaman
                    </div>
                </div>

                <div class="row">
                    @foreach($pus_mm as $key => $pm)
                        <div class="col-md-3 col-6">
                            <div class="card card-blog card-plain">
                                <div class="card-header card-header-image">
                                    <a href="{{route('pm.show', [$pm->id])}}">
                                        <img src="{{asset('storage/pustaka_multimedia/'.$pm->gambar)}}" style="object-fit: cover; object-position: top;" height="275rem"
                                             onerror="this.src='https://ui-avatars.com/api/?size=235&background=c9c9c9&name='+'{{ $pm->judul }}'"/>
                                    </a>
                                    <div class="colored-shadow" style="background-image: url(&quot;../assets/img/examples/card-product2.jpg&quot;); opacity: 1;"></div></div>
                                <div class="card-body">
                                    <h6 class="card-category text-rose">{{ $pm->pengarang }}</h6>
                                    <h4 class="card-title limit">
                                        <a href="{{route('pm.show', [$pm->id])}}" >{{ $pm->judul }}</a>
                                    </h4>
                                    <div class="card-description">
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>

                <div class="row">
                    <div class="col-sm-12">
                        {{$pus_mm->appends(Request::all())->links()}}
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection