-
Notifications
You must be signed in to change notification settings - Fork 0
/
Reservation.html
144 lines (121 loc) · 5.11 KB
/
Reservation.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
<!DOCTYPE html>
<html lang="fr">
<head >
<title>Agence de Voyage</title>
<link rel="shortcut icon" type="image/png" href="img/favicon.ico"/>
<link rel="stylesheet" href="css/style.css"/>
<script src="https://kit.fontawesome.com/248965cc4b.js" crossorigin="anonymous"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="scroll_to_top">
<a href="#top"><img src="img/fleche.png" alt="Retourner en haut" /></a>
</div>
</head>
<body onload="reservez()">
<div >
<ul class="navigation">
<li ><a href="index.html">Accueil</a></li>
<li ><a href="Contact.html">Contact</a></li>
<li ><a target="_blank" href="map.html">Map</a></li>
<li><button class="boutonCnx" onclick="document.getElementById('id01').style.display='block'">Connexion</button></li>
<li id="bonjour"></li>
</ul>
</div>
<div id="id01" class="modal">
<span onclick="document.getElementById('id01').style.display='none'"
class="close" title="Close Modal">×</span>
<form class="modal-content animate" >
<div class="container1">
<p>Connectez-vous!</p>
<div>
<label for="uname">Email ou téléphone</label>
<br>
<input id="coname" type="text" placeholder="ex: nom@gmail.com" name="uname" required>
</div>
<div>
<label for="psw" >Mot de passe</label>
<br>
<input id="copass" type="password" placeholder="Entrez mot de passe" name="psw" required>
</div>
</div>
<div class="container2" >
<div>
<button class="boutonForm" type="button" class="cancelbtn" onclick="hello(), document.getElementById('id01').style.display='none'" >Connexion</button>
<br>
<label>
<input type="checkbox" checked="checked" name="remember"> Rester connecté
</label>
<br>
</div>
<button class="boutonForm" type="button" onclick="document.getElementById('id01').style.display='none'" class="cancelbtn">Annuler</button>
<br>
<div class="forgotPsw">
<a href="#"><span class="psw">Mot de passe oublié?</span></a>
</div>
</div>
</form>
</div>
<h1 id="dest"> Reservez votre voyage ! </h1>
<form class="form" action="Recapitulatif.html" method="GET" onchange="change()">
<p>Veuillez renseigner les champs ci-dessous:</p>
<div class="formeGr">
<label for="surname">Nom:</label>
<input type="text" placeholder="Ex: Etienne" required id="sname" name="user_name">
</div>
<div class="formeGr">
<label for="surname">Prénom:</label>
<input type="text" placeholder="Ex: Silia" required id="surname" name="user_surname">
</div>
<div class="formeGr">
<label for="mail">e-mail:</label>
<input type="email" placeholder="Ex: etienne@silia.fr" required id="mail" name="user_mail">
</div>
<div class="formeGr">
<label for="phone">Téléphone:</label>
<input type="number" placeholder="Ex: 012345678" id="phone" name="user_number">
</div>
<div class="formeGr">
<label for="departure">Départ:</label>
<input type="date" required id="departure" name="user_departure">
</div>
<div class="formeGr">
<label for="return">Retour:</label>
<input type="date" required id="return" name="user_return">
</div>
<div class="formeGr">
<label for="adults">Nombre d'adultes:</label>
<input type="number" min = 1 placeholder="Ex: 3" required id="adults" name="user_adults" min=1>
</div>
<div class="formeGr">
<label for="kids">Nombre d'enfants (-12 ans):</label>
<input type="number" placeholder="Ex: 2" required id="kids" name="user_kids" min=0>
</div>
<div class="formeGr">
<label for="breakfast" >Souhaitez-vous le petit déjeuner?</label>
<input type="radio" name="user_breakfast" value="oui">Oui
<input type="radio" name="user_breakfast" value="non">Non
</div>
<div class="formeGr">
<label>Avez-vous un régime particulier?</label>
<select name="regime">
<option value="vegetarien">Végétarien</option>
<option value="Halal">Halal</option>
<option value="allergies">Allergies</option>
</select>
</div>
<div class="formeGr">
<label for="message"> Rensiegnements additionnels</i> :</label>
+
<textarea id="message" name="user_message"></textarea>
</div>
<div>
<label id="prix"> Le prix total est de: </i> :</label>
</div>
<div class="bouton"> <input type="reset" value="Reset" > </i> <i class="fas fa-redo"></i> </div>
<div class="bouton"> <input type="submit" value="Submit"> <i class="fas fa-paper-plane"></i> </div>
</form>
</body>
<footer>
Site crée par Silia Taider et Etienne Faucher
</footer>
<script src="js/script.js"></script>
</html>