-
Notifications
You must be signed in to change notification settings - Fork 0
/
reservations.html
134 lines (129 loc) · 6.38 KB
/
reservations.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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Tchi – Hotel Booking</title>
<!-- configuration -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="format-detection" content="telephone=no"/>
<meta name="format-detection" content="address=no"/>
<meta name="author" content="Dali-habib-mariem" />
<meta name="description" content="Tchi —Une réservation d'hôtel moderne" />
<link rel="shortcut icon" href="assets/images/favicons/favicon.png" type="image/png">
<!-- appel css -->
<link rel="stylesheet" type="text/css" href="assets/styles/style.css"/>
<link rel="stylesheet" type="text/css" href="assets/demo/style-demo.css"/>
</head>
<body>
<!-- Preloader -->
<div class="preloader">
<div class="preloader__wrap">
<div class="preloader__progress"><span></span></div>
</div>
</div>
<!-- Content -->
<main class="main reservation-page">
<div class="reservation-page__left">
<div class="reservation-page__wrap">
<h2 class="title title--h2 text-center">Reservation</h2>
<p class="paragraph text-center">Réservez votre chambre dès maintenant et commencez votre incroyable aventure pleine de découvertes et d'expériences avec Tchi.</p>
<form class="row mt-2 mt-sm-4">
<div class="col-12">
<div class="form-group">
<label class="label" for="name">Votre Nom</label>
<div class="position-relative">
<input type="text" class="inputText inputText__icon" id="name" name="name" placeholder="Entrez votre nom" required="required" autocomplete="off">
<span class="input-icon icon-user"></span>
</div>
</div>
<div class="form-group">
<label class="label" for="email">Votre Email</label>
<div class="position-relative">
<input type="email" class="inputText inputText__icon" id="email" name="email" placeholder="Entrez votre e-mail" required="required" autocomplete="off">
<span class="input-icon icon-mail"></span>
</div>
</div>
<div class="form-group">
<label class="label" for="phone">Votre phone</label>
<div class="position-relative">
<input type="tel" class="inputText inputText__icon" id="phone" name="phone" placeholder="Entrez votre phone" required="required" autocomplete="off">
<span class="input-icon icon-phone"></span>
</div>
</div>
</div>
<div class="col-12 col-sm-6">
<div class="form-group">
<label class="label" for="check-in">Check in</label>
<div class="position-relative">
<input type="text" class="inputText inputText__icon readonly js-datepicker" id="check-in" name="check-in" placeholder="Choisissez Date" required="required" autocomplete="off">
<span class="input-icon icon-calendar"></span>
</div>
</div>
</div>
<div class="col-12 col-sm-6">
<div class="form-group">
<label class="label" for="check-out">Check out</label>
<div class="position-relative">
<input type="text" class="inputText inputText__icon readonly js-datepicker" id="check-out" name="check-out" placeholder="Choisissez Date" required="required" autocomplete="off">
<span class="input-icon icon-calendar"></span>
</div>
</div>
</div>
<div class="col-12 col-sm-6">
<div class="form-group">
<label class="label" for="person-adult">Adultes</label>
<div class="js-quantity">
<span class="qty-minus icon-minus"></span>
<input type="number" class="inputText js-quantity-input" id="person-adult" name="person-adult" value="0" min="1" max="8" required="required" autocomplete="off">
<span class="qty-plus icon-plus"></span>
</div>
</div>
</div>
<div class="col-12 col-sm-6">
<div class="form-group">
<label class="label" for="person-kids">Enfants</label>
<div class="js-quantity">
<span class="qty-minus icon-minus"></span>
<input type="number" class="inputText js-quantity-input" id="person-kids" name="person-kids" value="0" min="0" max="8" autocomplete="off">
<span class="qty-plus icon-plus"></span>
</div>
</div>
</div>
<div class="col-12 col-sm-6 mt-2 mt-sm-3 order-2 order-sm-1">
<a href="home.html" class="btn btn__medium btn__second w-100">Annulez</a>
</div>
<div class="col-12 col-sm-6 mt-2 mt-sm-3 order-1 order-sm-2">
</div>
<button type="submit" class="btn btn__medium w-100">Verification</button>
<div class="col-12 col-sm-6 mt-2 mt-sm-3 order-2 order-sm-1">
<a href="reservations_confirmation.html"> <button type="button" class="btn btn__medium btn__second w-100 ">Payer</button></a>
</div>
</form>
</div>
</div>
<div class="reservation-page__right js-image" data-image="assets/images/image_header_02.jpg"></div>
</main>
<!-- /Content -->
<!-- Demo Menu -->
<div class="btnSlideNav slideOpen"></div>
<div class="btnSlideNav slideClose"></div>
<ul class="slideNav">
<li class="slideNav__item rtl-mode"><h2 class="title title--3">TCHI HOTEL</h2>
<li class="slideNav__item"><a href="home.html">Acceuil</a></li>
<li class="slideNav__item"><a href="rooms.html">Chambres</a></li>
<li class="slideNav__item"><a href="about.html">A propos</a></li>
<li class="slideNav__item"><a href="gallery.html"> Galerie</a></li>
<li class="slideNav__item"><a href="404.html">Évènement</a></li>
<li class="slideNav__item"><a href="contact.html">Contact</a></li>
<li class="slideNav__item"><a href="reservations.html">Reservations</a></li>
</ul>
<div class="overlay-slideNav"></div>
<!-- Demo Menu -->
<!-- JavaScripts -->
<script src="assets/js/jquery-3.4.1.min.js"></script>
<script src="assets/js/plugins.min.js"></script>
<script src="assets/js/common.js"></script>
<script src="assets/demo/plugins-demo.js"></script>
</body>
</html>