IUT_Informatique/KyFlo
Archived
1
0
Fork 0
Code Activity

Design final 1.0

Browse source
This commit is contained in:
Kybo 2019-11-23 15:49:48 +01:00
parent 09d3b08dd2
commit 425aa11189
18 changed files with 477 additions and 70 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
Images/Icones/facebook.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 7.5 KiB

BIN
Images/Icones/insta.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 218 KiB

BIN
Images/Icones/twitter.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 10 KiB

BIN
Images/Icones/yt.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 14 KiB

4
Images/Produits/arrow.svg Normal file
View file

@ -0,0 +1,4 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="700" height="700">
<path d="M350,0 700,700 350,550 0,700" fill="#0C0"/>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 164 B

BIN
Images/arrow.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 22 KiB

BIN
Images/benoit.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 207 KiB

BIN
Images/florian.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 6.5 KiB

104
checkout.html
View file

@ -4,6 +4,7 @@
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>Kyflo</title> <title>Kyflo</title>
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css.css"> <link rel="stylesheet" type="text/css" href="css.css">
</head> </head>
<body id="produit"> <body id="produit">
@ -12,56 +13,79 @@
<nav id="nav"> <nav id="nav">
<div class="topnav"> <div class="topnav">
<a id ="kyflo" class="active" href="index.html">KyFlo</a> <a id ="kyflo" class="active" href="index.html">KyFlo</a>
<a id ="nous" href="#nous">A propos</a> <a id ="nous" href="nous.html">A propos</a>
<a id ="contactN" href="contact.html">Contact</a> <a id ="contactN" href="contact.html">Contact</a>
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a> <a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
<input type="text" placeholder="Rechercher..."> <input type="text" placeholder="Rechercher...">
</div> </div>
</nav> </nav>
<button id="hautPage" onclick="window.location.href='#nav'"><img src="Images/arrow.png" alt></button>
<div id="content">
<table id="basket">
<tr>
<th>Nom Produit</th><th>Quantité</th><th>Prix</th>
</tr>
<tr>
<td>R2D2</td><td><input type="number" value="2"></td><td>500 €</td>
</tr>
<tr>
<td>Nao</td><td><input type="number" value="1"></td><td>5 000€</td>
</tr>
<tr>
<td id="total" COLSPAN=3>TOTAL : 6 000€</td>
</tr>
</table>
<table> <div id="livraison">
<tr> <h1>Coordonnées de livraison :</h1>
<th>Nom Produit</th><th>Quantité</th><th>Prix</th> <form action="commande.html">
</tr> <h1>Nom et prénom :</h1>
<tr> <input type="text" required>
<td>R2D2</td><td><input type="number" value="2"></td><td>500 €</td>
</tr> <h1>Adresse ligne 1 :</h1>
<tr> <input type="text" placeholder="Rue, voie, boite postale, nom de société" required>
<td>Nao</td><td><input type="number" value="1"></td><td>5 000€</td>
</tr> <h1>Adresse ligne 2 :</h1>
<tr> <input type="text" placeholder="Batiment, Etage, Lieu-Dit">
<td id="total" COLSPAN=3>TOTAL : 6 000€</td>
</tr>
</table>
<div id="livraison"> <h1>Ville :</h1>
<h1>Coordonnées de livraison :</h1> <input type="text" required>
<form action="commande.html">
<h1>Nom et prénom :</h1>
<input type="text" required>
<h1>Adresse ligne 1 :</h1>
<input type="text" placeholder="Rue, voie, boite postale, nom de société" required>
<h1>Adresse ligne 2 :</h1>
<input type="text" placeholder="Batiment, Etage, Lieu-Dit">
<h1>Ville :</h1> <h1>État / Région / Canton :</h1>
<input type="text" required> <input type="text" required>
<h1>État / Région / Canton :</h1> <h1>Code postal :</h1>
<input type="text" required> <input type="text" required>
<h1>Code postal :</h1> <h1>Numéro de téléphone :</h1>
<input type="text" required> <input type="tel" required>
<h1 id="valider">Valider:</h1>
<input type="submit" value="Payer">
</form>
</div>
</div>
<footer>
<div id="acces">
<table>
<tbody>
<tr>
<th>Accès rapide</th><th id="line"></th><th>Une question ?</th>
</tr>
<tr>
<td><a href="index.html">Accueil</a></td>
<td><a href="index.html#slider">Nos Promotions</a></td>
<td></td>
</tr>
<tr>
<td><a href="index.html#produits">Nos Produits</a></td>
<td><a href="checkout.html">Votre panier</a></td>
<td id="contact"><button onclick="window.location.href='contact.html'" id="contactB">Nous contacter</button></td>
</tr>
</tbody>
</table>
</div>
</footer>
<h1>Numéro de téléphone :</h1>
<input type="tel" required>
<h1>Valider:</h1>
<input type="submit" value="Payer">
</form>
</div>
</body> </body>
</html> </html>

27
commande.html
View file

@ -5,13 +5,14 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>Kyflo</title> <title>Kyflo</title>
<link rel="stylesheet" type="text/css" href="css.css"> <link rel="stylesheet" type="text/css" href="css.css">
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<nav id="nav"> <nav id="nav">
<div class="topnav"> <div class="topnav">
<a id ="kyflo" class="active" href="index.html">KyFlo</a> <a id ="kyflo" class="active" href="index.html">KyFlo</a>
<a id ="nous" href="#nous">A propos</a> <a id ="nous" href="nous.html">A propos</a>
<a id ="contactN" href="contact.html">Contact</a> <a id ="contactN" href="contact.html">Contact</a>
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a> <a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
<input type="text" placeholder="Rechercher..."> <input type="text" placeholder="Rechercher...">
@ -22,6 +23,28 @@
<img src="Images/Produits/pouce.png" alt> <img src="Images/Produits/pouce.png" alt>
<h2><a href="index.html">Retourner a l'accueil</a></h2> <h2><a href="index.html">Retourner a l'accueil</a></h2>
</div> </div>
<footer>
<div id="acces">
<table>
<tbody>
<tr>
<th>Accès rapide</th><th id="line"></th><th>Une question ?</th>
</tr>
<tr>
<td><a href="index.html">Accueil</a></td>
<td><a href="index.html#slider">Nos Promotions</a></td>
<td></td>
</tr>
<tr>
<td><a href="index.html#produits">Nos Produits</a></td>
<td><a href="checkout.html">Votre panier</a></td>
<td id="contact"><button onclick="window.location.href='contact.html'" id="contactB">Nous contacter</button></td>
</tr>
</tbody>
</table>
</div>
</footer>
</body> </body>
</html> </html>

28
commentaire.html
View file

@ -5,23 +5,47 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>Kyflo</title> <title>Kyflo</title>
<link rel="stylesheet" type="text/css" href="css.css"> <link rel="stylesheet" type="text/css" href="css.css">
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<nav id="nav"> <nav id="nav">
<div class="topnav"> <div class="topnav">
<a id ="kyflo" class="active" href="#home">KyFlo</a> <a id ="kyflo" class="active" href="#home">KyFlo</a>
<a id ="nous" href="#nous">A propos</a> <a id ="nous" href="nous.html">A propos</a>
<a id ="contactN" href="contact.html">Contact</a> <a id ="contactN" href="contact.html">Contact</a>
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a> <a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
<input type="text" placeholder="Rechercher..."> <input type="text" placeholder="Rechercher...">
</div> </div>
</nav> </nav>
<div id="Merci"> <div id="Merci">
<h1>Merci beaucoup pour votre réponse ! Votre commentaire a été pris en compte !</h1> <h1>Merci beaucoup pour votre réponse ! Votre commentaire a été pris en compte !</h1>
<img src="Images/Produits/pouce.png" alt> <img src="Images/Produits/pouce.png" alt>
<h2><a href="index.html">Retourner a l'accueil</a></h2> <h2><a href="index.html">Retourner a l'accueil</a></h2>
</div> </div>
<footer>
<div id="acces">
<table>
<tbody>
<tr>
<th>Accès rapide</th><th id="line"></th><th>Une question ?</th>
</tr>
<tr>
<td><a href="index.html">Accueil</a></td>
<td><a href="index.html#slider">Nos Promotions</a></td>
<td></td>
</tr>
<tr>
<td><a href="index.html#produits">Nos Produits</a></td>
<td><a href="checkout.html">Votre panier</a></td>
<td id="contact"><button onclick="window.location.href='contact.html'" id="contactB">Nous contacter</button></td>
</tr>
</tbody>
</table>
</div>
</footer>
</body> </body>
</html> </html>

62
contact.html
View file

@ -5,8 +5,70 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>Kyflo</title> <title>Kyflo</title>
<link rel="stylesheet" type="text/css" href="css.css"> <link rel="stylesheet" type="text/css" href="css.css">
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
</head> </head>
<body> <body>
<nav id="nav">
<div class="topnav">
<a id ="kyflo" class="active" href="index.html">KyFlo</a>
<a id ="nous" href="nous.html">A propos</a>
<a id ="contactN" href="contact.html">Contact</a>
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
<input type="text" placeholder="Rechercher...">
</div>
</nav>
<button id="hautPage" onclick="window.location.href='#nav'"><img src="Images/arrow.png" alt></button>
<div id="content">
<h1>Nous contacter :</h1>
<form action="commentaire.html">
<h2>Nom et Prénom :</h2>
<input type="text" required>
<h2>Email :</h2>
<input type="text" required>
<h2>Question :</h2>
<input type="text" placeholder="Question, suggestion, remarque" required>
<h2 id="valider">Valider:</h2>
<input type="submit" value="Envoyer">
</form>
<h1>Nos réseaux sociaux :</h1>
<table id="reseaux">
<tr id="res">
<td><a href="#"><img src="Images/Icones/facebook.png" alt></a></td>
<td><a href="#"><img src="Images/Icones/twitter.png" alt></a></td>
<td><a href="#"><img src="Images/Icones/yt.png" alt></a></td>
<td><a href="#"><img src="Images/Icones/insta.png" alt></a></td>
</tr>
</table>
</div>
<footer>
<div id="acces">
<table>
<tbody>
<tr>
<th>Accès rapide</th><th id="line"></th><th>Une question ?</th>
</tr>
<tr>
<td><a href="index.html">Accueil</a></td>
<td><a href="index.html#slider">Nos Promotions</a></td>
<td></td>
</tr>
<tr>
<td><a href="index.html#produits">Nos Produits</a></td>
<td><a href="checkout.html">Votre panier</a></td>
<td id="contact"><button onclick="window.location.href='contact.html'" id="contactB">Nous contacter</button></td>
</tr>
</tbody>
</table>
</div>
</footer>
</body> </body>
</html> </html>

145
css.css
View file

@ -4,6 +4,8 @@
body{ body{
background : linear-gradient(to left,#141414, #444444, #141414); background : linear-gradient(to left,#141414, #444444, #141414);
margin: 0; margin: 0;
font-family: 'Roboto', sans-serif;
} }
#content{ #content{
@ -27,6 +29,23 @@ body>#bienvenue>h2{
color : lightgrey; color : lightgrey;
text-align: center; text-align: center;
} }
button#hautPage{
position: fixed;
z-index: 1;
left: 95%;
top: 90%;
padding: 1vw 1vw;
background-color: rgba(0, 0, 0, 0.5);
border: 0.1vw solid rgb(204,25,25);
color: white;
}
button#hautPage>img{
width:2vw;
}
/*=====================================*/ /*=====================================*/
/*NAVBAR*/ /*NAVBAR*/
@ -126,8 +145,12 @@ a#nous{
/*======================================*/ /*======================================*/
/*FOOTER*/ /*FOOTER*/
footer{
margin-top: 8vw;
}
footer>div>table{ footer>div>table{
width: 100%; width: 100%;
border-top : 0.1vw solid rgb(204,25,25); border-top : 0.1vw solid rgb(204,25,25);
@ -212,20 +235,23 @@ td#contact{
} }
#Merci>h2>a:hover{ #Merci>h2>a:hover{
color : yellow; color : rgb(204, 25, 25);
} }
#Merci>img{ #Merci>img{
margin-left: 45%; display: block;
margin-left: auto;
margin-right: auto;
width : 10%; width : 10%;
margin-top: 5%; margin-top: 5%;
float : none;
} }
/*==========================================*/ /*==========================================*/
/*==========================================*/ /*==========================================*/
/* CSS Produits */ /* CSS DESCRIPTION PRODUIT */
/*EN TETE PRODUIT*/ /*EN TETE PRODUIT*/
#Produit{ #Produit{
margin-top: 5%; margin-top: 5%;
@ -281,12 +307,25 @@ td#contact{
transition-duration: 0.5s; transition-duration: 0.5s;
border-radius: 2vw; border-radius: 2vw;
} }
/*=====================*/
/* MOSAIQUE PRODUITS*/
#produits{
border: 0.1vw solid red;
background-color: rgba(0,0,0,0.5);
margin-top: 8vw;
}
table#mosaique{ table#mosaique{
width: 100%; width: 100%;
margin: auto; margin: auto;
} }
table#mosaique>tr{
border :0.1vw solid rgb(204, 25, 25);
height: 20%;
}
table#mosaique>tr>td>img{ table#mosaique>tr>td>img{
width: 20%; width: 20%;
} }
@ -302,13 +341,13 @@ h3,h4{
h3:hover{ h3:hover{
color: rgb(204, 25, 25); color: rgb(204, 25, 25);
transition-duration: 0.5s; transition-duration: 0.2s;
} }
/*================================================*/ /*================================================*/
/*CARACTERISTIQUES PRODUIT*/ /*CARACTERISTIQUES PRODUIT*/
#Carac{ #Carac{
width : 100%; width : 100%;
border-top : 0.2vw solid white; border-top : 0.2vw solid rgb(204,25,25);
margin-top: 8%; margin-top: 8%;
} }
@ -354,14 +393,14 @@ h3:hover{
} }
#Client>div{ #Client>div{
margin-bottom: 3%; margin-bottom: 3%;
border-bottom: 0.1vw solid darkgrey; border-bottom: 0.1vw solid rgb(134, 134, 134);
} }
/*================================================*/ /*================================================*/
/*ESPACE LAISSER COMMENTAIRE*/ /*ESPACE LAISSER COMMENTAIRE*/
#Coms{ #Coms{
width : 100%; width : 100%;
border-top : 0.2vw solid white; border-top : 0.2vw solid rgb(204,25,25);
margin-top: 5%; margin-top: 5%;
} }
@ -373,7 +412,7 @@ h3:hover{
#Coms>h2{ #Coms>h2{
font-size: 3vw; font-size: 3vw;
color: white; color: white;
border-top: 0.2vw dashed white; border-top: 0.2vw dashed rgb(204, 25, 25);
text-align: center; text-align: center;
} }
@ -408,7 +447,7 @@ input:valid{
} }
input[placeholder=Commentaire], select { input[placeholder=Commentaire], select, input[placeholder="Question, suggestion, remarque"], select {
width: 60%; width: 60%;
padding: 1vw 1vw; padding: 1vw 1vw;
font-size: 1.5vw; font-size: 1.5vw;
@ -419,17 +458,25 @@ input[type=submit], select {
padding: 1vw 1vw; padding: 1vw 1vw;
font-size: 1.5vw; font-size: 1.5vw;
background-color: rgba(0, 0, 0, 0.5); background-color: rgba(0, 0, 0, 0.5);
border : 0.15vw solid white; border : 0.15vw solid rgb(204,25,25);
color : white; color : white;
display: block;
margin-left: auto;
margin-right: auto;
} }
input[type=submit]:hover { input[type=submit]:hover {
color: black; color: rgb(255, 255, 255);
background-color: rgba(255, 255, 255, 0.856); background-color: rgba(204, 25, 25, 0.5);
transition-duration: 0.5s; transition-duration: 0.5s;
border : 0.15vw solid rgb(0, 0, 0);
border-radius: 2vw; border-radius: 2vw;
} }
h1#valider{
text-align: center;
}
table>tr>td>input{ table>tr>td>input{
border: 0vw solid white; border: 0vw solid white;
background-color: rgba(255, 255, 255, 0); background-color: rgba(255, 255, 255, 0);
@ -507,4 +554,76 @@ form[action="commande.html"]>input[type=text], select {
background-color: rgba(0, 0, 0, 0.2); background-color: rgba(0, 0, 0, 0.2);
} }
input[type=number], select{
border : 0.1vw solid white;
}
table#basket{
margin-top: 5vw;
background-color: rgba(0, 0, 0, 0.5)
}
td#total{
text-align: right;
color: rgb(204,25,25);
font-size: 2vw;
font-weight: bold;
padding: 0vw 2vw;
}
/*=================================*/ /*=================================*/
/*CONTACT*/
#content>h1{
text-align: center;
font-size: 3vw;
}
#content>form>h2{
font-size: 1.5vw;
color: lightgrey;
}
table#reseaux{
width: 70%;
margin : auto;
}
tr#res>td{
text-align: center;
}
tr#res>td>a>img{
float: none;
}
/*===========================*/
/*QUI SOMMES NOUS*/
#content>h1{
margin-top: 3vw;
}
#content>h2{
font-size: 2vw;
color: white;
text-align: left;
margin-top: 5vw;
}
#content>ul>li>h3{
font-size: 1.5vw;
color: lightgrey;
}
table#equipe{
width: 100%;
}
tr#equ>td{
text-align: center;
}
tr#equ>td>img{
float: none;
border: 0.2vw solid rgb(204, 25, 25);
}

18
index.html
View file

@ -5,6 +5,8 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>Kyflo</title> <title>Kyflo</title>
<link rel="stylesheet" type="text/css" href="css.css"> <link rel="stylesheet" type="text/css" href="css.css">
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
</head> </head>
<body> <body>
@ -12,7 +14,7 @@
<nav id="nav"> <nav id="nav">
<div class="topnav"> <div class="topnav">
<a id ="kyflo" class="active" href="index.html">KyFlo</a> <a id ="kyflo" class="active" href="index.html">KyFlo</a>
<a id ="nous" href="#nous">A propos</a> <a id ="nous" href="nous.html">A propos</a>
<a id ="contactN" href="contact.html">Contact</a> <a id ="contactN" href="contact.html">Contact</a>
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a> <a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
<input type="text" placeholder="Rechercher..."> <input type="text" placeholder="Rechercher...">
@ -33,6 +35,7 @@
<a href="nao.html"><img src="Images/Promotions/promo1.png" alt></a> <a href="nao.html"><img src="Images/Promotions/promo1.png" alt></a>
</figure> </figure>
</div> </div>
<button id="hautPage" onclick="window.location.href='#nav'"><img src="Images/arrow.png" alt></button>
<div id="content"> <div id="content">
<div id="produits"> <div id="produits">
<h1>Tout nos produits :</h1> <h1>Tout nos produits :</h1>
@ -47,12 +50,15 @@
</tr> </tr>
<tr> <tr>
<td><a href="#"><img src="Images/Produits/jaune.png" alt><h3>Robot fun</h3><h4>50€</h4></a></td> <td><a href="#"><img src="Images/Produits/jaune.png" alt><h3>Robot fun</h3><h4>50€</h4></a></td>
<td><a href="#"><img src="Images/Produits/valkyrie.png" alt><h3>Robot valkyrie</h3><h4>00€</h4></a></td> <td><a href="#"><img src="Images/Produits/valkyrie.png" alt><h3>Robot valkyrie</h3><h4>300€</h4></a></td>
</tr>
<tr>
<td><a href="#"><img src="Images/Produits/pepper.png" alt><h3>Robot Pepper</h3><h4>15 000€</h4></a></td>
<td><a href="#"><img src="Images/Produits/terminator.png" alt><h3>Robot Terminator</h3><h4>50 000€</h4></a></td>
</tr> </tr>
</table> </table>
</div> </div>
</div> </div>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<footer> <footer>
<div id="acces"> <div id="acces">
<table> <table>
@ -62,13 +68,13 @@
</tr> </tr>
<tr> <tr>
<td><a href="index.html">Accueil</a></td> <td><a href="index.html">Accueil</a></td>
<td><a href="#slider">Nos Promotions</a></td> <td><a href="index.html#slider">Nos Promotions</a></td>
<td></td> <td></td>
</tr> </tr>
<tr> <tr>
<td><a href="#produits">Nos Produits</a></td> <td><a href="index.html#produits">Nos Produits</a></td>
<td><a href="checkout.html">Votre panier</a></td> <td><a href="checkout.html">Votre panier</a></td>
<td id="contact"><button id="contactB">Nous contacter</button></td> <td id="contact"><button onclick="window.location.href='contact.html'" id="contactB">Nous contacter</button></td>
</tr> </tr>
</tbody> </tbody>
</table> </table>

30
nao.html
View file

@ -5,7 +5,8 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>Kyflo</title> <title>Kyflo</title>
<link rel="stylesheet" type="text/css" href="css.css"> <link rel="stylesheet" type="text/css" href="css.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
</head> </head>
<body> <body>
@ -14,12 +15,13 @@
<nav id="nav"> <nav id="nav">
<div class="topnav"> <div class="topnav">
<a id ="kyflo" class="active" href="index.html">KyFlo</a> <a id ="kyflo" class="active" href="index.html">KyFlo</a>
<a id ="nous" href="#nous">A propos</a> <a id ="nous" href="nous.html">A propos</a>
<a id ="contactN" href="contact.html">Contact</a> <a id ="contactN" href="contact.html">Contact</a>
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a> <a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
<input type="text" placeholder="Rechercher..."> <input type="text" placeholder="Rechercher...">
</div> </div>
</nav> </nav>
<button id="hautPage" onclick="window.location.href='#nav'"><img src="Images/arrow.png" alt></button>
<div id="content"> <div id="content">
<div id="Produit"> <div id="Produit">
<img src="Images/Produits/nao.png" alt> <img src="Images/Produits/nao.png" alt>
@ -60,10 +62,32 @@
<h1>Commentaire:</h1> <h1>Commentaire:</h1>
<input type="text" placeholder="Commentaire" required> <input type="text" placeholder="Commentaire" required>
<h1>Valider:</h1> <h1 id="valider">Valider:</h1>
<input type="submit" value="Envoyer"> <input type="submit" value="Envoyer">
</form> </form>
</div> </div>
</div> </div>
<footer>
<div id="acces">
<table>
<tbody>
<tr>
<th>Accès rapide</th><th id="line"></th><th>Une question ?</th>
</tr>
<tr>
<td><a href="index.html">Accueil</a></td>
<td><a href="index.html#slider">Nos Promotions</a></td>
<td></td>
</tr>
<tr>
<td><a href="index.html#produits">Nos Produits</a></td>
<td><a href="checkout.html">Votre panier</a></td>
<td id="contact"><button onclick="window.location.href='contact.html'" id="contactB">Nous contacter</button></td>
</tr>
</tbody>
</table>
</div>
</footer>
</body> </body>
</html> </html>

73
nous.html Normal file
View file

@ -0,0 +1,73 @@
<!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="css.css">
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
</head>
<body>
<nav id="nav">
<div class="topnav">
<a id ="kyflo" class="active" href="index.html">KyFlo</a>
<a id ="nous" href="nous.html">A propos</a>
<a id ="contactN" href="contact.html">Contact</a>
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
<input type="text" placeholder="Rechercher...">
</div>
</nav>
<button id="hautPage" onclick="window.location.href='#nav'"><img src="Images/arrow.png" alt></button>
<div id="content">
<h1>Qui sommes-nous ?</h1>
<h2>L'équipe :</h2>
<table id="equipe">
<tr id="equ">
<td><img src="Images/benoit.png" alt></td><td><img src="Images/florian.png" alt></td>
</tr>
</table>
<h2>Nos engagements :</h2>
<ul>
<li><h3>Etre soucieux de la qualité de nos produits</h3></li>
<li><h3>Vendre des robots à la pointe de la technologie</h3></li>
<li><h3>Respecter l'environnement</h3></li>
</ul>
<h1>Nos réseaux sociaux :</h1>
<table id="reseaux">
<tr id="res">
<td><a href="#"><img src="Images/Icones/facebook.png" alt></a></td>
<td><a href="#"><img src="Images/Icones/twitter.png" alt></a></td>
<td><a href="#"><img src="Images/Icones/yt.png" alt></a></td>
<td><a href="#"><img src="Images/Icones/insta.png" alt></a></td>
</tr>
</table>
</div>
<footer>
<div id="acces">
<table>
<tbody>
<tr>
<th>Accès rapide</th><th id="line"></th><th>Une question ?</th>
</tr>
<tr>
<td><a href="index.html">Accueil</a></td>
<td><a href="index.html#slider">Nos Promotions</a></td>
<td></td>
</tr>
<tr>
<td><a href="index.html#produits">Nos Produits</a></td>
<td><a href="checkout.html">Votre panier</a></td>
<td id="contact"><button onclick="window.location.href='contact.html'" id="contactB">Nous contacter</button></td>
</tr>
</tbody>
</table>
</div>
</footer>
</body>
</html>

28
pepper.html
View file

@ -5,6 +5,7 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>Kyflo</title> <title>Kyflo</title>
<link rel="stylesheet" type="text/css" href="css.css"> <link rel="stylesheet" type="text/css" href="css.css">
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
</head> </head>
<body id="produit"> <body id="produit">
@ -13,12 +14,13 @@
<nav id="nav"> <nav id="nav">
<div class="topnav"> <div class="topnav">
<a id ="kyflo" class="active" href="index.html">KyFlo</a> <a id ="kyflo" class="active" href="index.html">KyFlo</a>
<a id ="nous" href="#nous">A propos</a> <a id ="nous" href="nous.html">A propos</a>
<a id ="contactN" href="contact.html">Contact</a> <a id ="contactN" href="contact.html">Contact</a>
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a> <a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
<input type="text" placeholder="Rechercher..."> <input type="text" placeholder="Rechercher...">
</div> </div>
</nav> </nav>
<button id="hautPage" onclick="window.location.href='#nav'"><img src="Images/arrow.png" alt></button>
<div id="content"> <div id="content">
<div id="Produit"> <div id="Produit">
<img src="Images/Produits/pepper.png" alt> <img src="Images/Produits/pepper.png" alt>
@ -63,10 +65,32 @@
<h1>Commentaire:</h1> <h1>Commentaire:</h1>
<input type="text" placeholder="Commentaire" required> <input type="text" placeholder="Commentaire" required>
<h1>Valider:</h1> <h1 id="valider">Valider:</h1>
<input type="submit" value="Envoyer"> <input type="submit" value="Envoyer">
</form> </form>
</div> </div>
</div> </div>
<footer>
<div id="acces">
<table>
<tbody>
<tr>
<th>Accès rapide</th><th id="line"></th><th>Une question ?</th>
</tr>
<tr>
<td><a href="index.html">Accueil</a></td>
<td><a href="index.html#slider">Nos Promotions</a></td>
<td></td>
</tr>
<tr>
<td><a href="index.html#produits">Nos Produits</a></td>
<td><a href="checkout.html">Votre panier</a></td>
<td id="contact"><button onclick="window.location.href='contact.html'" id="contactB">Nous contacter</button></td>
</tr>
</tbody>
</table>
</div>
</footer>
</body> </body>
</html> </html>

28
r2d2.html
View file

@ -5,6 +5,7 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>Kyflo</title> <title>Kyflo</title>
<link rel="stylesheet" type="text/css" href="css.css"> <link rel="stylesheet" type="text/css" href="css.css">
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
</head> </head>
<body id="produit"> <body id="produit">
@ -13,12 +14,13 @@
<nav id="nav"> <nav id="nav">
<div class="topnav"> <div class="topnav">
<a id ="kyflo" class="active" href="index.html">KyFlo</a> <a id ="kyflo" class="active" href="index.html">KyFlo</a>
<a id ="nous" href="#nous">A propos</a> <a id ="nous" href="nous.html">A propos</a>
<a id ="contactN" href="contact.html">Contact</a> <a id ="contactN" href="contact.html">Contact</a>
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a> <a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
<input type="text" placeholder="Rechercher..."> <input type="text" placeholder="Rechercher...">
</div> </div>
</nav> </nav>
<button id="hautPage" onclick="window.location.href='#nav'"><img src="Images/arrow.png" alt></button>
<div id="content"> <div id="content">
<div id="Produit"> <div id="Produit">
<img src="Images/Produits/r2d2.png" alt> <img src="Images/Produits/r2d2.png" alt>
@ -58,10 +60,32 @@
<h1>Commentaire:</h1> <h1>Commentaire:</h1>
<input type="text" placeholder="Commentaire" required> <input type="text" placeholder="Commentaire" required>
<h1>Valider:</h1> <h1 id="valider">Valider:</h1>
<input type="submit" value="Envoyer"> <input type="submit" value="Envoyer">
</form> </form>
</div> </div>
</div> </div>
<footer>
<div id="acces">
<table>
<tbody>
<tr>
<th>Accès rapide</th><th id="line"></th><th>Une question ?</th>
</tr>
<tr>
<td><a href="index.html">Accueil</a></td>
<td><a href="index.html#slider">Nos Promotions</a></td>
<td></td>
</tr>
<tr>
<td><a href="index.html#produits">Nos Produits</a></td>
<td><a href="checkout.html">Votre panier</a></td>
<td id="contact"><button onclick="window.location.href='contact.html'" id="contactB">Nous contacter</button></td>
</tr>
</tbody>
</table>
</div>
</footer>
</body> </body>
</html> </html>