adding x
This commit is contained in:
parent
9407a4931d
commit
a96c3f6255
5 changed files with 211 additions and 173 deletions
|
@ -25,6 +25,7 @@
|
||||||
<div id="dark_popup">
|
<div id="dark_popup">
|
||||||
|
|
||||||
<div id="popup">
|
<div id="popup">
|
||||||
|
<a href="#"><h1>X</h1></a>
|
||||||
<h1>L'article Nao a bien été ajouté à votre panier !</h1>
|
<h1>L'article Nao a bien été ajouté à votre panier !</h1>
|
||||||
<a href="../Autres/checkout.html"><h2>Voir mon panier</h2></a>
|
<a href="../Autres/checkout.html"><h2>Voir mon panier</h2></a>
|
||||||
<a href="../../../index.html"><h2>Continuer mes achats</h2></a>
|
<a href="../../../index.html"><h2>Continuer mes achats</h2></a>
|
||||||
|
|
|
@ -22,73 +22,82 @@
|
||||||
<input type="text" placeholder="Rechercher sur tout le site...">
|
<input type="text" placeholder="Rechercher sur tout le site...">
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
<div class="title">
|
<div id="dark_popup">
|
||||||
<h1>Résumé</h1>
|
<div id="popup">
|
||||||
</div>
|
<a href="#"><h1>X</h1></a>
|
||||||
|
<h1>L'article Pepper a bien été ajouté à votre panier !</h1>
|
||||||
<div class="content">
|
<a href="../Autres/checkout.html"><h2>Voir mon panier</h2></a>
|
||||||
<div id="Produit">
|
<a href="../../../index.html"><h2>Continuer mes achats</h2></a>
|
||||||
<img src="../../Images/Produits/pepper.png" alt>
|
|
||||||
<h1>ROBOT PEPPER</h1>
|
|
||||||
<button onclick="window.location.href='../Autres/checkout.html'">Ajouter au panier</button>
|
|
||||||
<h2>15 000€</h2>
|
|
||||||
<h3>Pepper est un robot humanoïde, développé par la société SoftBank Robotics (anciennement Aldebaran), capable de reconnaître certaines émotions</h3>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="title">
|
<div class="title">
|
||||||
<h1>Caractéristiques techniques</h1>
|
<h1>Résumé</h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="content" id="Carac">
|
<div class="content">
|
||||||
<h2>Pepper est le premier robot humanoïde au monde capable d'identifier les visages et les principales émotions humaines. Pepper a été conçu pour interagir avec les humains de la façon la plus naturelle possible à travers le dialogue et son écran
|
<div id="Produit">
|
||||||
tactile.</h2>
|
<img src="../../Images/Produits/pepper.png" alt>
|
||||||
<h2>Du haut de ses 1m20, Pepper n’a aucun mal pour percevoir son environnement et engager le dialogue lorsqu’il aperçoit une personne. L'écran tactile sur son torse affiche du contenu pour renforcer les messages et seconder la parole.</h2>
|
<h1>ROBOT PEPPER</h1>
|
||||||
<h2>Son design tout en rondeurs assure une utilisation sans danger et une très bonne acceptation des utilisateurs.</h2>
|
<button onclick="window.location.href='#dark_popup'">Ajouter au panier</button>
|
||||||
</div>
|
<h2>15 000€</h2>
|
||||||
|
<h3>Pepper est un robot humanoïde, développé par la société SoftBank Robotics (anciennement Aldebaran), capable de reconnaître certaines émotions</h3>
|
||||||
<div class="title">
|
|
||||||
<h1>Commentaires clients</h1>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="content">
|
|
||||||
<div id="Client">
|
|
||||||
<div>
|
|
||||||
<img src="../../Images/Icones/avatarH.png" alt>
|
|
||||||
<h1>Michel Dirate</h1>
|
|
||||||
<h2>Livraison très longue ! Cependant, produit de qualité.</h2>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<img src="../../Images/Icones/avatarF.png" alt>
|
|
||||||
<h1>Ines Foubi</h1>
|
|
||||||
<h2>Bon robot, ma famille l'adore !</h2>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<img src="../../Images/Icones/avatarH.png" alt>
|
|
||||||
<h1>Robert Ritar</h1>
|
|
||||||
<h2>Robot très serviable.</h2>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="title">
|
<div class="title">
|
||||||
<h1>Laissez nous un commentaire :</h1>
|
<h1>Caractéristiques techniques</h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="content" id="com">
|
<div class="content" id="Carac">
|
||||||
<form action="../Autres/commentaire.html">
|
<h2>Pepper est le premier robot humanoïde au monde capable d'identifier les visages et les principales émotions humaines. Pepper a été conçu pour interagir avec les humains de la façon la plus naturelle possible à travers le dialogue et son écran
|
||||||
<h2>Nom et Prénom :</h2>
|
tactile.</h2>
|
||||||
<input type="text" required>
|
<h2>Du haut de ses 1m20, Pepper n’a aucun mal pour percevoir son environnement et engager le dialogue lorsqu’il aperçoit une personne. L'écran tactile sur son torse affiche du contenu pour renforcer les messages et seconder la parole.</h2>
|
||||||
|
<h2>Son design tout en rondeurs assure une utilisation sans danger et une très bonne acceptation des utilisateurs.</h2>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h2>Email :</h2>
|
<div class="title">
|
||||||
<input type="email" required>
|
<h1>Commentaires clients</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h2>Commentaire:</h2>
|
<div class="content">
|
||||||
<input type="text" placeholder="Commentaire" required>
|
<div id="Client">
|
||||||
|
<div>
|
||||||
|
<img src="../../Images/Icones/avatarH.png" alt>
|
||||||
|
<h1>Michel Dirate</h1>
|
||||||
|
<h2>Livraison très longue ! Cependant, produit de qualité.</h2>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<img src="../../Images/Icones/avatarF.png" alt>
|
||||||
|
<h1>Ines Foubi</h1>
|
||||||
|
<h2>Bon robot, ma famille l'adore !</h2>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<img src="../../Images/Icones/avatarH.png" alt>
|
||||||
|
<h1>Robert Ritar</h1>
|
||||||
|
<h2>Robot très serviable.</h2>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h2 id="valider">Valider:</h2>
|
<div class="title">
|
||||||
<input type="submit" value="Envoyer">
|
<h1>Laissez nous un commentaire :</h1>
|
||||||
</form>
|
</div>
|
||||||
|
|
||||||
|
<div class="content" id="com">
|
||||||
|
<form action="../Autres/commentaire.html">
|
||||||
|
<h2>Nom et Prénom :</h2>
|
||||||
|
<input type="text" required>
|
||||||
|
|
||||||
|
<h2>Email :</h2>
|
||||||
|
<input type="email" required>
|
||||||
|
|
||||||
|
<h2>Commentaire:</h2>
|
||||||
|
<input type="text" placeholder="Commentaire" required>
|
||||||
|
|
||||||
|
<h2 id="valider">Valider:</h2>
|
||||||
|
<input type="submit" value="Envoyer">
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
|
|
|
@ -22,69 +22,78 @@
|
||||||
<input type="text" placeholder="Rechercher sur tout le site...">
|
<input type="text" placeholder="Rechercher sur tout le site...">
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
<div class="title">
|
<div id="dark_popup">
|
||||||
<h1>Résumé</h1>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="content">
|
<div id="popup">
|
||||||
<div id="Produit">
|
<a href="#"><h1>X</h1></a>
|
||||||
<img src="../../Images/Produits/r2d2.png" alt>
|
<h1>L'article R2D2 a bien été ajouté à votre panier !</h1>
|
||||||
<h1>ROBOT R2D2</h1>
|
<a href="../Autres/checkout.html"><h2>Voir mon panier</h2></a>
|
||||||
<button onclick="window.location.href='../Autres/checkout.html'">Ajouter au panier</button>
|
<a href="../../../index.html"><h2>Continuer mes achats</h2></a>
|
||||||
<h2>5 000€</h2>
|
|
||||||
<h3>R2D2 est un petit robot de compagnie capable de vous servir d'assistant intergalactique au quotidien</h3>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="title">
|
<div class="title">
|
||||||
<h1>Caractéristiques techniques</h1>
|
<h1>Résumé</h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="content" id="Carac">
|
<div class="content">
|
||||||
<h2>R2D2 est équipé de la dernière technologie de streaming musical pour vour lire toutes vos musiques préférées</h2>
|
<div id="Produit">
|
||||||
<h2>Son design tout droit tiré de la série vous plongera dans l'univers Star Wars à coup sur !</h2>
|
<img src="../../Images/Produits/r2d2.png" alt>
|
||||||
<h2>Il possède une reconnaissance vocale très optimale qui vous permettras de le piloter rien qu'a la voix !</h2>
|
<h1>ROBOT R2D2</h1>
|
||||||
</div>
|
<button onclick="window.location.href='#dark_popup'">Ajouter au panier</button>
|
||||||
|
<h2>5 000€</h2>
|
||||||
<div class="title">
|
<h3>R2D2 est un petit robot de compagnie capable de vous servir d'assistant intergalactique au quotidien</h3>
|
||||||
<h1>Commentaires clients</h1>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="content">
|
|
||||||
<div id="Client">
|
|
||||||
<div>
|
|
||||||
<img src="../../Images/Icones/avatarH.png" alt>
|
|
||||||
<h1>Patrick Busson</h1>
|
|
||||||
<h2>Petit robot sympathique, très utile au quotidien !</h2>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<img src="../../Images/Icones/avatarF.png" alt>
|
|
||||||
<h1>Clara Soufu</h1>
|
|
||||||
<h2>Grande fan de Star Wars, j'adore ce petit robot personnel !</h2>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="title">
|
||||||
|
<h1>Caractéristiques techniques</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="content" id="Carac">
|
||||||
|
<h2>R2D2 est équipé de la dernière technologie de streaming musical pour vour lire toutes vos musiques préférées</h2>
|
||||||
|
<h2>Son design tout droit tiré de la série vous plongera dans l'univers Star Wars à coup sur !</h2>
|
||||||
|
<h2>Il possède une reconnaissance vocale très optimale qui vous permettras de le piloter rien qu'a la voix !</h2>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="title">
|
||||||
|
<h1>Commentaires clients</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="content">
|
||||||
|
<div id="Client">
|
||||||
|
<div>
|
||||||
|
<img src="../../Images/Icones/avatarH.png" alt>
|
||||||
|
<h1>Patrick Busson</h1>
|
||||||
|
<h2>Petit robot sympathique, très utile au quotidien !</h2>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<img src="../../Images/Icones/avatarF.png" alt>
|
||||||
|
<h1>Clara Soufu</h1>
|
||||||
|
<h2>Grande fan de Star Wars, j'adore ce petit robot personnel !</h2>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="title">
|
||||||
|
<h1>Laissez nous un commentaire :</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="content" id="com">
|
||||||
|
<form action="../Autres/commentaire.html">
|
||||||
|
<h2>Nom et Prénom :</h2>
|
||||||
|
<input type="text" required>
|
||||||
|
|
||||||
|
<h2>Email :</h2>
|
||||||
|
<input type="email" required>
|
||||||
|
|
||||||
|
<h2>Commentaire:</h2>
|
||||||
|
<input type="text" placeholder="Commentaire" required>
|
||||||
|
|
||||||
|
<h2 id="valider">Valider:</h2>
|
||||||
|
<input type="submit" value="Envoyer">
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="title">
|
|
||||||
<h1>Laissez nous un commentaire :</h1>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="content" id="com">
|
|
||||||
<form action="../Autres/commentaire.html">
|
|
||||||
<h2>Nom et Prénom :</h2>
|
|
||||||
<input type="text" required>
|
|
||||||
|
|
||||||
<h2>Email :</h2>
|
|
||||||
<input type="email" required>
|
|
||||||
|
|
||||||
<h2>Commentaire:</h2>
|
|
||||||
<input type="text" placeholder="Commentaire" required>
|
|
||||||
|
|
||||||
<h2 id="valider">Valider:</h2>
|
|
||||||
<input type="submit" value="Envoyer">
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
<div id="acces">
|
<div id="acces">
|
||||||
<table>
|
<table>
|
||||||
|
|
|
@ -22,67 +22,77 @@
|
||||||
<input type="text" placeholder="Rechercher sur tout le site...">
|
<input type="text" placeholder="Rechercher sur tout le site...">
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
<div class="title">
|
<div id="dark_popup">
|
||||||
<h1>Résumé</h1>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="content">
|
<div id="popup">
|
||||||
<div id="Produit">
|
<a href="#"><h1>X</h1></a>
|
||||||
<img src="../../Images/Produits/terminator.png" alt>
|
<h1>L'article Terminator a été ajouté à votre panier !</h1>
|
||||||
<h1>ROBOT TERMINATOR</h1>
|
<a href="../Autres/checkout.html"><h2>Voir mon armée</h2></a>
|
||||||
<button onclick="window.location.href='../Autres/checkout.html'">Ajouter au panier</button>
|
<a href="../../../index.html"><h2>Continuer la domination du monde</h2></a>
|
||||||
<h2>50 000€</h2>
|
|
||||||
<h3>Le robot terminator est idéal si vous envisagez de conquérir la planète !</h3>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="title">
|
<div class="title">
|
||||||
<h1>Caractéristiques techniques</h1>
|
<h1>Résumé</h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="content" id="Carac">
|
<div class="content">
|
||||||
<h2>Terminator est équipé de nombreux lazers et est doté d'une IA des plus avancée.</h2>
|
<div id="Produit">
|
||||||
<h2>Son design humanoide lui permet de se fondre dans la masse une fois habillé !</h2>
|
<img src="../../Images/Produits/terminator.png" alt>
|
||||||
<h2>Il peut controler l'esprit des autres personnes grâce aux ondes qu'il emet.</h2>
|
<h1>ROBOT TERMINATOR</h1>
|
||||||
</div>
|
<button onclick="window.location.href='#dark_popup'">Ajouter au panier</button>
|
||||||
|
<h2>50 000€</h2>
|
||||||
<div class="title">
|
<h3>Le robot terminator est idéal si vous envisagez de conquérir la planète !</h3>
|
||||||
<h1>Commentaires clients</h1>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="content">
|
|
||||||
<div id="Client">
|
|
||||||
<div>
|
|
||||||
<img src="../../Images/Icones/avatarF.png" alt>
|
|
||||||
<h1>Aude Fousi</h1>
|
|
||||||
<h2>Robot trop effrayant et trop cher !</h2>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<img src="../../Images/Icones/avatarH.png" alt>
|
|
||||||
<h1>Pierre Tarte</h1>
|
|
||||||
<h2>Superbe robot, je vais pouvoir mettre mon plan de coup d'état a éxécution...</h2>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="title">
|
<div class="title">
|
||||||
<h1>Laissez nous un commentaire :</h1>
|
<h1>Caractéristiques techniques</h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="content" id="com">
|
<div class="content" id="Carac">
|
||||||
<form action="../Autres/commentaire.html">
|
<h2>Terminator est équipé de nombreux lazers et est doté d'une IA des plus avancée.</h2>
|
||||||
<h2>Nom et Prénom :</h2>
|
<h2>Son design humanoide lui permet de se fondre dans la masse une fois habillé !</h2>
|
||||||
<input type="text" required>
|
<h2>Il peut controler l'esprit des autres personnes grâce aux ondes qu'il emet.</h2>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h2>Email :</h2>
|
<div class="title">
|
||||||
<input type="email" required>
|
<h1>Commentaires clients</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h2>Commentaire:</h2>
|
<div class="content">
|
||||||
<input type="text" placeholder="Commentaire" required>
|
<div id="Client">
|
||||||
|
<div>
|
||||||
|
<img src="../../Images/Icones/avatarF.png" alt>
|
||||||
|
<h1>Aude Fousi</h1>
|
||||||
|
<h2>Robot trop effrayant et trop cher !</h2>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<img src="../../Images/Icones/avatarH.png" alt>
|
||||||
|
<h1>Pierre Tarte</h1>
|
||||||
|
<h2>Superbe robot, je vais pouvoir mettre mon plan de coup d'état a éxécution...</h2>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h2 id="valider">Valider:</h2>
|
<div class="title">
|
||||||
<input type="submit" value="Envoyer">
|
<h1>Laissez nous un commentaire :</h1>
|
||||||
</form>
|
</div>
|
||||||
|
|
||||||
|
<div class="content" id="com">
|
||||||
|
<form action="../Autres/commentaire.html">
|
||||||
|
<h2>Nom et Prénom :</h2>
|
||||||
|
<input type="text" required>
|
||||||
|
|
||||||
|
<h2>Email :</h2>
|
||||||
|
<input type="email" required>
|
||||||
|
|
||||||
|
<h2>Commentaire:</h2>
|
||||||
|
<input type="text" placeholder="Commentaire" required>
|
||||||
|
|
||||||
|
<h2 id="valider">Valider:</h2>
|
||||||
|
<input type="submit" value="Envoyer">
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
|
|
|
@ -725,7 +725,7 @@ input[type=submit]:hover{
|
||||||
display:none;
|
display:none;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
background-color : #ddd;
|
background-color : #ddd;
|
||||||
top: 50%;
|
top: 30%;
|
||||||
padding: 1vw;
|
padding: 1vw;
|
||||||
border-radius: 1vw;
|
border-radius: 1vw;
|
||||||
left: 15%;
|
left: 15%;
|
||||||
|
@ -758,4 +758,13 @@ input[type=submit]:hover{
|
||||||
font-size: 2.5vw;
|
font-size: 2.5vw;
|
||||||
transition-duration: 0.5s;
|
transition-duration: 0.5s;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#popup a[href="#"]{
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
#popup a[href="#"] h1{
|
||||||
|
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
/*===============================================*/
|
/*===============================================*/
|
||||||
|
|
Reference in a new issue