138 lines
5.2 KiB
HTML
138 lines
5.2 KiB
HTML
<!DOCTYPE html>
|
|
|
|
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
|
|
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>Kyflo</title>
|
|
<link rel="stylesheet" type="text/css" href="Assets/css.css">
|
|
<link rel="stylesheet" type="text/css" href="Assets/resp.css">
|
|
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
|
|
|
|
|
|
</head>
|
|
|
|
<body>
|
|
<header class="header">
|
|
<a href="#" class="logo">KYFLO</a>
|
|
<input class="menu-btn" type="checkbox" id="menu-btn"/>
|
|
<label class="menu-icon" for="menu-btn"><span class="nav-icon"></span></label>
|
|
<ul class="menu">
|
|
<li><input type="text" placeholder="Rechercher..."></li>
|
|
<li><a href="#nous">A propos</a></li>
|
|
<li><a href="#contact">Contact</a></li>
|
|
<li><a href="Assets/Pages/Autres/checkout.html">Panier</a></li>
|
|
</ul>
|
|
</header>
|
|
|
|
<div class="top">
|
|
<h1>Bienvenue sur le site de KyFlo !</h1>
|
|
<h2>Vendeur de robot depuis 2005</h2>
|
|
</div>
|
|
|
|
<div id="slider">
|
|
<figure>
|
|
<a href="Assets/Pages/Produits/nao.html"><img src="Assets/Images/Promotions/promo1.png" alt></a>
|
|
<a href="Assets/Pages/Produits/pepper.html"><img src="Assets/Images/Promotions/promo2.png" alt></a>
|
|
<a href="Assets/Pages/Produits/r2d2.html"><img src="Assets/Images/Promotions/promo3.png" alt></a>
|
|
<a href="Assets/Pages/Produits/terminator.html"><img src="Assets/Images/Promotions/promo4.png" alt></a>
|
|
<a href="Assets/Pages/Produits/nao.html"><img src="Assets/Images/Promotions/promo1.png" alt></a>
|
|
</figure>
|
|
</div>
|
|
|
|
<div id="produits">
|
|
<div class="title">
|
|
<h1>Tous nos produits :</h1>
|
|
</div>
|
|
|
|
<div class="flex-container">
|
|
<div class="ok"><a href="Assets/Pages/Produits/nao.html"><img src="Assets/Images/Produits/nao.png" alt><p>Nao</p></a></div>
|
|
<div ><div class="rupt">Rutpure de stock</div><a href="#"><img class="out" src="Assets/Images/Produits/valkyrie.png" alt><p>Valkyrie</p></a></div>
|
|
<div class="ok"><a href="Assets/Pages/Produits/r2d2.html"><img src="Assets/Images/Produits/pepper.png" alt><p>Pepper</p></a></div>
|
|
<div><div class="rupt">Rupture de stock</div><a href="#"><img class="out" src="Assets/Images/Produits/soldat.png" alt><p>Soldat</p></a></div>
|
|
<div class="ok"><div class="spec">N°1 des ventes</div><a href="Assets/Pages/Produits/r2d2.html"><img src="Assets/Images/Produits/r2d2.png" alt><p>R2D2</p></a></div>
|
|
<div class="ok"><a href="Assets/Pages/Produits/r2d2.html"><img src="Assets/Images/Produits/terminator.png" alt><p>Terminator</p></a></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="nous">
|
|
<div class="title">
|
|
<h1>Qui sommes nous ?</h1>
|
|
</div>
|
|
|
|
<div class="content">
|
|
<h2>L'équipe :</h2>
|
|
<table id="equipe">
|
|
<tr id="equ">
|
|
<td><img src="Assets/Images/Sprites/benoit.png" alt></td>
|
|
<td><h2>Nos engagements :</h2><h3>Etre soucieux de la qualité de nos produits</h3><h3>Vendre des robots à la pointe de la technologie</h3><h3>Respecter l'environnement</h3></td>
|
|
<td><img src="Assets/Images/Sprites/florian.png" alt></td>
|
|
</tr>
|
|
</table>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div id="contact">
|
|
<div class="title">
|
|
<h1>Nous contacter :</h1>
|
|
</div>
|
|
|
|
<div class="content">
|
|
<form action="commentaire.html">
|
|
<h2>Nom et Prénom :</h2>
|
|
<input type="text" required>
|
|
|
|
<h2>Email :</h2>
|
|
<input type="email" required>
|
|
|
|
<h2>Question :</h2>
|
|
<input type="text" placeholder="Question, suggestion, remarque" required>
|
|
|
|
<h2>Valider:</h2>
|
|
<input type="submit" value="Envoyer">
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="footer">
|
|
<table>
|
|
<tbody>
|
|
<tr>
|
|
<th>Accès rapide</th><th></th>
|
|
</tr>
|
|
<tr>
|
|
<td><a href="#">Accueil</a></td>
|
|
<td><a href="#slider">Nos Promotions</a></td>
|
|
|
|
</tr>
|
|
<tr>
|
|
<td><a href="#produits">Nos Produits</a></td>
|
|
<td><a href="Assets/Pages/Autres/checkout.html">Votre panier</a></td>
|
|
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<h1>Nos réseaux sociaux :</h1>
|
|
<table id="reseaux">
|
|
<tr id="res">
|
|
<td>
|
|
<a href="#"><img src="Assets/Images/Icones/facebook.png" alt></a>
|
|
</td>
|
|
<td>
|
|
<a href="#"><img src="Assets/Images/Icones/twitter.png" alt></a>
|
|
</td>
|
|
<td>
|
|
<a href="#"><img src="Assets/Images/Icones/yt.png" alt></a>
|
|
</td>
|
|
<td>
|
|
<a href="#"><img src="Assets/Images/Icones/insta.png" alt></a>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
|
|
</div>
|
|
</body>
|
|
|
|
</html>
|