<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Alica - Offres</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"> <style> .offre-container { margin-bottom: 5%; } .offre-img { max-width: 100%; } #titrePrincipal { padding-bottom: 10px; border-bottom: 1px solid black; margin-bottom: 30px; } .custom-button { background-color: #00DBFF; border-color: #00DBFF; color: #fff; } </style> </head> <body> <header> {% include "menu.html" %} </header> <div class="container mt-4"> <h1 id="titrePrincipal">Offres d'emploi</h1> {% for offre in offers %} <div class="offre-container"> <div class="row"> <!-- Première ligne --> <div class="col-12 col-md-3"> <img src="data:image/png;base64,{{ offre.getImg().getBlob() | base64 }}" class="offre-img"> </div> <div class="col-12 col-md-9"> <h3>{{ offre.getNom() }}</h3> <p>Julien Martin</p><!-- A changer --> </div> </div> <div class="row"> <div class="col-12"> <p class="text-left">{{ offre.getDescription() }}</p> </div> </div> <!-- Quatrième ligne (Localisation) --> <div class="row"> <div class="col-1"> <img src="assets/location.png" class="img-fluid" title="ville"> </div> <div class="col-11"> <p>{{ offre.getVille() }}</p> </div> </div> <div class="row"> <div class="col-12"> <button type="button" class="btn btn-outline-primary btn-sm mb-2 custom-button" onclick="window.location.href = 'index.php?action=displayOffer&id={{offre.getId()}}';">En savoir plus ></button> </div> </div> </div> {% endfor %} {% if pages is defined %} {% for page in pages %} <a href="index.php?action=displayOffers&page={{page}}">{{page}}</a> {% endfor %} {% endif %} </div> <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script> </body> </html>