Skip to content

Commit

Permalink
Fixed Booking page #77
Browse files Browse the repository at this point in the history
  • Loading branch information
@devarsheecodess
devarsheecodess committed Oct 5, 2024
1 parent b753cf9 commit 2c6be1a
Show file tree
Hide file tree
Showing 2 changed files with 138 additions and 62 deletions.
189 changes: 127 additions & 62 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,21 +5,31 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta
name="description"
content="BuddyTrail is a travel agency website that helps you pick out your holiday vacation" />
content="BuddyTrail is a travel agency website that helps you pick out your holiday vacation"
/>
<meta name="robots" content="index,follow" />
<link rel="stylesheet" href="style.css" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Pattaya&family=Poppins:wght@400;500&display=swap"
rel="stylesheet" />
rel="stylesheet"
/>
<link rel="icon" href="/icons/airplane.svg" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css" integrity="sha512-Kc323vGBEqzTmouAECnVceyQqyqdsSiqLQISBL29aUW4U/M7pSPA/gEUZQqv1cwx4OnYxTxve5UMg5GT6L4JJg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css"
integrity="sha512-Kc323vGBEqzTmouAECnVceyQqyqdsSiqLQISBL29aUW4U/M7pSPA/gEUZQqv1cwx4OnYxTxve5UMg5GT6L4JJg=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>

<title>BuddyTrail</title>
</head>
<body class="light-mode">
<button id="scrollTopBtn" class="scroll-top-btn"><i class="fa-solid fa-arrow-up"></i></button>
<button id="scrollTopBtn" class="scroll-top-btn">
<i class="fa-solid fa-arrow-up"></i>
</button>

<!-- Google Translate Button -->
<div class="translate-container">
Expand Down Expand Up @@ -261,73 +271,125 @@ <h3>Romantic Getaway</h3>
</div>
</div>
</section>

<!-- Cab or Auto Booking -->
<section id="cab-booking" class="cab-booking-section">
<h2 style="font-size: 3em; font-weight: normal; margin-left: 40px">
<section
id="cab-booking"
class="cab-booking-section"
style="
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
margin-top: 10px;
"
>
<h2
style="
font-size: 3em;
font-weight: 700;
margin-left: 40px;
margin-top: 10px;
"
>
Book a Cab or Auto
</h2>
<p style="margin-left: 40px; font-size: 1.5em">
<p style="margin-left: 40px; font-size: 1.5em; margin-bottom: 10px">
Book a cab or auto with ease
</p>

<form action="/book-cab" method="POST" style="margin-left: 40px">
<label style="font-size: 1.5em" for="pickup-location"
>Pickup Location:</label
>
<input
style="height: 29px; width: 200px"
type="text"
id="pickup-location"
name="pickup-location"
placeholder="Enter pickup location"
required /><br /><br />

<label style="font-size: 1.5em" for="drop-location"
>Drop Location:</label
>
<input
style="height: 29px; width: 200px"
type="text"
id="drop-location"
name="drop-location"
placeholder="Enter drop location"
required /><br /><br />

<label style="font-size: 1.5em" for="vehicle-type"
>Vehicle Type:</label
>
<select id="vehicle-type" name="vehicle-type" required>
<option value="cab">Cab</option>
<option value="auto">Auto</option></select
><br /><br />

<label style="font-size: 1.5em" for="travel-date">Travel Date:</label>
<input
style="height: 29px; width: 200px"
type="date"
id="travel-date"
name="travel-date"
required /><br /><br />

<label style="font-size: 1.5em" for="travel-time">Travel Time:</label>
<input
style="height: 29px; width: 200px"
type="time"
id="travel-time"
name="travel-time"
required /><br /><br />

<input
<form
action="/book-cab"
method="POST"
style="
margin-left: 40px;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
"
>
<div>
<label style="font-size: 1.5em" for="pickup-location"
>Pickup Location:</label
>
<input
style="height: 29px; width: 200px"
type="text"
id="pickup-location"
name="pickup-location"
placeholder="Enter pickup location"
required
/><br /><br />
</div>
<div>
<label style="font-size: 1.5em" for="drop-location"
>Drop Location:</label
>
<input
style="height: 29px; width: 200px"
type="text"
id="drop-location"
name="drop-location"
placeholder="Enter drop location"
required
/><br /><br />
</div>
<div style="display: flex">
<label style="font-size: 1.5em" for="vehicle-type"
>Vehicle Type:</label
>
<select id="vehicle-type" name="vehicle-type" required>
<option value="cab">Cab</option>
<option value="auto">Auto</option></select
><br /><br />
</div>

<div>
<label style="font-size: 1.5em" for="travel-date"
>Travel Date:</label
>
<input
style="height: 29px; width: 200px"
type="date"
id="travel-date"
name="travel-date"
required
/><br /><br />
</div>

<div>
<label style="font-size: 1.5em" for="travel-time"
>Travel Time:</label
>
<input
style="height: 29px; width: 200px"
type="time"
id="travel-time"
name="travel-time"
required
/><br /><br />
</div>
<button
style="
background-color: #007bff;
color: white;
border: none;
width: 200px;
border-radius: 5px;
height: 30px;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
cursor: pointer;
align-self: center;
padding: 10px;
margin-bottom: 20px;
"
type="submit"
value="Book Now" />
>
Book now
</button>
</form>
</section>

Expand Down Expand Up @@ -386,7 +448,8 @@ <h2>Explore Popular Destinations</h2>
<script
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCYcdQdpiSF7BjZl6JF_pyucrblrUCZMxc&callback=initMap"
async
defer></script>
defer
></script>

<section id="contact">
<div class="form-wrapper">
Expand Down Expand Up @@ -416,8 +479,8 @@ <h2>User Reviews and Ratings</h2>
and help fellow travelers make informed decisions.
</p>

<div class="review-form" style="margin-top: 20px;">
<h1 style="margin-bottom: 10px;">Leave a Review</h1>
<div class="review-form" style="margin-top: 20px">
<h1 style="margin-bottom: 10px">Leave a Review</h1>
<form>
<label for="name">Your Name:</label>
<input type="text" id="name" name="name" required />
Expand All @@ -441,7 +504,8 @@ <h1 style="margin-bottom: 10px;">Leave a Review</h1>
id="complaint"
name="complaint"
rows="3"
placeholder="Describe any issue with the staff here. Please explain every single detail ex:location,name of the person"></textarea>
placeholder="Describe any issue with the staff here. Please explain every single detail ex:location,name of the person"
></textarea>

<button type="submit">Submit Review</button>
</form>
Expand Down Expand Up @@ -529,7 +593,8 @@ <h2>Exclusive Deals and Offers!</h2>
out on our limited-time discounts. Plan your trip now!
</p>
<button
onclick="document.getElementById('dealsPopup').style.display = 'none'; window.location.href='#deals'">
onclick="document.getElementById('dealsPopup').style.display = 'none'; window.location.href='#deals'"
>
Check Out Deals
</button>
</div>
Expand Down
11 changes: 11 additions & 0 deletions style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -684,6 +684,17 @@ body.dark-mode {
border-color: black; /* Dark border in dark mode */
}

.cab-booking-section input, .cab-booking-section select {
width: 100%;
font-weight: 600;
padding: 20px;
height: 20px;
font-size: 15px;
margin-bottom: 15px;
border: 1px solid #ccc;
border-radius: 5px;
}

.review-item h3 {
margin: 0 0 10px;
font-size: 1.2em;
Expand Down

0 comments on commit 2c6be1a

Please sign in to comment.