198 lines
No EOL
17 KiB
PHP
198 lines
No EOL
17 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="fr">
|
|
<head>
|
|
<link rel="icon" href="./assets/images/favicon.png" type="image/png">
|
|
<link rel="icon" sizes="32x32" href="./assets/images/favicon-32.png" type="image/png">
|
|
<link rel="icon" sizes="64x64" href="./assets/images/favicon-64.png" type="image/png">
|
|
<link rel="icon" sizes="96x96" href="./assets/images/favicon-96.png" type="image/png">
|
|
<link rel="icon" sizes="196x196" href="./assets/images/favicon-196.png" type="image/png">
|
|
<link rel="apple-touch-icon" sizes="152x152" href="./assets/images/apple-touch-icon.png">
|
|
<link rel="apple-touch-icon" sizes="60x60" href="./assets/images/apple-touch-icon-60x60.png">
|
|
<link rel="apple-touch-icon" sizes="76x76" href="./assets/images/apple-touch-icon-76x76.png">
|
|
<link rel="apple-touch-icon" sizes="114x114" href="./assets/images/apple-touch-icon-114x114.png">
|
|
<link rel="apple-touch-icon" sizes="120x120" href="./assets/images/apple-touch-icon-120x120.png">
|
|
<link rel="apple-touch-icon" sizes="144x144" href="./assets/images/apple-touch-icon-144x144.png">
|
|
<meta name="msapplication-TileImage" content="./assets/images/favicon-144.png">
|
|
<meta name="msapplication-TileColor" content="#FFFFFF">
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="stylesheet" href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css">
|
|
<link rel="stylesheet" href="./node_modules/swiper/swiper-bundle.css">
|
|
<link rel="stylesheet" href="./node_modules/swiper/swiper-bundle.min.css">
|
|
<link rel='stylesheet' id='style-css' href='./assets/css/style.css' type='text/css' media='all'/>
|
|
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
|
|
<title>Jeusselin</title>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="container">
|
|
<header class="grid bandeau">
|
|
<div class="toggle-menu flex"><span></span></div>
|
|
<div class="logo flex">
|
|
<a href="./index.php"></a>
|
|
</div>
|
|
<nav>
|
|
<ul class="flex">
|
|
<li><a href="./whoweare.php">Qui sommes nous ?</a></li>
|
|
<li><a href="./work.php">Nos métiers</a></li>
|
|
<li><a href="./rse.php">RSE</a></li>
|
|
<li><a href="./actus.php">Actualités</a></li>
|
|
<li><a href="./contact.php">Nous contacter</a></li>
|
|
</ul>
|
|
</nav>
|
|
<div class="right-menu">
|
|
<div class="connect-contain flex">
|
|
<p class="login">Bienvenue Charles-Henry</p>
|
|
<div class="connect login"><a href="#" class="first-btn"> </a></div>
|
|
<div class="disconnect login">
|
|
<a href="#">
|
|
<!-- <svg version="1.1" id="svg-disconnect" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
|
|
<g>
|
|
<g>
|
|
<path d="M257,0C116.39,0,0,114.39,0,255s116.39,257,257,257s255-116.39,255-257S397.61,0,257,0z M383.22,338.79
|
|
c11.7,11.7,11.7,30.73,0,42.44c-11.61,11.6-30.64,11.79-42.44,0L257,297.42l-85.79,83.82c-11.7,11.7-30.73,11.7-42.44,0
|
|
c-11.7-11.7-11.7-30.73,0-42.44l83.8-83.8l-83.8-83.8c-11.7-11.71-11.7-30.74,0-42.44c11.71-11.7,30.74-11.7,42.44,0L257,212.58
|
|
l83.78-83.82c11.68-11.68,30.71-11.72,42.44,0c11.7,11.7,11.7,30.73,0,42.44l-83.8,83.8L383.22,338.79z"/>
|
|
</g>
|
|
</g>
|
|
</svg> -->
|
|
<img src="./assets/images/stop.png" alt="Déconnexion">
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<form action="" method="post" class="search flex">
|
|
<input type="text" name="txt_search" id="txt_search" placeholder="Rechercher" required>
|
|
<button type="submit" class="second-btn">OK</button>
|
|
</form>
|
|
</div>
|
|
<div class="right-menu-mobile flex">
|
|
<div class="connect-contain flex">
|
|
<a href="#" class="mobile-connect picto-item login" aria-label="Espace client">
|
|
<svg version="1.1" id="svg-connect" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="510px" height="510px" viewBox="0 0 510 510" style="enable-background:new 0 0 510 510;" xml:space="preserve">
|
|
<g>
|
|
<g id="account-circle">
|
|
<path d="M255,0C114.75,0,0,114.75,0,255s114.75,255,255,255s255-114.75,255-255S395.25,0,255,0z M255,76.5
|
|
c43.35,0,76.5,33.15,76.5,76.5s-33.15,76.5-76.5,76.5c-43.35,0-76.5-33.15-76.5-76.5S211.65,76.5,255,76.5z M255,438.6
|
|
c-63.75,0-119.85-33.149-153-81.6c0-51,102-79.05,153-79.05S408,306,408,357C374.85,405.45,318.75,438.6,255,438.6z"/>
|
|
</g>
|
|
</g>
|
|
</svg>
|
|
</a>
|
|
<a href="#" class="mobile-disconnect login">
|
|
<img src="./assets/images/stop.png" alt="Déconnexion">
|
|
</a>
|
|
</div>
|
|
<p class="login">Bienvenue Charles-Henry</p>
|
|
<a href="#" class="mobile-search">
|
|
<svg version="1.1" id="svg-search" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="590.556px" height="590.556px" viewBox="0 0 590.556 590.556" style="enable-background:new 0 0 590.556 590.556;" xml:space="preserve">
|
|
<g>
|
|
<g>
|
|
<path d="M574.099,469.235L437.61,353.434c-3.248-2.709-7.227-4.171-11.266-4.171c-5.643,0-11.018,2.843-14.373,7.606
|
|
c-15.533,22.029-34.578,41.087-56.611,56.635c-4.1,2.895-6.816,7.319-7.449,12.143c-0.635,4.828,0.775,9.602,3.975,13.439
|
|
l115.873,136.61c7.852,9.422,19.252,14.859,31.23,14.859c10.768,0,21.021-4.324,28.877-12.179l48.98-48.981
|
|
c8.346-8.348,12.656-19.241,12.137-30.68C588.46,487.269,583.175,476.8,574.099,469.235z"/>
|
|
<path d="M218.399,433.743c57.923,0,112.385-22.559,153.348-63.522c40.965-40.965,63.523-95.423,63.523-153.349
|
|
C435.271,97.29,337.983,0,218.399,0C98.814,0,1.53,97.29,1.53,216.872S98.817,433.743,218.399,433.743z M71.81,216.872
|
|
c0-80.83,65.759-146.589,146.589-146.589c80.831,0,146.588,65.759,146.588,146.589c0,39.091-15.262,75.885-42.982,103.602
|
|
c-27.721,27.718-64.515,42.984-103.606,42.984C137.569,363.461,71.81,297.701,71.81,216.872z"/>
|
|
</g>
|
|
</g>
|
|
</svg>
|
|
</a>
|
|
</div>
|
|
</header>
|
|
</div>
|
|
|
|
<div class="main-container main actus grid">
|
|
<div class="header-bloc"></div>
|
|
|
|
<div class="container">
|
|
<section class="actus--main flex">
|
|
<h1 class="post-title">Nos actualités</h1>
|
|
<div class="actus--row flex">
|
|
<div class="actus--col flex">
|
|
<div class="actus--first flex">
|
|
<div class="first--img">
|
|
<img src="./assets/images/plats-cuisines.jpg" alt="">
|
|
</div>
|
|
<div class="first--txt grid">
|
|
<h2 class="post-subtitle clamp">De délicieux plats préparés disponibles en Clik&Collect</h2>
|
|
<div class="post--txt">
|
|
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nesciunt temporibus cupiditate et culpa aliquid sapiente odit similique sed animi, voluptatibus sint laboriosam officiis dicta blanditiis, dolorem minus. Corporis dolorem voluptas eos neque eum est repellat consectetur ea! Quod, rem impedit.</p>
|
|
</div>
|
|
<div class="first--btn flex"><a href="#" class="second-btn">Accéder à la boutique</a></div>
|
|
</div>
|
|
</div>
|
|
<div class="actus--chrono grid">
|
|
<h1 class="post-title clamp">Lorem ipsum dolor sit amet consectetur adipisicing elit. Odio unde quae consectetur eius!</h1>
|
|
<div class="chrono--txt clamp">
|
|
<p>In hac habitasse platea dictumst. Quisque suscipit porta nisl. Cras at lorem faucibus, venenatis massa non, egestas libero. Etiam tincidunt 140 caractères maximum !</p>
|
|
</div>
|
|
<div><a href="#" class="second-btn">Lire l'article</a></div>
|
|
</div>
|
|
<!-- todo : à supprimer lorsque la partie boutique sera implémentée -->
|
|
<div class="actus--chrono grid">
|
|
<h1 class="post-title clamp">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Unde accusamus beatae, ea error necessitatibus sequi quas ab fugit nisi ad, molestias aliquam ratione earum aut cupiditate, quaerat cum! Cumque ex suscipit molestias eius magnam beatae autem magni molestiae temporibus. Exercitationem eum iure quasi nam numquam iusto fuga dolor illum nobis, alias impedit enim. Ullam, natus a. Cumque voluptatibus magni at magnam, vero sapiente cum consequatur nisi alias suscipit eum earum. Accusamus autem repellendus sequi officia eaque sapiente, accusantium vitae in!</h1>
|
|
<div class="chrono--txt clamp">
|
|
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Consequuntur iste quae repellat dignissimos voluptas, voluptatum aperiam! Molestiae quae quidem nam cupiditate libero sit, architecto cumque, hic animi explicabo ratione est expedita esse adipisci fuga blanditiis minus corporis asperiores consequatur voluptate atque facilis rerum id illo! Accusamus dolorem architecto odio tempora odit maiores nostrum exercitationem non quam expedita natus minima debitis, voluptas delectus aut eaque velit maxime quis rerum est incidunt animi iusto iste perferendis. Quasi corporis molestiae sint libero harum voluptatem veritatis delectus porro vel eos ad tenetur repellat, velit dolore fugit dolores rerum eum ipsa nam? Omnis error non nulla nostrum quo quos iusto deleniti! Ab error itaque atque eius, corrupti repellendus illum vitae facere earum natus nam eum, minus repudiandae fugit. Voluptatibus ipsa officia sed atque, veniam fuga vero iure tempora dicta provident libero, et qui fugiat, dolores est optio. Delectus culpa veniam quidem saepe dolorum doloremque est a itaque aut excepturi earum veritatis blanditiis quas nihil ea, eveniet ducimus id quam, sit adipisci tenetur? Possimus quo dolorum a vitae tempora mollitia consequuntur assumenda cupiditate autem excepturi distinctio magnam animi accusamus hic delectus alias pariatur, asperiores omnis velit quam, nobis necessitatibus itaque est! Earum asperiores dicta error excepturi maxime, assumenda fugiat ratione atque labore saepe minima hic ipsum! Ullam odit quaerat molestias totam nostrum non ea! Tempore commodi asperiores fugit molestias deserunt est magnam quod quia illum, reprehenderit sit excepturi at! Laudantium eius reiciendis aliquid non nihil molestias adipisci magnam autem in at iusto ea iste asperiores esse neque, eos ipsa ratione animi, quo repudiandae? Adipisci, nulla. Deleniti sed eum labore odit, quod libero earum ad corrupti eaque eveniet dolor inventore ea voluptatum accusamus vel. Rerum tenetur aperiam, in tempore ratione sed. Ipsa architecto sint, optio, dolor a facere tempora corporis aperiam fuga tempore ipsam, expedita obcaecati quas? Ratione minima dolores praesentium sint! Enim vero odit delectus ipsum architecto beatae quas assumenda corporis numquam recusandae voluptatum omnis ducimus dolore nobis sint, quos tenetur ut neque voluptates odio eos magnam nam? Consectetur facilis voluptate molestias aliquid ea deserunt autem vero expedita nemo iusto, praesentium architecto veniam delectus. Culpa, minus labore quas exercitationem natus, amet quis voluptatum odio ipsum ipsam enim. Dolorem, eum ut. Tenetur natus labore magnam provident nihil ut pariatur, odit perferendis quo, sapiente optio saepe aliquid maxime. Nulla aperiam eveniet consequatur possimus quaerat sunt, nihil velit sed eaque nesciunt impedit natus recusandae illo officia expedita in doloribus facilis doloremque aspernatur corporis voluptatibus. Recusandae qui voluptatibus eius, quasi modi deserunt consequatur assumenda excepturi mollitia tempore labore, repellat ad sint aut. Perferendis omnis labore nobis repellat eveniet excepturi accusantium officiis reiciendis molestias repellendus quo, maiores quae odit veniam iusto dolor magni assumenda totam! Officia dicta libero quam, fugiat praesentium illum neque aut provident? Voluptatum eius facere facilis alias, vero sapiente quos accusamus maxime ipsa. Tenetur, praesentium? Perferendis corporis possimus ipsam libero ducimus amet laboriosam, assumenda culpa sapiente ipsa repudiandae enim, praesentium ut fuga optio. Iusto molestias rem corporis maxime asperiores sapiente eveniet, consequuntur, laboriosam ex delectus impedit quod modi!</p>
|
|
</div>
|
|
<div><a href="#" class="second-btn">Lire l'article</a></div>
|
|
</div>
|
|
<!-- fin todo -->
|
|
</div>
|
|
<div class="actus--col flex">
|
|
<div class="actus--chrono grid">
|
|
<h1 class="post-title clamp">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Recusandae reprehenderit debitis perferendis.</h1>
|
|
<div class="chrono--txt clamp">
|
|
<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Earum, rerum expedita. Quae repellat error totam accusamus et officiis consequuntur nemo non quidem. Adipisci, nam voluptas sapiente eaque labore architecto illum hic commodi quasi veniam beatae fuga, quis a! Porro, illum expedita eligendi aspernatur saepe commodi eum fugiat reiciendis provident. Quae molestiae eaque ut recusandae adipisci esse magnam fugit at, fuga in iure asperiores dolorum sapiente, aliquam minus tempore fugiat repudiandae autem facilis, est pariatur cupiditate. Corporis dolor error placeat mollitia! Error, enim. Ipsam esse obcaecati pariatur hic exercitationem consectetur soluta officiis perferendis unde numquam facere doloremque laudantium vitae, ea atque illo beatae distinctio dolores accusamus ut modi, accusantium vero eos officia. Neque, rem ullam autem deserunt harum quod veniam fuga. Distinctio, tempore. Laboriosam alias ducimus vel facilis ratione officia autem fuga, error quis corporis molestias ex voluptas! Accusantium, dolores iste?</p>
|
|
</div>
|
|
<div><a href="#" class="second-btn">Lire l'article</a></div>
|
|
</div>
|
|
<div class="actus--chrono grid">
|
|
<h1 class="post-title clamp">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Possimus necessitatibus culpa expedita neque harum.</h1>
|
|
<div class="chrono--txt clamp">
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Neque hic sed doloremque omnis culpa? Illo magni iste, sunt dolor minus quisquam blanditiis optio non, quasi inventore nesciunt culpa provident a!</p>
|
|
</div>
|
|
<div><a href="#" class="second-btn">Lire l'article</a></div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</section>
|
|
|
|
<section class="actus--footer flex">
|
|
<div class="prev">
|
|
<a href="#"><</span></a>
|
|
</div>
|
|
<div class="pagination flex">
|
|
<a href="#">1</a>
|
|
<a href="#">2</a>
|
|
<a href="#">3</a>
|
|
</div>
|
|
<div class="next">
|
|
<a href="#">></a>
|
|
</div>
|
|
</section>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="main-container">
|
|
<footer>
|
|
<div class="logo-footer">
|
|
<a href="#"><img src="./assets/images/logo-jeusselin.png" alt="Jeusselin"></a>
|
|
</div>
|
|
<div class="txt-footer flex">
|
|
<a href="#">Contact</a>
|
|
<a href="#">Mentions légales</a>
|
|
<a href="#">Politique de confidentialité</a>
|
|
</div>
|
|
</footer>
|
|
<div class="pageup"><a href="#"><i class="fas fa-arrow-circle-up"></i></a></div>
|
|
</div>
|
|
</body>
|
|
<script src="./node_modules/swiper/swiper-bundle.min.js"></script>
|
|
<script type="text/javascript" src="./assets/js/main.js"></script>
|
|
</html> |