<!DOCTYPE html>
<html lang="fr">

<head>
  <meta charset="utf-8">
  <meta content="width=device-width, initial-scale=1.0" name="viewport">

  <link href="https://fonts.gstatic.com" rel="preconnect">
  <link
    href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Nunito:300,300i,400,400i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i"
    rel="stylesheet">

  <!-- Vendor CSS Files -->
  <link href="/assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
  <link href="/assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
  <link href="/assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
  <link href="/assets/vendor/quill/quill.snow.css" rel="stylesheet">
  <link href="/assets/vendor/quill/quill.bubble.css" rel="stylesheet">
  <link href="/assets/vendor/remixicon/remixicon.css" rel="stylesheet">
  <link href="/assets/vendor/simple-datatables/style.css" rel="stylesheet">

  <!-- Template Main CSS File -->
  <link href="/assets/css/style.css" rel="stylesheet">

  <!-- Required meta tags -->
  <meta charset="UTF-8">
  <meta name="description" content="">
  <meta name="keywords" content="HTML,CSS,XML,JavaScript">
  <meta name="author" content="EPAC-GIT3-2021-2022">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="csrf-token" content="{{ csrf_token() }}">
  <title> {{ $matiere->nom }} | Bookcase</title>
  <link rel="shortcut icon" href="/images/favicon.png" type="image/x-icon">
  <!-- Goole Font -->
  <link href="https://fonts.googleapis.com/css?family=Rubik:400,500,700" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css?family=Roboto:400,500,700,900" rel="stylesheet">
  <!-- Bootstrap CSS -->
  <link rel="stylesheet" href="/css/assets/bootstrap.min.css">
  <!-- Font awsome CSS -->
  <link rel="stylesheet" href="/css/assets/font-awesome.min.css">
  <link rel="stylesheet" href="/css/assets/flaticon.css">
  <link rel="stylesheet" href="/css/assets/magnific-popup.css">
  <!-- owl carousel -->
  <link rel="stylesheet" href="/css/assets/owl.carousel.css">
  <link rel="stylesheet" href="/css/assets/owl.theme.css">
  <link rel="stylesheet" href="/css/assets/animate.css">
  <!-- Slick Carousel -->
  <link rel="stylesheet" href="/css/assets/slick.css">

  <!-- Mean Menu-->
  <link rel="stylesheet" href="/css/assets/meanmenu.css">
  <!-- main style-->
  <link rel="stylesheet" href="/css/style.css">
  <link rel="stylesheet" href="/css/responsive.css">
  <link rel="stylesheet" href="/css/demo.css">
  <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
 <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
 <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
 <![endif]-->
  <style>
    .logout {
      width: 15px;
      height: 15px;
    }
  </style>
</head>

<body>
  <header class="header_3">
    <!-- Preloader -->
    <div id="preloader"></div>
    <div class="edu_nav">
      <div class="container">
        <nav class="navbar navbar-expand-md navbar-light bg-faded">
          <a class="navbar-brand" href={{ url('/') }}><img src="/images/logo.png" alt="logo"
              height="45px"></a>
          <div class="collapse navbar-collapse main-menu" id="navbarSupportedContent">
            <ul class="navbar-nav nav lavalamp ml-auto menu">
              <li class="nav-item"><a href={{ url('/') }} class="nav-link">Accueil</a>
              </li>
              <li class="nav-item"><a href={{ url('user/books') }} class="nav-link ">Mes
                  livres</a></li>
              @if (unserialize(session('BOOKCASE_USER'))->filiere_id != 0)
                <li class="nav-item"><a href={{ route('ma_doc') }} class="nav-link active">Ma
                    documentation</a></li>
              @endif
              <li class="nav-item"><a href={{ url('user/upload') }} class="nav-link">Téléverser</a>
              </li>
              <li class="
                                    nav-item"><a href={{ url('/about') }} class="nav-link">À
                  propos</a>
              </li>
              <li class="nav-item"><a href={{ url('/contact') }} class="nav-link">Contact</a>
              </li>
              <li class="nav-item"><a href="#" class="search_btn nav-link"><img class="logout d-none d-lg-block"
                    src="/images/search.png" alt=""><span class="d-lg-none"> Rechercher</span></a>
                <div id="search">
                  <button type="button" class="close">×</button>
                  <form method="POST" action="{{ route('search') }}">
                    @csrf()
                    <input type="hidden" name="hidden" value="0">
                    <input type="search" value="" placeholder="Cherchez ici...." required name="recherche" />
                  </form>
                </div>
              </li>
              <li class="nav-item">
                <a href="{{ route('logout') }}" class="nav-link"><img class="logout d-none d-lg-block"
                    src="/images/logout.png" alt=""><span class="d-lg-none"> Déconnexion</span></a>
              </li>
            </ul>
          </div>
        </nav><!-- END NAVBAR -->
      </div>
    </div>
    <hr>
  </header> <!-- End header -->
  <section class="pt-3">
    <div class="container pt-3" style="min-height: 60vh">
      <div class="row">
        @foreach ($livres as $livre)
          <div class="m-2 col-md-3 text-center">

            <h5><a href="{{ route('read.doc', $livre['id']) }}">{{ $livre->nom }}</a></h5>

          </div>
        @endforeach

      </div>
    </div>
  </section>
  <!-- Footer -->
  <footer class="footer_3">
    <div class="container">
      <div class="footer_top">
        <div class="row">
          <div class="col-12 col-md-6 col-lg-6">
            <div class="footer_single_col footer_intro">
              <img src="/images/logo2.png" alt="" class="f_logo">
              <p>Avec nos livres, tout le savoir est à votre portée...</p>
            </div>
          </div>
          <div class="col-12 col-md-6 col-lg-6">
            <div class="footer_single_col contact">
              <h3>Contactez Nous</h3>
              <p>Besoin de nous contacter ?</p>
              <div class="contact_info">
                <span><a style="text-decoration:none;"href="tel://+22961374500">+229 61 37 45
                    00</a></span>
                <span class="email"><a href="mailto:iitech@iitech-benin.net ">iitech@iitech-benin.net
                  </a></span>
              </div>

            </div>
          </div>
          <div class="col-12 col-md-12 col-lg-12">
            <div class="copyright">
              <a>© <?= now()->format('Y') ?> IITECH - Tous droits réservés.</a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </footer><!-- End Footer -->

  <section id="scroll-top" class="scroll-top">
    <h2 class="disabled">Scroll to top</h2>
    <div class="to-top pos-rtive">
      <a href="#"><i class="flaticon-right-arrow"></i></a>
    </div>
  </section>
  <!-- footer section ends -->

  <!-- JavaScript -->
  <script src="/js/jquery-3.2.1.min.js"></script>
  <script src="/js/popper.min.js"></script>
  <script src="/js/bootstrap.min.js"></script>
  <script src="/js/jquery.magnific-popup.min.js"></script>
  <script src="/js/owl.carousel.min.js"></script>
  <script src="/js/slick.min.js"></script>
  <script src="/js/jquery.meanmenu.min.js"></script>
  <script src="/js/wow.min.js"></script>
  <!-- Counter Script -->
  <script src="/js/waypoints.min.js"></script>
  <script src="/js/jquery.counterup.min.js"></script>
  <script src="/js/custom.js"></script>
</body>

</html>
