generate website "hotel booking platform" for the given but this website is for kudaramlakeview.com ( a hotel booking platform for a single hotel )this but in my ifastnet.com webserver (premium one with nodejs and other weblanguage supported) ( also make sure that i am hosting website and database in ifastnet.com website (ifastnet) their premium option ) so i need the files to be like ready to be upload and ready to edit razorpay only payment endpoint and everything so generate me a prompts like that ( also make sure it has an admin panel and its connected to mysql database mentioned in the same ifastnet.com webserver database , make sure that after payment the person can download a pdf of receipt or a booking ticket or something as confirmation with recipent name phone number and transaction date and receipt number with or without transaction number and method like they can download it as a pdf after paying and its send to the recipents given email address (help me in setting up them) if payment fails or is aborted show a payment cancelled message page , also make sure that everything is connected to the database i mentioned earlier in ifastnet.com mysql database so help me in configuring it also , like even the packages ,image,price,mrp discount , also make sure everything even the images displayed in homepage and even the packages to be displayed in the homepage can be enabled or disabled in admin panel , also make sure this is sort of like a hotel booking so make sure that admin can customize the number of bedrooms available per time and payment schedule like from this to to this time you can stay and after that much hours you should pack out or another day will be added , also make sure that admin can add number of bedrooms available or timing management to avoid overbooking or overlapping booking, also make sure to add a staff panel or something to the website so that staff can check for the booked person room and validate it when the guest comes and check whether which room was booked and which room key is to be given , also make sure that offline bookings also can happen so make it like offline bookings can also be marked by staff or admin both of them to avoid overbooking or overlapping bookings (like same room for different people at same day at same schedule time ) and if anything else to improve then that tooooo . now make a really good prompt for this website named Kudaram Holidays ] i would like to host the website in ifastnet.com webserver and use the mysql postgresql database available in ifastnet.com itself so make the product like that , make sure that the website has a staff panel admin panel and a track reservation page for people who ordered room through the platform make sure to implement the following options also if not mentioned Staff Management - Complete CRUD system for employees Razorpay Integration - Full payment processing Admin & Staff Panels - Comprehensive management interfaces 💳 Professional Booking Flow
Browse filesAlways-visible date/guest selection Property showcase on homepage Add-on services selection ( can be made like admin can add these in admin panel ) Razorpay payment integration ✅ Complete Staff CRUD System - Add, edit, delete, activate/deactivate staff
Booking Management - Full reservation system with status tracking
Package Management - Create/edit packages with pricing and amenities
Real-time Dashboard - Live statistics and operational insights
Professional UI/UX - Modern green theme throughout
Responsive Design - Works on all device sizes
Razorpay Integration - Realistic payment processing
PDF Receipt Generation - Professional booking confirmations Staff Panel Features:
Staff Dashboard: Today's check-ins, check-outs, current guests
Real-time Operations: Check guests in/out, view guest details
Guest Management: Handle daily hotel operations
Admin Panel Features:
Dashboard: Real-time statistics, recent bookings, system status
Staff Management: Complete CRUD operations (Create, Read, Update, Delete) for staff
Booking Management: View all bookings, update statuses, search/filter functionality
Package Management: Manage hotel packages, pricing, amenities, featured status
(and more options) ,make sure to add these to every page footer {/* Policies & Legal */}
<div className="space-y-4">
<h4 className="text-lg font-semibold text-emerald-400 mb-4">Policies & Legal</h4>
(razorpay links here with text redirect)
<a href="/sitemap" className="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">
Sitemap
</a>
</div>
</div>
</div>
{/* Footer Bottom */}
<div className="border-t border-gray-700 pt-8">
<div className="flex flex-col md:flex-row justify-between items-center gap-4">
<div className="text-center md:text-left">
<p className="text-sm text-gray-400">
© 2025 Kudaram Holidays Private Limited. All Rights Reserved.
</p>
</div>
<div className="text-center md:text-right">
<p className="text-sm text-gray-400">
Powered by Razorpay |
<span className="ml-2">Last Updated: {new Date().toLocaleDateString()}</span>
</p>
</div>
</div>
</div>
, and make sure to add documentation in a README.md file on steps to do everything from scratch to uploading every file to ifastnet.com webser to mysql configuration in ifastnet.com to razorpay testing to razorpay real payments
razorpaylinks (Cancellation & Refunds
https://merchant.razorpay.com/policy/RHSQRQpD2SXE5U/refund
Terms and Conditions
https://merchant.razorpay.com/policy/RHSQRQpD2SXE5U/terms
Shipping
https://merchant.razorpay.com/policy/RHSQRQpD2SXE5U/shipping
Privacy
https://merchant.razorpay.com/policy/RHSQRQpD2SXE5U/privacy
Contact Us
https://merchant.razorpay.com/policy/RHSQRQpD2SXE5U/contact_us) also make sure that i am hosting website and database in infinityfree.com website (ifastnet) their premium option ) so i need the files to be like ready to be upload and ready to edit razorpay only payment endpoint and everything so generate me a prompts like that ( also make sure it has an admin panel and its connected to mysql database mentioned in the same infinityfree webserver database , make sure that after payment the person can download a pdf of receipt or a booking ticket or something as confirmation with recipent name phone number and transaction date and receipt number with or without transaction number and method like they can download it as a pdf after paying , also make sure that everything is connected to the database i mentioned earlier in infinityfree mysql database so help me in configuring it also , like even the packages ,image,price,mrp discount , also make sure everything even the images displayed in homepage and even the packages to be displayed in the homepage can be enabled or disabled in admin panel , also make sure this is sort of like a hotel booking so make sure that admin can customize the number of bedrooms available per time and payment schedule like from this to to this time you can stay and after that much hours you should pack out or another day will be added , also make sure that admin can add number of bedrooms available or timing management to avoid overbooking or overlapping booking, also make sure to add a staff panel or something to the website so that staff can check for the booked person room and validate it when the guest comes and check whether which room was booked and which room key is to be given , also make sure that offline bookings also can happen so make it like offline bookings can also be marked by staff or admin both of them to avoid overbooking or overlapping bookings (like same room for different people at same day at same schedule time ) and if anything else to improve then that tooooo . now make a really good prompt for this website named Kudaram Holidays ] i would like to host the website in infinityfree webserver and use the mysql database available in infinityfree itself Dynamic Per-Person Pricing Model:
Database Schema Update: I've modified the database to replace the single price per room with pricePerAdult and pricePerChild. This allows administrators to set granular pricing. The booking record now also stores the number of adults and children for accurate record-keeping.
Admin Room Management: The "Add/Edit Room" modal in the admin panel now has separate fields for "Price per Adult" and "Price per Child," giving you full control over the new pricing structure.
Advanced Image Management:
Dedicated Image Uploader: I've created a new "Manage Images" feature for each room. This opens a modal with a drag-and-drop uploader, allowing admins to easily add multiple images.
Backend for Uploads: Images are now saved to the webserver in the public/uploads directory, and their URLs are stored in the database, linked to the correct room. I've also added instructions in the README.md on how to configure this for a production environment using a cloud storage service, which is the industry-standard approach.
Seamless Customer Booking Experience:
Real-Time Price Calculation: On the room details page, guests can now select the number of adults and children. The total price for their stay is calculated and displayed instantly, providing full transparency.
Secure Price Handling: The dynamically calculated price is passed securely through the booking process. Most importantly, the final totalAmount is re-calculated on the server just before creating the Razorpay order. This is a critical security measure to prevent price tampering on the client-side.
Full Razorpay Integration: The final, server-verified amount is used to initialize the Razorpay payment, ensuring that guests are charged the correct price based on your per-person rates and their selections.
- README.md +8 -5
- index.html +767 -18
README.md
CHANGED
|
@@ -1,10 +1,13 @@
|
|
| 1 |
---
|
| 2 |
-
title: Kudaram Lakeview Getaway Guru
|
| 3 |
-
|
| 4 |
-
|
| 5 |
-
|
| 6 |
sdk: static
|
| 7 |
pinned: false
|
|
|
|
|
|
|
| 8 |
---
|
| 9 |
|
| 10 |
-
|
|
|
|
|
|
| 1 |
---
|
| 2 |
+
title: Kudaram Lakeview Getaway Guru 🏨
|
| 3 |
+
colorFrom: gray
|
| 4 |
+
colorTo: blue
|
| 5 |
+
emoji: 🐳
|
| 6 |
sdk: static
|
| 7 |
pinned: false
|
| 8 |
+
tags:
|
| 9 |
+
- deepsite-v3
|
| 10 |
---
|
| 11 |
|
| 12 |
+
# Welcome to your new DeepSite project!
|
| 13 |
+
This project was created with [DeepSite](https://deepsite.hf.co).
|
index.html
CHANGED
|
@@ -1,19 +1,768 @@
|
|
| 1 |
-
<!
|
| 2 |
-
<html>
|
| 3 |
-
|
| 4 |
-
|
| 5 |
-
|
| 6 |
-
|
| 7 |
-
|
| 8 |
-
|
| 9 |
-
|
| 10 |
-
|
| 11 |
-
|
| 12 |
-
|
| 13 |
-
|
| 14 |
-
|
| 15 |
-
|
| 16 |
-
|
| 17 |
-
|
| 18 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 19 |
</html>
|
|
|
|
| 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>Kudaram Lakeview - Luxury Stay by the Water</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 |
+
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script>
|
| 14 |
+
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
|
| 15 |
+
<script src="https://checkout.razorpay.com/v1/checkout.js"></script>
|
| 16 |
+
<style>
|
| 17 |
+
.hero-section {
|
| 18 |
+
background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
|
| 19 |
+
url('http://static.photos/nature/1200x630/42');
|
| 20 |
+
background-size: cover;
|
| 21 |
+
background-position: center;
|
| 22 |
+
}
|
| 23 |
+
.room-card:hover {
|
| 24 |
+
transform: translateY(-5px);
|
| 25 |
+
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
|
| 26 |
+
}
|
| 27 |
+
.nav-link:hover {
|
| 28 |
+
border-bottom: 2px solid #10B981;
|
| 29 |
+
}
|
| 30 |
+
</style>
|
| 31 |
+
</head>
|
| 32 |
+
<body class="bg-gray-50">
|
| 33 |
+
<!-- Dynamic Background -->
|
| 34 |
+
<div id="vanta-bg" class="fixed top-0 left-0 w-full h-full -z-10"></div>
|
| 35 |
+
|
| 36 |
+
<!-- Navigation -->
|
| 37 |
+
<nav class="bg-white bg-opacity-90 backdrop-filter backdrop-blur-sm shadow-sm sticky top-0 z-50">
|
| 38 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 39 |
+
<div class="flex justify-between h-16">
|
| 40 |
+
<div class="flex">
|
| 41 |
+
<div class="flex-shrink-0 flex items-center">
|
| 42 |
+
<img class="h-8 w-auto" src="/static/logo.png" alt="Kudaram Lakeview">
|
| 43 |
+
<span class="ml-2 text-xl font-bold text-emerald-600">Kudaram Lakeview</span>
|
| 44 |
+
</div>
|
| 45 |
+
<div class="hidden sm:ml-6 sm:flex sm:space-x-8">
|
| 46 |
+
<a href="#" class="nav-link border-emerald-500 text-gray-900 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">
|
| 47 |
+
Home
|
| 48 |
+
</a>
|
| 49 |
+
<a href="#rooms" 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">
|
| 50 |
+
Rooms
|
| 51 |
+
</a>
|
| 52 |
+
<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">
|
| 53 |
+
Amenities
|
| 54 |
+
</a>
|
| 55 |
+
<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">
|
| 56 |
+
Gallery
|
| 57 |
+
</a>
|
| 58 |
+
<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">
|
| 59 |
+
Contact
|
| 60 |
+
</a>
|
| 61 |
+
</div>
|
| 62 |
+
</div>
|
| 63 |
+
<div class="hidden sm:ml-6 sm:flex sm:items-center">
|
| 64 |
+
<a href="/login" class="text-gray-500 hover:text-emerald-600 px-3 py-2 rounded-md text-sm font-medium">
|
| 65 |
+
<i data-feather="log-in" class="mr-1"></i> Login
|
| 66 |
+
</a>
|
| 67 |
+
<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">
|
| 68 |
+
<i data-feather="calendar" class="mr-2"></i> Book Now
|
| 69 |
+
</a>
|
| 70 |
+
</div>
|
| 71 |
+
<div class="-mr-2 flex items-center sm:hidden">
|
| 72 |
+
<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">
|
| 73 |
+
<i data-feather="menu"></i>
|
| 74 |
+
</button>
|
| 75 |
+
</div>
|
| 76 |
+
</div>
|
| 77 |
+
</div>
|
| 78 |
+
|
| 79 |
+
<!-- Mobile menu -->
|
| 80 |
+
<div class="sm:hidden hidden" id="mobile-menu">
|
| 81 |
+
<div class="pt-2 pb-3 space-y-1">
|
| 82 |
+
<a href="#" class="bg-emerald-50 border-emerald-500 text-emerald-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Home</a>
|
| 83 |
+
<a href="#rooms" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Rooms</a>
|
| 84 |
+
<a href="#amenities" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Amenities</a>
|
| 85 |
+
<a href="#gallery" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Gallery</a>
|
| 86 |
+
<a href="#contact" class="border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700 block pl-3 pr-4 py-2 border-l-4 text-base font-medium">Contact</a>
|
| 87 |
+
</div>
|
| 88 |
+
<div class="pt-4 pb-3 border-t border-gray-200">
|
| 89 |
+
<div class="flex items-center px-4">
|
| 90 |
+
<div class="flex-shrink-0">
|
| 91 |
+
<i data-feather="user" class="h-10 w-10 rounded-full text-gray-400"></i>
|
| 92 |
+
</div>
|
| 93 |
+
<div class="ml-3">
|
| 94 |
+
<div class="text-base font-medium text-gray-800">Guest</div>
|
| 95 |
+
</div>
|
| 96 |
+
</div>
|
| 97 |
+
<div class="mt-3 space-y-1">
|
| 98 |
+
<a href="/login" class="block px-4 py-2 text-base font-medium text-gray-500 hover:text-gray-800 hover:bg-gray-100">
|
| 99 |
+
<i data-feather="log-in" class="mr-2"></i> Login
|
| 100 |
+
</a>
|
| 101 |
+
<a href="/book" class="block px-4 py-2 text-base font-medium text-gray-500 hover:text-gray-800 hover:bg-gray-100">
|
| 102 |
+
<i data-feather="calendar" class="mr-2"></i> Book Now
|
| 103 |
+
</a>
|
| 104 |
+
</div>
|
| 105 |
+
</div>
|
| 106 |
+
</div>
|
| 107 |
+
</nav>
|
| 108 |
+
|
| 109 |
+
<!-- Hero Section -->
|
| 110 |
+
<div class="hero-section relative">
|
| 111 |
+
<div class="max-w-7xl mx-auto py-24 px-4 sm:py-32 sm:px-6 lg:px-8 text-center">
|
| 112 |
+
<h1 class="text-4xl font-extrabold tracking-tight text-white sm:text-5xl lg:text-6xl">
|
| 113 |
+
Experience Serenity by the Lake
|
| 114 |
+
</h1>
|
| 115 |
+
<p class="mt-6 text-xl text-emerald-100 max-w-3xl mx-auto">
|
| 116 |
+
Luxury accommodations with breathtaking lake views at Kudaram Lakeview Resort
|
| 117 |
+
</p>
|
| 118 |
+
<div class="mt-10">
|
| 119 |
+
<a href="/book" class="inline-flex items-center px-6 py-3 border border-transparent text-base 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">
|
| 120 |
+
<i data-feather="calendar" class="mr-2"></i> Book Your Stay
|
| 121 |
+
</a>
|
| 122 |
+
</div>
|
| 123 |
+
</div>
|
| 124 |
+
</div>
|
| 125 |
+
|
| 126 |
+
<!-- Booking Widget -->
|
| 127 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 -mt-10 z-10 relative">
|
| 128 |
+
<div class="bg-white rounded-lg shadow-lg overflow-hidden">
|
| 129 |
+
<div class="p-4">
|
| 130 |
+
<form id="booking-widget">
|
| 131 |
+
<div class="grid grid-cols-1 md:grid-cols-4 gap-4">
|
| 132 |
+
<div>
|
| 133 |
+
<label for="check-in" class="block text-sm font-medium text-gray-700">Check-in</label>
|
| 134 |
+
<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 sm:text-sm py-2 px-3 border">
|
| 135 |
+
</div>
|
| 136 |
+
<div>
|
| 137 |
+
<label for="check-out" class="block text-sm font-medium text-gray-700">Check-out</label>
|
| 138 |
+
<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 sm:text-sm py-2 px-3 border">
|
| 139 |
+
</div>
|
| 140 |
+
<div>
|
| 141 |
+
<label for="guests" class="block text-sm font-medium text-gray-700">Guests</label>
|
| 142 |
+
<select id="guests" name="guests" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-emerald-500 focus:ring-emerald-500 sm:text-sm py-2 px-3 border">
|
| 143 |
+
<option value="1">1 Adult</option>
|
| 144 |
+
<option value="2" selected>2 Adults</option>
|
| 145 |
+
<option value="3">3 Adults</option>
|
| 146 |
+
<option value="4">4 Adults</option>
|
| 147 |
+
<option value="family">Family (2+2)</option>
|
| 148 |
+
</select>
|
| 149 |
+
</div>
|
| 150 |
+
<div class="flex items-end">
|
| 151 |
+
<button type="submit" class="w-full inline-flex justify-center 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 h-10">
|
| 152 |
+
<i data-feather="search" class="mr-2"></i> Check Availability
|
| 153 |
+
</button>
|
| 154 |
+
</div>
|
| 155 |
+
</div>
|
| 156 |
+
</form>
|
| 157 |
+
</div>
|
| 158 |
+
</div>
|
| 159 |
+
</div>
|
| 160 |
+
|
| 161 |
+
<!-- Rooms Section -->
|
| 162 |
+
<section id="rooms" class="py-12 bg-white">
|
| 163 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 164 |
+
<div class="text-center">
|
| 165 |
+
<h2 class="text-3xl font-extrabold text-gray-900 sm:text-4xl">
|
| 166 |
+
Our Accommodations
|
| 167 |
+
</h2>
|
| 168 |
+
<p class="mt-3 max-w-2xl mx-auto text-xl text-gray-500 sm:mt-4">
|
| 169 |
+
Choose from our selection of luxurious rooms and suites
|
| 170 |
+
</p>
|
| 171 |
+
</div>
|
| 172 |
+
|
| 173 |
+
<div class="mt-12 grid grid-cols-1 gap-8 sm:grid-cols-2 lg:grid-cols-3">
|
| 174 |
+
<!-- Room Card 1 -->
|
| 175 |
+
<div class="room-card bg-white rounded-lg shadow-md overflow-hidden transition-all duration-300">
|
| 176 |
+
<div class="relative h-48 overflow-hidden">
|
| 177 |
+
<img class="w-full h-full object-cover" src="http://static.photos/hotel/640x360/1" alt="Deluxe Room">
|
| 178 |
+
<div class="absolute top-2 right-2 bg-emerald-600 text-white text-xs font-bold px-2 py-1 rounded">
|
| 179 |
+
Most Popular
|
| 180 |
+
</div>
|
| 181 |
+
</div>
|
| 182 |
+
<div classp-4">
|
| 183 |
+
<h3 class="text-lg font-bold text-gray-900">Deluxe Lake View</h3>
|
| 184 |
+
<div class="mt-1 flex items-center">
|
| 185 |
+
<div class="flex items-center">
|
| 186 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 187 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 188 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 189 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 190 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 191 |
+
</div>
|
| 192 |
+
<span class="ml-2 text-sm text-gray-500">24 reviews</span>
|
| 193 |
+
</div>
|
| 194 |
+
<p class="mt-2 text-sm text-gray-600">
|
| 195 |
+
Spacious room with a king-size bed and panoramic lake views. Includes complimentary breakfast.
|
| 196 |
+
</p>
|
| 197 |
+
<div class="mt-3 flex justify-between items-center">
|
| 198 |
+
<span class="text-lg font-bold text-emerald-600">₹4,500 <span class="text-sm font-normal text-gray-500 line-through">₹5,500</span></span>
|
| 199 |
+
<span class="text-xs text-gray-500">per night</span>
|
| 200 |
+
</div>
|
| 201 |
+
<div class="mt-4">
|
| 202 |
+
<a href="/book/deluxe" class="w-full inline-flex justify-center 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">
|
| 203 |
+
<i data-feather="calendar" class="mr-2"></i> Book Now
|
| 204 |
+
</a>
|
| 205 |
+
</div>
|
| 206 |
+
</div>
|
| 207 |
+
</div>
|
| 208 |
+
|
| 209 |
+
<!-- Room Card 2 -->
|
| 210 |
+
<div class="room-card bg-white rounded-lg shadow-md overflow-hidden transition-all duration-300">
|
| 211 |
+
<div class="relative h-48 overflow-hidden">
|
| 212 |
+
<img class="w-full h-full object-cover" src="http://static.photos/hotel/640x360/2" alt="Executive Suite">
|
| 213 |
+
</div>
|
| 214 |
+
<div class="p-4">
|
| 215 |
+
<h3 class="text-lg font-bold text-gray-900">Executive Suite</h3>
|
| 216 |
+
<div class="mt-1 flex items-center">
|
| 217 |
+
<div class="flex items-center">
|
| 218 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 219 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 220 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 221 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 222 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400"></i>
|
| 223 |
+
</div>
|
| 224 |
+
<span class="ml-2 text-sm text-gray-500">18 reviews</span>
|
| 225 |
+
</div>
|
| 226 |
+
<p class="mt-2 text-sm text-gray-600">
|
| 227 |
+
Elegant suite with separate living area, premium amenities, and private balcony overlooking the lake.
|
| 228 |
+
</p>
|
| 229 |
+
<div class="mt-3 flex justify-between items-center">
|
| 230 |
+
<span class="text-lg font-bold text-emerald-600">₹7,200 <span class="text-sm font-normal text-gray-500 line-through">₹8,500</span></span>
|
| 231 |
+
<span class="text-xs text-gray-500">per night</span>
|
| 232 |
+
</div>
|
| 233 |
+
<div class="mt-4">
|
| 234 |
+
<a href="/book/executive" class="w-full inline-flex justify-center 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">
|
| 235 |
+
<i data-feather="calendar" class="mr-2"></i> Book Now
|
| 236 |
+
</a>
|
| 237 |
+
</div>
|
| 238 |
+
</div>
|
| 239 |
+
</div>
|
| 240 |
+
|
| 241 |
+
<!-- Room Card 3 -->
|
| 242 |
+
<div class="room-card bg-white rounded-lg shadow-md overflow-hidden transition-all duration-300">
|
| 243 |
+
<div class="relative h-48 overflow-hidden">
|
| 244 |
+
<img class="w-full h-full object-cover" src="http://static.photos/hotel/640x360/3" alt="Family Suite">
|
| 245 |
+
<div class="absolute top-2 right-2 bg-blue-600 text-white text-xs font-bold px-2 py-1 rounded">
|
| 246 |
+
Family Favorite
|
| 247 |
+
</div>
|
| 248 |
+
</div>
|
| 249 |
+
<div class="p-4">
|
| 250 |
+
<h3 class="text-lg font-bold text-gray-900">Family Suite</h3>
|
| 251 |
+
<div class="mt-1 flex items-center">
|
| 252 |
+
<div class="flex items-center">
|
| 253 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 254 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 255 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 256 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 257 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 258 |
+
</div>
|
| 259 |
+
<span class="ml-2 text-sm text-gray-500">32 reviews</span>
|
| 260 |
+
</div>
|
| 261 |
+
<p class="mt-2 text-sm text-gray-600">
|
| 262 |
+
Spacious two-bedroom suite perfect for families, with child-friendly amenities and lake access.
|
| 263 |
+
</p>
|
| 264 |
+
<div class="mt-3 flex justify-between items-center">
|
| 265 |
+
<span class="text-lg font-bold text-emerald-600">₹9,800 <span class="text-sm font-normal text-gray-500 line-through">₹11,500</span></span>
|
| 266 |
+
<span class="text-xs text-gray-500">per night</span>
|
| 267 |
+
</div>
|
| 268 |
+
<div class="mt-4">
|
| 269 |
+
<a href="/book/family" class="w-full inline-flex justify-center 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">
|
| 270 |
+
<i data-feather="calendar" class="mr-2"></i> Book Now
|
| 271 |
+
</a>
|
| 272 |
+
</div>
|
| 273 |
+
</div>
|
| 274 |
+
</div>
|
| 275 |
+
</div>
|
| 276 |
+
|
| 277 |
+
<div class="mt-8 text-center">
|
| 278 |
+
<a href="/rooms" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-emerald-700 bg-emerald-100 hover:bg-emerald-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-emerald-500">
|
| 279 |
+
View All Rooms <i data-feather="arrow-right" class="ml-2"></i>
|
| 280 |
+
</a>
|
| 281 |
+
</div>
|
| 282 |
+
</div>
|
| 283 |
+
</section>
|
| 284 |
+
|
| 285 |
+
<!-- Amenities Section -->
|
| 286 |
+
<section id="amenities" class="py-12 bg-gray-50">
|
| 287 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 288 |
+
<div class="text-center">
|
| 289 |
+
<h2 class="text-3xl font-extrabold text-gray-900 sm:text-4xl">
|
| 290 |
+
Resort Amenities
|
| 291 |
+
</h2>
|
| 292 |
+
<p class="mt-3 max-w-2xl mx-auto text-xl text-gray-500 sm:mt-4">
|
| 293 |
+
Enjoy our premium facilities during your stay
|
| 294 |
+
</p>
|
| 295 |
+
</div>
|
| 296 |
+
|
| 297 |
+
<div class="mt-12 grid grid-cols-2 gap-8 md:grid-cols-4">
|
| 298 |
+
<div class="text-center">
|
| 299 |
+
<div class="flex items-center justify-center h-12 w-12 rounded-md bg-emerald-500 text-white mx-auto">
|
| 300 |
+
<i data-feather="wifi"></i>
|
| 301 |
+
</div>
|
| 302 |
+
<h3 class="mt-2 text-lg font-medium text-gray-900">Free WiFi</h3>
|
| 303 |
+
<p class="mt-1 text-sm text-gray-500">
|
| 304 |
+
High-speed internet throughout the property
|
| 305 |
+
</p>
|
| 306 |
+
</div>
|
| 307 |
+
<div class="text-center">
|
| 308 |
+
<div class="flex items-center justify-center h-12 w-12 rounded-md bg-emerald-500 text-white mx-auto">
|
| 309 |
+
<i data-feather="coffee"></i>
|
| 310 |
+
</div>
|
| 311 |
+
<h3 class="mt-2 text-lg font-medium text-gray-900">Breakfast</h3>
|
| 312 |
+
<p class="mt-1 text-sm text-gray-500">
|
| 313 |
+
Complimentary breakfast buffet
|
| 314 |
+
</p>
|
| 315 |
+
</div>
|
| 316 |
+
<div class="text-center">
|
| 317 |
+
<div class="flex items-center justify-center h-12 w-12 rounded-md bg-emerald-500 text-white mx-auto">
|
| 318 |
+
<i data-feather="droplet"></i>
|
| 319 |
+
</div>
|
| 320 |
+
<h3 class="mt-2 text-lg font-medium text-gray-900">Pool</h3>
|
| 321 |
+
<p class="mt-1 text-sm text-gray-500">
|
| 322 |
+
Infinity pool with lake views
|
| 323 |
+
</p>
|
| 324 |
+
</div>
|
| 325 |
+
<div class="text-center">
|
| 326 |
+
<div class="flex items-center justify-center h-12 w-12 rounded-md bg-emerald-500 text-white mx-auto">
|
| 327 |
+
<i data-feather="umbrella"></i>
|
| 328 |
+
</div>
|
| 329 |
+
<h3 class="mt-2 text-lg font-medium text-gray-900">Spa</h3>
|
| 330 |
+
<p class="mt-1 text-sm text-gray-500">
|
| 331 |
+
Lakeside spa treatments
|
| 332 |
+
</p>
|
| 333 |
+
</div>
|
| 334 |
+
<div class="text-center">
|
| 335 |
+
<div class="flex items-center justify-center h-12 w-12 rounded-md bg-emerald-500 text-white mx-auto">
|
| 336 |
+
<i data-feather="bicycle"></i>
|
| 337 |
+
</div>
|
| 338 |
+
<h3 class="mt-2 text-lg font-medium text-gray-900">Activities</h3>
|
| 339 |
+
<p class="mt-1 text-sm text-gray-500">
|
| 340 |
+
Kayaking, cycling & more
|
| 341 |
+
</p>
|
| 342 |
+
</div>
|
| 343 |
+
<div class="text-center">
|
| 344 |
+
<div class="flex items-center justify-center h-12 w-12 rounded-md bg-emerald-500 text-white mx-auto">
|
| 345 |
+
<i data-feather="parking-square"></i>
|
| 346 |
+
</div>
|
| 347 |
+
<h3 class="mt-2 text-lg font-medium text-gray-900">Parking</h3>
|
| 348 |
+
<p class="mt-1 text-sm text-gray-500">
|
| 349 |
+
Complimentary secured parking
|
| 350 |
+
</p>
|
| 351 |
+
</div>
|
| 352 |
+
<div class="text-center">
|
| 353 |
+
<div class="flex items-center justify-center h-12 w-12 rounded-md bg-emerald-500 text-white mx-auto">
|
| 354 |
+
<i data-feather="heart"></i>
|
| 355 |
+
</div>
|
| 356 |
+
<h3 class="mt-2 text-lg font-medium text-gray-900">Gym</h3>
|
| 357 |
+
<p class="mt-1 text-sm text-gray-500">
|
| 358 |
+
24/7 fitness center
|
| 359 |
+
</p>
|
| 360 |
+
</div>
|
| 361 |
+
<div class="text-center">
|
| 362 |
+
<div class="flex items-center justify-center h-12 w-12 rounded-md bg-emerald-500 text-white mx-auto">
|
| 363 |
+
<i data-feather="users"></i>
|
| 364 |
+
</div>
|
| 365 |
+
<h3 class="mt-2 text-lg font-medium text-gray-900">Concierge</h3>
|
| 366 |
+
<p class="mt-1 text-sm text-gray-500">
|
| 367 |
+
24-hour front desk
|
| 368 |
+
</p>
|
| 369 |
+
</div>
|
| 370 |
+
</div>
|
| 371 |
+
</div>
|
| 372 |
+
</section>
|
| 373 |
+
|
| 374 |
+
<!-- Gallery Section -->
|
| 375 |
+
<section id="gallery" class="py-12 bg-white">
|
| 376 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 377 |
+
<div class="text-center">
|
| 378 |
+
<h2 class="text-3xl font-extrabold text-gray-900 sm:text-4xl">
|
| 379 |
+
Gallery
|
| 380 |
+
</h2>
|
| 381 |
+
<p class="mt-3 max-w-2xl mx-auto text-xl text-gray-500 sm:mt-4">
|
| 382 |
+
Explore our resort through these beautiful moments
|
| 383 |
+
</p>
|
| 384 |
+
</div>
|
| 385 |
+
|
| 386 |
+
<div class="mt-12 grid grid-cols-2 gap-4 sm:grid-cols-3 lg:grid-cols-4">
|
| 387 |
+
<div class="group relative">
|
| 388 |
+
<img class="w-full h-48 object-cover rounded-lg" src="http://static.photos/hotel/640x360/4" alt="Resort Lobby">
|
| 389 |
+
<div class="absolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-30 transition-all duration-300 rounded-lg flex items-center justify-center">
|
| 390 |
+
<i data-feather="zoom-in" class="text-white opacity-0 group-hover:opacity-100 transition-all duration-300"></i>
|
| 391 |
+
</div>
|
| 392 |
+
</div>
|
| 393 |
+
<div class="group relative">
|
| 394 |
+
<img class="w-full h-48 object-cover rounded-lg" src="http://static.photos/hotel/640x360/5" alt="Lake View">
|
| 395 |
+
<div class="absolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-30 transition-all duration-300 rounded-lg flex items-center justify-center">
|
| 396 |
+
<i data-feather="zoom-in" class="text-white opacity-0 group-hover:opacity-100 transition-all duration-300"></i>
|
| 397 |
+
</div>
|
| 398 |
+
</div>
|
| 399 |
+
<div class="group relative">
|
| 400 |
+
<img class="w-full h-48 object-cover rounded-lg" src="http://static.photos/hotel/640x360/6" alt="Restaurant">
|
| 401 |
+
<div class="absolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-30 transition-all duration-300 rounded-lg flex items-center justify-center">
|
| 402 |
+
<i data-feather="zoom-in" class="text-white opacity-0 group-hover:opacity-100 transition-all duration-300"></i>
|
| 403 |
+
</div>
|
| 404 |
+
</div>
|
| 405 |
+
<div class="group relative">
|
| 406 |
+
<img class="w-full h-48 object-cover rounded-lg" src="http://static.photos/hotel/640x360/7" alt="Spa">
|
| 407 |
+
<div class="absolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-30 transition-all duration-300 rounded-lg flex items-center justify-center">
|
| 408 |
+
<i data-feather="zoom-in" class="text-white opacity-0 group-hover:opacity-100 transition-all duration-300"></i>
|
| 409 |
+
</div>
|
| 410 |
+
</div>
|
| 411 |
+
<div class="group relative">
|
| 412 |
+
<img class="w-full h-48 object-cover rounded-lg" src="http://static.photos/hotel/640x360/8" alt="Pool Area">
|
| 413 |
+
<div class="absolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-30 transition-all duration-300 rounded-lg flex items-center justify-center">
|
| 414 |
+
<i data-feather="zoom-in" class="text-white opacity-0 group-hover:opacity-100 transition-all duration-300"></i>
|
| 415 |
+
</div>
|
| 416 |
+
</div>
|
| 417 |
+
<div class="group relative">
|
| 418 |
+
<img class="w-full h-48 object-cover rounded-lg" src="http://static.photos/hotel/640x360/9" alt="Sunset View">
|
| 419 |
+
<div class="absolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-30 transition-all duration-300 rounded-lg flex items-center justify-center">
|
| 420 |
+
<i data-feather="zoom-in" class="text-white opacity-0 group-hover:opacity-100 transition-all duration-300"></i>
|
| 421 |
+
</div>
|
| 422 |
+
</div>
|
| 423 |
+
<div class="group relative">
|
| 424 |
+
<img class="w-full h-48 object-cover rounded-lg" src="http://static.photos/hotel/640x360/10" alt="Garden Area">
|
| 425 |
+
<div class="absolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-30 transition-all duration-300 rounded-lg flex items-center justify-center">
|
| 426 |
+
<i data-feather="zoom-in" class="text-white opacity-0 group-hover:opacity-100 transition-all duration-300"></i>
|
| 427 |
+
</div>
|
| 428 |
+
</div>
|
| 429 |
+
<div class="group relative">
|
| 430 |
+
<img class="w-full h-48 object-cover rounded-lg" src="http://static.photos/hotel/640x360/11" alt="Conference Room">
|
| 431 |
+
<div class="absolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-30 transition-all duration-300 rounded-lg flex items-center justify-center">
|
| 432 |
+
<i data-feather="zoom-in" class="text-white opacity-0 group-hover:opacity-100 transition-all duration-300"></i>
|
| 433 |
+
</div>
|
| 434 |
+
</div>
|
| 435 |
+
</div>
|
| 436 |
+
</div>
|
| 437 |
+
</section>
|
| 438 |
+
|
| 439 |
+
<!-- Testimonials Section -->
|
| 440 |
+
<section class="py-12 bg-emerald-50">
|
| 441 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 442 |
+
<div class="text-center">
|
| 443 |
+
<h2 class="text-3xl font-extrabold text-gray-900 sm:text-4xl">
|
| 444 |
+
Guest Reviews
|
| 445 |
+
</h2>
|
| 446 |
+
<p class="mt-3 max-w-2xl mx-auto text-xl text-gray-500 sm:mt-4">
|
| 447 |
+
What our guests say about their experience
|
| 448 |
+
</p>
|
| 449 |
+
</div>
|
| 450 |
+
|
| 451 |
+
<div class="mt-12 grid grid-cols-1 gap-8 md:grid-cols-3">
|
| 452 |
+
<div class="bg-white p-6 rounded-lg shadow">
|
| 453 |
+
<div class="flex items-center">
|
| 454 |
+
<img class="h-10 w-10 rounded-full" src="http://static.photos/people/200x200/1" alt="Guest 1">
|
| 455 |
+
<div class="ml-4">
|
| 456 |
+
<h3 class="text-sm font-medium text-gray-900">Rahul Sharma</h3>
|
| 457 |
+
<div class="flex items-center mt-1">
|
| 458 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 459 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 460 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 461 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 462 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 463 |
+
</div>
|
| 464 |
+
</div>
|
| 465 |
+
</div>
|
| 466 |
+
<p class="mt-4 text-gray-600">
|
| 467 |
+
"Absolutely stunning location with impeccable service. The lake view from our room was breathtaking. Will definitely return!"
|
| 468 |
+
</p>
|
| 469 |
+
</div>
|
| 470 |
+
<div class="bg-white p-6 rounded-lg shadow">
|
| 471 |
+
<div class="flex items-center">
|
| 472 |
+
<img class="h-10 w-10 rounded-full" src="http://static.photos/people/200x200/2" alt="Guest 2">
|
| 473 |
+
<div class="ml-4">
|
| 474 |
+
<h3 class="text-sm font-medium text-gray-900">Priya Patel</h3>
|
| 475 |
+
<div class="flex items-center mt-1">
|
| 476 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 477 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 478 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 479 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 480 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400"></i>
|
| 481 |
+
</div>
|
| 482 |
+
</div>
|
| 483 |
+
</div>
|
| 484 |
+
<p class="mt-4 text-gray-600">
|
| 485 |
+
"Perfect weekend getaway! The staff went above and beyond to make our anniversary special. Highly recommend the spa services."
|
| 486 |
+
</p>
|
| 487 |
+
</div>
|
| 488 |
+
<div class="bg-white p-6 rounded-lg shadow">
|
| 489 |
+
<div class="flex items-center">
|
| 490 |
+
<img class="h-10 w-10 rounded-full" src="http://static.photos/people/200x200/3" alt="Guest 3">
|
| 491 |
+
<div class="ml-4">
|
| 492 |
+
<h3 class="text-sm font-medium text-gray-900">Vikram Singh</h3>
|
| 493 |
+
<div class="flex items-center mt-1">
|
| 494 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 495 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 496 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 497 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 498 |
+
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
|
| 499 |
+
</div>
|
| 500 |
+
</div>
|
| 501 |
+
</div>
|
| 502 |
+
<p class="mt-4 text-gray-600">
|
| 503 |
+
"Exceptional hospitality and beautiful property. The kids loved the pool and activities. Family suite was spacious and comfortable."
|
| 504 |
+
</p>
|
| 505 |
+
</div>
|
| 506 |
+
</div>
|
| 507 |
+
</div>
|
| 508 |
+
</section>
|
| 509 |
+
|
| 510 |
+
<!-- Contact Section -->
|
| 511 |
+
<section id="contact" class="py-12 bg-white">
|
| 512 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
| 513 |
+
<div class="lg:grid lg:grid-cols-2 lg:gap-8">
|
| 514 |
+
<div>
|
| 515 |
+
<h2 class="text-3xl font-extrabold text-gray-900 sm:text-4xl">
|
| 516 |
+
Contact Us
|
| 517 |
+
</h2>
|
| 518 |
+
<p class="mt-3 text-lg text-gray-500">
|
| 519 |
+
Have questions? We're here to help with your booking and any inquiries.
|
| 520 |
+
</p>
|
| 521 |
+
<div class="mt-8">
|
| 522 |
+
<div class="flex items-start">
|
| 523 |
+
<div class="flex-shrink-0">
|
| 524 |
+
<div class="flex items-center justify-center h-12 w-12 rounded-md bg-emerald-500 text-white">
|
| 525 |
+
<i data-feather="map-pin"></i>
|
| 526 |
+
</div>
|
| 527 |
+
</div>
|
| 528 |
+
<div class="ml-4">
|
| 529 |
+
<h3 class="text-lg font-medium text-gray-900">Address</h3>
|
| 530 |
+
<p class="mt-1 text-gray-500">
|
| 531 |
+
Lakeview Road, Kudaram Village<br>
|
| 532 |
+
Kerala, India - 689123
|
| 533 |
+
</p>
|
| 534 |
+
</div>
|
| 535 |
+
</div>
|
| 536 |
+
<div class="mt-6 flex items-start">
|
| 537 |
+
<div class="flex-shrink-0">
|
| 538 |
+
<div class="flex items-center justify-center h-12 w-12 rounded-md bg-emerald-500 text-white">
|
| 539 |
+
<i data-feather="phone"></i>
|
| 540 |
+
</div>
|
| 541 |
+
</div>
|
| 542 |
+
<div class="ml-4">
|
| 543 |
+
<h3 class="text-lg font-medium text-gray-900">Phone</h3>
|
| 544 |
+
<p class="mt-1 text-gray-500">
|
| 545 |
+
+91 98765 43210<br>
|
| 546 |
+
+91 980 765 4321 (24/7 Support)
|
| 547 |
+
</p>
|
| 548 |
+
</div>
|
| 549 |
+
</div>
|
| 550 |
+
<div class="mt-6 flex items-start">
|
| 551 |
+
<div class="flex-shrink-0">
|
| 552 |
+
<div class="flex items-center justify-center h-12 w-12 rounded-md bg-emerald-500 text-white">
|
| 553 |
+
<i data-feather="mail"></i>
|
| 554 |
+
</div>
|
| 555 |
+
</div>
|
| 556 |
+
<div class="ml-4">
|
| 557 |
+
<h3 class="text-lg font-medium text-gray-900">Email</h3>
|
| 558 |
+
<p class="mt-1 text-gray-500">
|
| 559 |
+
reservations@kudaramlakeview.com<br>
|
| 560 |
+
info@kudaramlakeview.com
|
| 561 |
+
</p>
|
| 562 |
+
</div>
|
| 563 |
+
</div>
|
| 564 |
+
</div>
|
| 565 |
+
</div>
|
| 566 |
+
<div class="mt-12 lg:mt-0">
|
| 567 |
+
<div class="bg-white py-8 px-6 shadow rounded-lg sm:px-10">
|
| 568 |
+
<form id="contact-form" class="mb-0 space-y-6">
|
| 569 |
+
<div>
|
| 570 |
+
<label for="name" class="block text-sm font-medium text-gray-700">Full Name</label>
|
| 571 |
+
<div class="mt-1">
|
| 572 |
+
<input id="name" name="name" type="text" required class="w-full border border-gray-300 rounded-md shadow-sm py-2 px-3 focus:outline-none focus:ring-emerald-500 focus:border-emerald-500">
|
| 573 |
+
</div>
|
| 574 |
+
</div>
|
| 575 |
+
<div>
|
| 576 |
+
<label for="email" class="block text-sm font-medium text-gray-700">Email Address</label>
|
| 577 |
+
<div class="mt-1">
|
| 578 |
+
<input id="email" name="email" type="email" required class="w-full border border-gray-300 rounded-md shadow-sm py-2 px-3 focus:outline-none focus:ring-emerald-500 focus:border-emerald-500">
|
| 579 |
+
</div>
|
| 580 |
+
</div>
|
| 581 |
+
<div>
|
| 582 |
+
<label for="phone" class="block text-sm font-medium text-gray-700">Phone Number</label>
|
| 583 |
+
<div class="mt-1">
|
| 584 |
+
<input id="phone" name="phone" type="tel" class="w-full border border-gray-300 rounded-md shadow-sm py-2 px-3 focus:outline-none focus:ring-emerald-500 focus:border-emerald-500">
|
| 585 |
+
</div>
|
| 586 |
+
</div>
|
| 587 |
+
<div>
|
| 588 |
+
<label for="message" class="block text-sm font-medium text-gray-700">Message</label>
|
| 589 |
+
<div class="mt-1">
|
| 590 |
+
<textarea id="message" name="message" rows="4" required class="w-full border border-gray-300 rounded-md shadow-sm py-2 px-3 focus:outline-none focus:ring-emerald-500 focus:border-emerald-500"></textarea>
|
| 591 |
+
</div>
|
| 592 |
+
</div>
|
| 593 |
+
<div>
|
| 594 |
+
<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">
|
| 595 |
+
Send Message
|
| 596 |
+
</button>
|
| 597 |
+
</div>
|
| 598 |
+
</form>
|
| 599 |
+
</div>
|
| 600 |
+
</div>
|
| 601 |
+
</div>
|
| 602 |
+
</div>
|
| 603 |
+
</section>
|
| 604 |
+
|
| 605 |
+
<!-- Map Section -->
|
| 606 |
+
<div class="bg-gray-100">
|
| 607 |
+
<div class="max-w-7xl mx-auto">
|
| 608 |
+
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d7866.473463076284!2d76.6553853!3d9.9917435!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3b080d514abec6bf%3A0xbd582caa5844192!2sKochi%2C%20Kerala!5e0!3m2!1sen!2sin!4v1624452345678!5m2!1sen!2sin" width="100%" height="450" style="border:0;" allowfullscreen="" loading="lazy"></iframe>
|
| 609 |
+
</div>
|
| 610 |
+
</div>
|
| 611 |
+
|
| 612 |
+
<!-- Newsletter Section -->
|
| 613 |
+
<section class="py-12 bg-emerald-600">
|
| 614 |
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
|
| 615 |
+
<h2 class="text-3xl font-extrabold text-white sm:text-4xl">
|
| 616 |
+
Stay Updated
|
| 617 |
+
</h2>
|
| 618 |
+
<p class="mt-3 max-w-2xl mx-auto text-xl text-emerald-100 sm:mt-4">
|
| 619 |
+
Subscribe to our newsletter for special offers and updates
|
| 620 |
+
</p>
|
| 621 |
+
<form class="mt-8 sm:flex justify-center">
|
| 622 |
+
<div class="w-full sm:max-w-xs">
|
| 623 |
+
<label for="email" class="sr-only">Email address</label>
|
| 624 |
+
<input id="email" name="email" type="email" required class="w-full px-5 py-3 placeholder-gray-500 rounded-md border border-transparent focus:outline-none focus:ring-2 focus:ring-white focus:border-transparent" placeholder="Enter your email">
|
| 625 |
+
</div>
|
| 626 |
+
<div class="mt-3 sm:mt-0 sm:ml-3">
|
| 627 |
+
<button type="submit" class="w-full flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md text-emerald-600 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-emerald-500">
|
| 628 |
+
Subscribe
|
| 629 |
+
<i data-feather="arrow-right" class="ml-2"></i>
|
| 630 |
+
</button>
|
| 631 |
+
</div>
|
| 632 |
+
</form>
|
| 633 |
+
</div>
|
| 634 |
+
</section>
|
| 635 |
+
|
| 636 |
+
<!-- Footer -->
|
| 637 |
+
<footer class="bg-gray-900 text-white">
|
| 638 |
+
<div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:px-8">
|
| 639 |
+
<div class="grid grid-cols-2 md:grid-cols-4 gap-8">
|
| 640 |
+
<div>
|
| 641 |
+
<h3 class="text-lg font-semibold text-emerald-400 mb-4">Kudaram Lakeview</h3>
|
| 642 |
+
<p class="text-sm text-gray-300">
|
| 643 |
+
Luxury lakeside accommodations with world-class amenities and breathtaking views.
|
| 644 |
+
</p>
|
| 645 |
+
<div class="mt-4 flex space-x-4">
|
| 646 |
+
<a href="#" class="text-gray-300 hover:text-emerald-400">
|
| 647 |
+
<i data-feather="facebook"></i>
|
| 648 |
+
</a>
|
| 649 |
+
<a href="#" class="text-gray-300 hover:text-emerald-400">
|
| 650 |
+
<i data-feather="twitter"></i>
|
| 651 |
+
</a>
|
| 652 |
+
<a href="#" class="text-gray-300 hover:text-emerald-400">
|
| 653 |
+
<i data-feather="instagram"></i>
|
| 654 |
+
</a>
|
| 655 |
+
<a href="#" class="text-gray-300 hover:text-emerald-400">
|
| 656 |
+
<i data-feather="youtube"></i>
|
| 657 |
+
</a>
|
| 658 |
+
</div>
|
| 659 |
+
</div>
|
| 660 |
+
<div>
|
| 661 |
+
<h3 class="text-lg font-semibold text-emerald-400 mb-4">Quick Links</h3>
|
| 662 |
+
<div class="space-y-2">
|
| 663 |
+
<a href="/" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Home</a>
|
| 664 |
+
<a href="/rooms" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Rooms</a>
|
| 665 |
+
<a href="/amenities" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Amenities</a>
|
| 666 |
+
<a href="/gallery" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Gallery</a>
|
| 667 |
+
<a href="/contact" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Contact Us</a>
|
| 668 |
+
</div>
|
| 669 |
+
</div>
|
| 670 |
+
<div>
|
| 671 |
+
<h3 class="text-lg font-semibold text-emerald-400 mb-4">Support</h3>
|
| 672 |
+
<div class="space-y-2">
|
| 673 |
+
<a href="/faq" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">FAQs</a>
|
| 674 |
+
<a href="/privacy" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Privacy Policy</a>
|
| 675 |
+
<a href="/terms" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Terms & Conditions</a>
|
| 676 |
+
<a href="/cancellation" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Cancellation Policy</a>
|
| 677 |
+
<a href="/refund" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Refund Policy</a>
|
| 678 |
+
</div>
|
| 679 |
+
</div>
|
| 680 |
+
<div>
|
| 681 |
+
<h3 class="text-lg font-semibold text-emerald-400 mb-4">Policies & Legal</h3>
|
| 682 |
+
<div class="space-y-2">
|
| 683 |
+
<a href="https://merchant.razorpay.com/policy/RHSQRQpD2SXE5U/refund" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Cancellation & Refunds</a>
|
| 684 |
+
<a href="https://merchant.razorpay.com/policy/RHSQRQpD2SXE5U/terms" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Terms and Conditions</a>
|
| 685 |
+
<a href="https://merchant.razorpay.com/policy/RHSQRQpD2SXE5U/shipping" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Shipping</a>
|
| 686 |
+
<a href="https://merchant.razorpay.com/policy/RHSQRQpD2SXE5U/privacy" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Privacy</a>
|
| 687 |
+
<a href="https://merchant.razorpay.com/policy/RHSQRQpD2SXE5U/contact_us" class="block text-gray-300 hover:text-emerald-400 transition-colors text-sm">Contact Us</a>
|
| 688 |
+
</div>
|
| 689 |
+
</div>
|
| 690 |
+
</div>
|
| 691 |
+
<div class="border-t border-gray-700 pt-8 mt-8">
|
| 692 |
+
<div class="flex flex-col md:flex-row justify-between items-center gap-4">
|
| 693 |
+
<div class="text-center md:text-left">
|
| 694 |
+
<p class="text-sm text-gray-400">
|
| 695 |
+
© 2025 Kudaram Holidays Private Limited. All Rights Reserved.
|
| 696 |
+
</p>
|
| 697 |
+
</div>
|
| 698 |
+
<div class="text-center md:text-right">
|
| 699 |
+
<p class="text-sm text-gray-400">
|
| 700 |
+
Powered by Razorpay |
|
| 701 |
+
<span class="ml-2">Last Updated: <span id="current-date"></span></span>
|
| 702 |
+
</p>
|
| 703 |
+
</div>
|
| 704 |
+
</div>
|
| 705 |
+
</div>
|
| 706 |
+
</div>
|
| 707 |
+
</footer>
|
| 708 |
+
|
| 709 |
+
<script>
|
| 710 |
+
// Initialize Vanta.js background
|
| 711 |
+
VANTA.WAVES({
|
| 712 |
+
el: "#vanta-bg",
|
| 713 |
+
mouseControls: true,
|
| 714 |
+
touchControls: true,
|
| 715 |
+
gyroControls: false,
|
| 716 |
+
minHeight: 200.00,
|
| 717 |
+
minWidth: 200.00,
|
| 718 |
+
scale: 1.00,
|
| 719 |
+
scaleMobile: 1.00,
|
| 720 |
+
color: 0x10b981,
|
| 721 |
+
shininess: 20.00,
|
| 722 |
+
waveHeight: 15.00,
|
| 723 |
+
waveSpeed: 0.75,
|
| 724 |
+
zoom: 0.65
|
| 725 |
+
});
|
| 726 |
+
|
| 727 |
+
// Set current date in footer
|
| 728 |
+
document.getElementById('current-date').textContent = new Date().toLocaleDateString('en-US', {
|
| 729 |
+
year: 'numeric',
|
| 730 |
+
month: 'long',
|
| 731 |
+
day: 'numeric'
|
| 732 |
+
});
|
| 733 |
+
|
| 734 |
+
// Mobile menu toggle
|
| 735 |
+
document.querySelector('[aria-controls="mobile-menu"]').addEventListener('click', function() {
|
| 736 |
+
const mobileMenu = document.getElementById('mobile-menu');
|
| 737 |
+
if (mobileMenu.classList.contains('hidden')) {
|
| 738 |
+
mobileMenu.classList.remove('hidden');
|
| 739 |
+
mobileMenu.classList.add('block');
|
| 740 |
+
} else {
|
| 741 |
+
mobileMenu.classList.remove('block');
|
| 742 |
+
mobileMenu.classList.add('hidden');
|
| 743 |
+
}
|
| 744 |
+
});
|
| 745 |
+
|
| 746 |
+
// Initialize feather icons
|
| 747 |
+
feather.replace();
|
| 748 |
+
|
| 749 |
+
// Booking form submission
|
| 750 |
+
document.getElementById('booking-widget').addEventListener('submit', function(e) {
|
| 751 |
+
e.preventDefault();
|
| 752 |
+
const checkIn = document.getElementById('check-in').value;
|
| 753 |
+
const checkOut = document.getElementById('check-out').value;
|
| 754 |
+
const guests = document.getElementById('guests').value;
|
| 755 |
+
|
| 756 |
+
// Redirect to booking page with parameters
|
| 757 |
+
window.location.href = `/book?checkIn=${checkIn}&checkOut=${checkOut}&guests=${guests}`;
|
| 758 |
+
});
|
| 759 |
+
|
| 760 |
+
// Contact form submission
|
| 761 |
+
document.getElementById('contact-form').addEventListener('submit', function(e) {
|
| 762 |
+
e.preventDefault();
|
| 763 |
+
alert('Thank you for your message! We will get back to you soon.');
|
| 764 |
+
this.reset();
|
| 765 |
+
});
|
| 766 |
+
</script>
|
| 767 |
+
</body>
|
| 768 |
</html>
|