@extends('includes.layouts')

@section('content')
    <div class="iq-breadcrumb-one iq-bg-over iq-over-dark-50" style="background-image: url({{ asset('images/banner/change-reading-theme-in-books-app-iPhone-iOS-16.jpg') }});">
        <div class="container-fluid">
            <div class="row align-items-center">
                <div class="col-sm-12">
                    <nav aria-label="breadcrumb" class="text-center iq-breadcrumb-two">
                        <h2 class="title">Voir Tout</h2>
                        <ol class="breadcrumb main-bg">
                            <li class="breadcrumb-item"><a href="{{ route('home') }}">Accueil</a></li>
                            <li class="breadcrumb-item active">E-books</li>
                        </ol>
                    </nav>
                </div>
            </div>
        </div>
    </div>
    <main id="main" class="site-main watchlist-contens">
        <div class="container-fluid">
            @if($ebooks->count())
                <ul class=" row list-inline  mb-0 iq-rtl-direction ">
                    @foreach($ebooks as $ebook)
                        <li class="slide-item col-lg-3 col-md-4 col-6 mb-4">
                            <div class="block-images position-relative  watchlist-first">
                                <div class="img-box">
                                    <img src="@if($ebook->image) {{ $ebook->image }} @else {{ asset('images/default_ebook.jpg') }} @endif" class="img-fluid" alt="" loading="lazy">
                                </div>
                                <div class="block-description">
                                    <h6 class="iq-title text-left"><a href="#">{{ $ebook->title }}</a></h6>
                                    <!--<div class="movie-time d-flex align-items-center my-2">
                                        <span class="text-white"></span>
                                    </div>-->
                                    <div class="hover-buttons text-left">
                                        <a href="{{ route('ebook', ['ebook' => $ebook->id]) }}" role="button" class="btn btn-hover">
                                            <i class="fa fa-play mr-1" aria-hidden="true"></i>Lire
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </li>
                    @endforeach
                </ul>
            @else
                <p>Pas de e-book</p>
            @endif
            {!! $ebooks->links() !!}
        </div>
    </main>
@endsection