Hugging Face's logo

Spaces:
Taper5749
/
kudaram-lakeview-getaway-guru
Running

App Files Community
Taper5749 commited on
Commit
e726e32
·
verified ·
1 Parent(s): 3ccfbfc

build every page

Browse files
Files changed (5) hide show
  1. admin.html +1 -0
  2. book.html +382 -0
  3. index.html +1 -0
  4. login.html +2 -1
  5. staff.html +1 -0
admin.html CHANGED
@@ -27,6 +27,7 @@
27
  </a>
28
  <a href="/admin/bookings" class="flex items-center p-2 rounded hover:bg-gray-700">
29
  <i data-feather="calendar" class="mr-2"></i> Bookings
 
30
  </a>
31
  <a href="/admin/rooms" class="flex items-center p-2 rounded hover:bg-gray-700">
32
  <i data-feather="home" class="mr-2"></i> Rooms
 
27
  </a>
28
  <a href="/admin/bookings" class="flex items-center p-2 rounded hover:bg-gray-700">
29
  <i data-feather="calendar" class="mr-2"></i> Bookings
30
+ <i data-feather="calendar" class="mr-2"></i> Bookings
31
  </a>
32
  <a href="/admin/rooms" class="flex items-center p-2 rounded hover:bg-gray-700">
33
  <i data-feather="home" class="mr-2"></i> Rooms
book.html ADDED
@@ -0,0 +1,382 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Book Your Stay - Kudaram Lakeview</title>
7
+ <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
8
+ <script src="https://cdn.tailwindcss.com"></script>
9
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
10
+ <script src="https://unpkg.com/feather-icons"></script>
11
+ <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.waves.min.js"></script>
12
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r134/three.min.js"></script>
13
+ <style>
14
+ .booking-section {
15
+ background: rgba(255, 255, 255, 0.95);
16
+ backdrop-filter: blur(5px);
17
+ }
18
+ </style>
19
+ </head>
20
+ <body class="bg-gray-50">
21
+ <!-- Dynamic Background -->
22
+ <div id="vanta-bg" class="fixed top-0 left-0 w-full h-full -z-10"></div>
23
+
24
+ <!-- Navigation -->
25
+ <nav class="bg-white bg-opacity-90 backdrop-filter backdrop-blur-sm shadow-sm sticky top-0 z-50">
26
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
27
+ <div class="flex justify-between h-16">
28
+ <div class="flex">
29
+ <div class="flex-shrink-0 flex items-center">
30
+ <img class="h-8 w-auto" src="/static/logo.png" alt="Kudaram Lakeview">
31
+ <span class="ml-2 text-xl font-bold text-emerald-600">Kudaram Lakeview</span>
32
+ </div>
33
+ <div class="hidden sm:ml-6 sm:flex sm:space-x-8">
34
+ <a href="/" class="nav-link border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">
35
+ Home
36
+ </a>
37
+ <a href="#rooms" class="nav-link border-emerald-500 text-gray-900 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">
38
+ Rooms
39
+ </a>
40
+ <a href="#amenities" class="nav-link border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">
41
+ Amenities
42
+ </a>
43
+ <a href="#gallery" class="nav-link border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">
44
+ Gallery
45
+ </a>
46
+ <a href="#contact" class="nav-link border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">
47
+ Contact
48
+ </a>
49
+ </div>
50
+ </div>
51
+ <div class="hidden sm:ml-6 sm:flex sm:items-center">
52
+ <a href="/login" class="text-gray-500 hover:text-emerald-600 px-3 py-2 rounded-md text-sm font-medium">
53
+ <i data-feather="log-in" class="mr-1"></i> Login
54
+ </a>
55
+ <a href="/admin" class="text-gray-500 hover:text-emerald-600 px-3 py-2 rounded-md text-sm font-medium">
56
+ <i data-feather="lock" class="mr-1"></i> Admin
57
+ </a>
58
+ <a href="/staff" class="text-gray-500 hover:text-emerald-600 px-3 py-2 rounded-md text-sm font-medium">
59
+ <i data-feather="user" class="mr-1"></i> Staff
60
+ </a>
61
+ </div>
62
+ <div class="-mr-2 flex items-center sm:hidden">
63
+ <button type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-emerald-500" aria-controls="mobile-menu" aria-expanded="false">
64
+ <i data-feather="menu"></i>
65
+ </button>
66
+ </div>
67
+ </div>
68
+ </div>
69
+ </nav>
70
+
71
+ <!-- Booking Section -->
72
+ <section class="booking-section py-12">
73
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
74
+ <div class="text-center mb-8">
75
+ <h2 class="text-3xl font-extrabold text-gray-900 sm:text-4xl">
76
+ Book Your Stay
77
+ </h2>
78
+ <p class="mt-3 max-w-2xl mx-auto text-xl text-gray-500 sm:mt-4">
79
+ Secure your perfect getaway with our easy booking process
80
+ </p>
81
+ </div>
82
+
83
+ <div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
84
+ <!-- Booking Form -->
85
+ <div class="bg-white rounded-lg shadow-md p-6">
86
+ <h3 class="text-lg font-medium text-gray-900 mb-4">Booking Details</h3>
87
+ <form id="booking-form">
88
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
89
+ <div>
90
+ <label for="check-in" class="block text-sm font-medium text-gray-700">Check-in Date</label>
91
+ <input type="date" id="check-in" name="check-in" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-emerald-500 focus:ring-emerald-500 py-2 px-3 border">
92
+ </div>
93
+ <div>
94
+ <label for="check-out" class="block text-sm font-medium text-gray-700">Check-out Date</label>
95
+ <input type="date" id="check-out" name="check-out" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-emerald-500 focus:ring-emerald-500 py-2 px-3 border">
96
+ </div>
97
+ </div>
98
+ <div class="mt-4">
99
+ <label for="room-type" class="block text-sm font-medium text-gray-700">Room Type</label>
100
+ <select id="room-type" name="room-type" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-emerald-500 focus:ring-emerald-500 py-2 px-3 border">
101
+ <option value="deluxe">Deluxe Lake View - ₹4,500/night</option>
102
+ <option value="executive">Executive Suite - ₹7,200/night</option>
103
+ <option value="family">Family Suite - ₹9,800/night</option>
104
+ </select>
105
+ </div>
106
+ <div class="mt-4 grid grid-cols-1 md:grid-cols-2 gap-4">
107
+ <div>
108
+ <label for="adults" class="block text-sm font-medium text-gray-700">Adults</label>
109
+ <select id="adults" name="adults" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-emerald-500 focus:ring-emerald-500 py-2 px-3 border">
110
+ <option value="1">1 Adult</option>
111
+ <option value="2" selected>2 Adults</option>
112
+ <option value="3">3 Adults</option>
113
+ <option value="4">4 Adults</option>
114
+ </select>
115
+ </div>
116
+ <div>
117
+ <label for="children" class="block text-sm font-medium text-gray-700">Children</label>
118
+ <select id="children" name="children" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-emerald-500 focus:ring-emerald-500 py-2 px-3 border">
119
+ <option value="0">0 Children</option>
120
+ <option value="1">1 Child</option>
121
+ <option value="2">2 Children</option>
122
+ </select>
123
+ </div>
124
+ </div>
125
+ <div class="mt-6">
126
+ <button type="submit" class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-emerald-600 hover:bg-emerald-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-emerald-500">
127
+ Check Availability
128
+ </button>
129
+ </div>
130
+ </form>
131
+ </div>
132
+
133
+ <!-- Booking Summary -->
134
+ <div class="bg-white rounded-lg shadow-md p-6">
135
+ <h3 class="text-lg font-medium text-gray-900 mb-4">Your Booking Summary</h3>
136
+ <div class="border-b border-gray-200 pb-4">
137
+ <h4 class="font-medium text-gray-700">Deluxe Lake View</h4>
138
+ <p class="text-sm text-gray-500">Breathtaking views of the lake with modern amenities</p>
139
+ </div>
140
+ <div class="py-4 border-b border-gray-200">
141
+ <div class="flex justify-between">
142
+ <span class="text-gray-500">Check-in</span>
143
+ <span class="font-medium">- - -</span>
144
+ </div>
145
+ <div class="flex justify-between mt-1">
146
+ <span class="text-gray-500">Check-out</span>
147
+ <span class="font-medium">- - -</span>
148
+ </div>
149
+ <div class="flex justify-between mt-1">
150
+ <span class="text-gray-500">Guests</span>
151
+ <span class="font-medium">- - -</span>
152
+ </div>
153
+ </div>
154
+ <div class="py-4 border-b border-gray-200">
155
+ <div class="flex justify-between">
156
+ <span class="text-gray-500">Room rate</span>
157
+ <span class="font-medium">₹4,500/night</span>
158
+ </div>
159
+ <div class="flex justify-between mt-1">
160
+ <span class="text-gray-500">Duration</span>
161
+ <span class="font-medium">- - -</span>
162
+ </div>
163
+ </div>
164
+ <div class="pt-4">
165
+ <div class="flex justify-between items-center">
166
+ <span class="text-lg font-bold">Estimated Total</span>
167
+ <span class="text-lg font-bold text-emerald-600">₹0</span>
168
+ </div>
169
+ </div>
170
+ <div class="mt-6">
171
+ <button id="confirm-booking" disabled class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-emerald-600 hover:bg-emerald-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-emerald-500 opacity-50 cursor-not-allowed">
172
+ Confirm Booking
173
+ </button>
174
+ </div>
175
+ </div>
176
+ </div>
177
+ </div>
178
+ </section>
179
+
180
+ <!-- Guest Information Section -->
181
+ <section class="booking-section py-12 bg-gray-50">
182
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
183
+ <div class="bg-white rounded-lg shadow-md p-6">
184
+ <h3 class="text-lg font-medium text-gray-900 mb-4">Guest Information</h3>
185
+ <form id="guest-info">
186
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
187
+ <div>
188
+ <label for="first-name" class="block text-sm font-medium text-gray-700">First Name</label>
189
+ <input type="text" id="first-name" name="first-name" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-emerald-500 focus:ring-emerald-500 py-2 px-3 border">
190
+ </div>
191
+ <div>
192
+ <label for="last-name" class="block text-sm font-medium text-gray-700">Last Name</label>
193
+ <input type="text" id="last-name" name="last-name" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-emerald-500 focus:ring-emerald-500 py-2 px-3 border">
194
+ </div>
195
+ </div>
196
+ <div class="mt-4">
197
+ <label for="email" class="block text-sm font-medium text-gray-700">Email Address</label>
198
+ <input type="email" id="email" name="email" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-emerald-500 focus:ring-emerald-500 py-2 px-3 border">
199
+ </div>
200
+ <div class="mt-4">
201
+ <label for="phone" class="block text-sm font-medium text-gray-700">Phone Number</label>
202
+ <input type="tel" id="phone" name="phone" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-emerald-500 focus:ring-emerald-500 py-2 px-3 border">
203
+ </div>
204
+ <div class="mt-4">
205
+ <label for="special-requests" class="block text-sm font-medium text-gray-700">Special Requests (Optional)</label>
206
+ <textarea id="special-requests" name="special-requests" rows="3" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-emerald-500 focus:ring-emerald-500 py-2 px-3 border"></textarea>
207
+ </div>
208
+ <div class="mt-6">
209
+ <button type="submit" class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-emerald-600 hover:bg-emerald-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-emerald-500">
210
+ Continue to Payment
211
+ </button>
212
+ </div>
213
+ </form>
214
+ </div>
215
+ </div>
216
+ </section>
217
+
218
+ <!-- Payment Section (Hidden by default) -->
219
+ <section id="payment-section" class="booking-section py-12 bg-white hidden">
220
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
221
+ <div class="bg-white rounded-lg shadow-md p-6">
222
+ <h3 class="text-lg font-medium text-gray-900 mb-4">Payment Information</h3>
223
+ <form id="payment-form">
224
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
225
+ <div>
226
+ <label for="card-name" class="block text-sm font-medium text-gray-700">Name on Card</label>
227
+ <input type="text" id="card-name" name="card-name" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-emerald-500 focus:ring-emerald-500 py-2 px-3 border">
228
+ </div>
229
+ <div>
230
+ <label for="card-number" class="block text-sm font-medium text-gray-700">Card Number</label>
231
+ <input type="text" id="card-number" name="card-number" placeholder="1234 5678 9012 3456" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-emerald-500 focus:ring-emerald-500 py-2 px-3 border">
232
+ </div>
233
+ <div>
234
+ <label for="expiry" class="block text-sm font-medium text-gray-700">Expiry Date</label>
235
+ <input type="text" id="expiry" name="expiry" placeholder="MM/YY" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-emerald-500 focus:ring-emerald-500 py-2 px-3 border">
236
+ </div>
237
+ <div>
238
+ <label for="cvv" class="block text-sm font-medium text-gray-700">CVV</label>
239
+ <input type="text" id="cvv" name="cvv" placeholder="123" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-emerald-500 focus:ring-emerald-500 py-2 px-3 border">
240
+ </div>
241
+ </div>
242
+ <div class="mt-6">
243
+ <button type="submit" class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-emerald-600 hover:bg-emerald-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-emerald-500">
244
+ Complete Booking
245
+ </button>
246
+ </div>
247
+ </form>
248
+ </div>
249
+ </div>
250
+ </section>
251
+
252
+ <!-- Confirmation Section (Hidden by default) -->
253
+ <section id="confirmation-section" class="booking-section py-12 bg-emerald-50 hidden">
254
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
255
+ <div class="bg-white rounded-lg shadow-md p-8 max-w-2xl mx-auto">
256
+ <div class="flex justify-center text-emerald-600">
257
+ <i data-feather="check-circle" class="h-16 w-16"></i>
258
+ </div>
259
+ <h2 class="mt-4 text-2xl font-bold text-gray-900">Booking Confirmed!</h2>
260
+ <p class="mt-2 text-gray-600">Thank you for choosing Kudaram Lakeview. We've sent a confirmation email with your booking details.</p>
261
+ <div class="mt-6 bg-gray-50 p-4 rounded-lg text-left">
262
+ <h3 class="text-lg font-medium text-gray-900">Booking Details</h3>
263
+ <div class="mt-2 grid grid-cols-2 gap-2">
264
+ <span class="text-gray-500">Booking ID:</span>
265
+ <span class="font-medium" id="booking-id">BK20230001</span>
266
+ <span class="text-gray-500">Check-in:</span>
267
+ <span class="font-medium" id="confirmation-checkin">15 May 2023</span>
268
+ <span class="text-gray-500">Check-out:</span>
269
+ <span class="font-medium" id="confirmation-checkout">18 May 2023</span>
270
+ <span class="text-gray-500">Room Type:</span>
271
+ <span class="font-medium" id="confirmation-room">Deluxe Lake View</span>
272
+ <span class="text-gray-500">Total Amount:</span>
273
+ <span class="font-medium text-emerald-600" id="confirmation-total">₹13,500</span>
274
+ </div>
275
+ </div>
276
+ <div class="mt-6">
277
+ <a href="/" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-emerald-600 hover:bg-emerald-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-emerald-500">
278
+ Back to Home <i data-feather="arrow-right" class="ml-2"></i>
279
+ </a>
280
+ </div>
281
+ </div>
282
+ </div>
283
+ </section>
284
+
285
+ <!-- Footer -->
286
+ <footer class="bg-gray-900 text-white">
287
+ <div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:px-8">
288
+ <div class="grid grid-cols-2 md:grid-cols-4 gap-8">
289
+ <div>
290
+ <h3 class="text-lg font-semibold text-emerald-400 mb-4">Kudaram Lakeview</h3>
291
+ <p class="text-sm text-gray-300">
292
+ Luxury lakeside accommodations with world-class amenities and breathtaking views.
293
+ </p>
294
+ </div>
295
+ <div>
296
+ <h3 class="text-lg font-semibold text-emerald-400 mb-4">Quick Links</h3>
297
+ <div class="space-y-2">
298
+ <a href="/" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Home</a>
299
+ <a href="/rooms" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Rooms</a>
300
+ <a href="/amenities" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Amenities</a>
301
+ <a href="/gallery" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Gallery</a>
302
+ <a href="/contact" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Contact Us</a>
303
+ </div>
304
+ </div>
305
+ <div>
306
+ <h3 class="text-lg font-semibold text-emerald-400 mb-4">Support</h3>
307
+ <div class="space-y-2">
308
+ <a href="/faq" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">FAQs</a>
309
+ <a href="/privacy" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Privacy Policy</a>
310
+ <a href="/terms" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Terms & Conditions</a>
311
+ </div>
312
+ </div>
313
+ <div>
314
+ <h3 class="text-lg font-semibold text-emerald-400 mb-4">Contact</h3>
315
+ <div class="space-y-2">
316
+ <p class="text-sm text-gray-300">Lakeview Road, Kudaram Village</p>
317
+ <p class="text-sm text-gray-300">Kerala, India - 689123</p>
318
+ <p class="text-sm text-gray-300">+91 98765 43210</p>
319
+ <p class="text-sm text-gray-300">reservations@kudaramlakeview.com</p>
320
+ </div>
321
+ </div>
322
+ </div>
323
+ <div class="border-t border-gray-700 pt-8 mt-8">
324
+ <p class="text-sm text-gray-400 text-center">
325
+ &copy; 2025 Kudaram Holidays Private Limited. All Rights Reserved.
326
+ </p>
327
+ </div>
328
+ </div>
329
+ </footer>
330
+
331
+ <script>
332
+ // Initialize Vanta.js background
333
+ VANTA.WAVES({
334
+ el: "#vanta-bg",
335
+ mouseControls: true,
336
+ touchControls: true,
337
+ gyroControls: false,
338
+ minHeight: 200.00,
339
+ minWidth: 200.00,
340
+ scale: 1.00,
341
+ scaleMobile: 1.00,
342
+ color: 0x10b981,
343
+ shininess: 20.00,
344
+ waveHeight: 15.00,
345
+ waveSpeed: 0.75,
346
+ zoom: 0.65
347
+ });
348
+
349
+ // Initialize feather icons
350
+ feather.replace();
351
+
352
+ // Booking form functionality
353
+ document.getElementById('booking-form').addEventListener('submit', function(e) {
354
+ e.preventDefault();
355
+ // Process booking form
356
+ document.getElementById('confirm-booking').disabled = false;
357
+ document.getElementById('confirm-booking').classList.remove('opacity-50', 'cursor-not-allowed');
358
+ });
359
+
360
+ document.getElementById('confirm-booking').addEventListener('click', function(e) {
361
+ e.preventDefault();
362
+ document.getElementById('payment-section').classList.remove('hidden');
363
+ document.getElementById('payment-section').scrollIntoView({ behavior: 'smooth' });
364
+ });
365
+
366
+ document.getElementById('guest-info').addEventListener('submit', function(e) {
367
+ e.preventDefault();
368
+ document.getElementById('payment-section').classList.remove('hidden');
369
+ document.getElementById('payment-section').scrollIntoView({ behavior: 'smooth' });
370
+ });
371
+
372
+ document.getElementById('payment-form').addEventListener('submit', function(e) {
373
+ e.preventDefault();
374
+ document.getElementById('confirmation-section').classList.remove('hidden');
375
+ document.getElementById('booking-form').classList.add('hidden');
376
+ document.getElementById('guest-info').classList.add('hidden');
377
+ document.getElementById('payment-section').classList.add('hidden');
378
+ document.getElementById('confirmation-section').scrollIntoView({ behavior: 'smooth' });
379
+ });
380
+ </script>
381
+ </body>
382
+ </html>
index.html CHANGED
@@ -72,6 +72,7 @@
72
  </a>
73
  <a href="/book" class="ml-4 inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-emerald-600 hover:bg-emerald-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-emerald-500">
74
  <i data-feather="calendar" class="mr-2"></i> Book Now
 
75
  </a>
76
  </div>
77
  <div class="-mr-2 flex items-center sm:hidden">
 
72
  </a>
73
  <a href="/book" class="ml-4 inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-emerald-600 hover:bg-emerald-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-emerald-500">
74
  <i data-feather="calendar" class="mr-2"></i> Book Now
75
+ <i data-feather="calendar" class="mr-2"></i> Book Now
76
  </a>
77
  </div>
78
  <div class="-mr-2 flex items-center sm:hidden">
login.html CHANGED
@@ -27,7 +27,8 @@
27
  <img class="h-16 w-auto" src="/static/logo.png" alt="Kudaram Lakeview">
28
  </div>
29
  <h2 class="mt-6 text-center text-3xl font-extrabold text-gray-900">
30
- Sign in to your account
 
31
  </h2>
32
  </div>
33
 
 
27
  <img class="h-16 w-auto" src="/static/logo.png" alt="Kudaram Lakeview">
28
  </div>
29
  <h2 class="mt-6 text-center text-3xl font-extrabold text-gray-900">
30
+ <i data-feather="log-in" class="mr-2"></i> Sign in
31
+ to your account
32
  </h2>
33
  </div>
34
 
staff.html CHANGED
@@ -26,6 +26,7 @@
26
  </a>
27
  <a href="/staff/checkin" class="flex items-center p-2 rounded hover:bg-gray-700">
28
  <i data-feather="log-in" class="mr-2"></i> Check-ins
 
29
  </a>
30
  <a href="/staff/checkout" class="flex items-center p-2 rounded hover:bg-gray-700">
31
  <i data-feather="log-out" class="mr-2"></i> Check-outs
 
26
  </a>
27
  <a href="/staff/checkin" class="flex items-center p-2 rounded hover:bg-gray-700">
28
  <i data-feather="log-in" class="mr-2"></i> Check-ins
29
+ <i data-feather="log-in" class="mr-2"></i> Check-ins
30
  </a>
31
  <a href="/staff/checkout" class="flex items-center p-2 rounded hover:bg-gray-700">
32
  <i data-feather="log-out" class="mr-2"></i> Check-outs