Skip to content

Commit

Permalink
Fixes: #715
Browse files Browse the repository at this point in the history
MOHIT-IITP committed Oct 15, 2024

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature.
1 parent 0642734 commit cfa995c
Showing 2 changed files with 50 additions and 20 deletions.
57 changes: 39 additions & 18 deletions index.html
Original file line number Diff line number Diff line change
@@ -325,17 +325,38 @@ <h1 id="logo"><a href="#home">BuddyTrail</a></h1>
console.log('Toggle clicked'); // Log when the button is clicked
document.body.classList.toggle('dark-mode');
document.body.classList.toggle('light-mode');
const darkelem = document.querySelectorAll('#darkbtn');
const h1dark = document.querySelectorAll('#h1darkbtn');
const cardbtn = document.querySelectorAll('#btn a');

if (document.body.classList.contains('dark-mode')) {
console.log('Switching to dark mode');
sunIcon.style.display = 'none'; // Hide sun icon
moonIcon.style.display = 'inline-block'; // Show moon icon
localStorage.setItem('theme', 'dark');
} else {
darkelem.forEach((elem) =>{
elem.style.color = 'white';
})
cardbtn.forEach((elem) =>{
elem.style.color = 'white';
})
h1dark.forEach((darkbtn) =>{
darkbtn.style.color='#FFA500'
})
} else {
console.log('Switching to light mode');
sunIcon.style.display = 'inline-block'; // Show sun icon
moonIcon.style.display = 'none'; // Hide moon icon
localStorage.setItem('theme', 'light');
darkelem.forEach((elem) =>{
elem.style.color = 'gray';
})
h1dark.forEach((darkbtn) =>{
darkbtn.style.color='#0057B3'
})
cardbtn.forEach((elem) =>{
elem.style.color = 'black';
})
}
});
});
@@ -599,8 +620,8 @@ <h3>Wildlife Safari in Kenya</h3>

<!-- travel itineraries -->
<section id="itineraries" class="itineraries-section">
<h2>Travel Itineraries</h2>
<p>
<h2 id="h1darkbtn">Travel Itineraries</h2>
<p id="darkbtn">
Plan your trips effortlessly with our curated travel itineraries
tailored for different types of adventures. Whether you're planning a
family vacation, a solo adventure, or a romantic getaway, we’ve got
@@ -705,7 +726,7 @@ <h2>Book a Cab or Auto</h2>

<!-- recommendations -->
<section id="recommendations" class="recommendations-section">
<h2>Personalized Recommendations</h2>
<h2 id="h1darkbtn">Personalized Recommendations</h2>
<p>
We’ve picked these destinations, hotels, and activities just for you,
based on your preferences.
@@ -715,7 +736,7 @@ <h2>Personalized Recommendations</h2>
<!-- Example Recommendation -->
<div class="recommendation-item">
<div class="header1">
<h3>Beach Resort in Goa</h3>
<h3 id="h1darkbtn">Beach Resort in Goa</h3>
<p>
Based on your love for sunny destinations, we recommend this
beachfront resort in Goa for a perfect getaway.
@@ -727,7 +748,7 @@ <h3>Beach Resort in Goa</h3>

<div class="recommendation-item">
<div class="header2">
<h3>Cultural Tour in Rajasthan</h3>
<h3 id="h1darkbtn">Cultural Tour in Rajasthan</h3>
<p>
Explore the rich cultural heritage of Rajasthan. This tour is
highly recommended based on your interest in historical places.
@@ -739,7 +760,7 @@ <h3>Cultural Tour in Rajasthan</h3>

<div class="recommendation-item">
<div class="header1">
<h3>Adventure Trek in Himachal</h3>
<h3 id="h1darkbtn">Adventure Trek in Himachal</h3>
<p>
For the adventure lover in you, we recommend a thrilling trek in
the mountains of Himachal Pradesh.
@@ -752,7 +773,7 @@ <h3>Adventure Trek in Himachal</h3>
</section>
<!--forum Section-->
<header class="forum_1">
<h1>Travel Discussion Forum</h1>
<h1 id="h1darkbtn">Travel Discussion Forum</h1>
<nav class="hi">
<ul>
<li><a href="#destinations">Destinations</a></li>
@@ -906,7 +927,7 @@ <h2>Thank You!</h2>
</main>

<section id="testimonials" class="testimonials-section">
<h1 class="testimonials-heading">Testimonials</h1>
<h2 class="testimonials-heading" >Testimonials</h2>

<div class="testimonials-container">
<div class="header1">
@@ -952,7 +973,7 @@ <h4>Traveller</h4>
<section id="reviews" class="reviews-section">
<div class="revieww">
<div class="review-form">
<h2>Rate your experience</h2>
<h2 style="color: #0057B3;" id="h1darkbtn">Rate your experience</h2>
<p class="review-p">
Read what others have to say about their experiences with various
destinations, hotels, flights, and activities. Share your own reviews
@@ -961,13 +982,13 @@ <h2>Rate your experience</h2>

<div style="margin-top: 20px">
<form class="form" id="reviewForm">
<label for="name">Your Name:</label>
<label for="name" id="darkbtn">Your Name:</label>
<input type="text" id="name" name="name" required />

<label for="destination">Destination/Service:</label>
<label for="destination" id="darkbtn">Destination/Service:</label>
<input type="text" id="destination" name="destination" required />

<label for="rating">Rating:</label>
<label for="rating" id="darkbtn">Rating:</label>
<select id="rating" class="rating" name="rating">
<option value="5">⭐⭐⭐⭐⭐</option>
<option value="4">⭐⭐⭐⭐</option>
@@ -976,9 +997,9 @@ <h2>Rate your experience</h2>
<option value="1"></option>
</select>

<label for="review">Your Review:</label>
<label for="review" id="darkbtn">Your Review:</label>
<textarea id="review" name="review" rows="4" required></textarea>
<label for="complaint">Complaint (if any):</label>
<label for="complaint" id="darkbtn">Complaint (if any):</label>
<textarea 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>

@@ -1021,12 +1042,12 @@ <h2>Rate your experience</h2>
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script>


<footer>
<div class="footer-container">
<footer id="footer">
<div class="footer-container" id="footer">
<div class="footer-column">


<footer>
<footer id="footer">
<div class="footer-container">
<div class="footer-column">
<h3>About Us</h3>
13 changes: 11 additions & 2 deletions style.css
Original file line number Diff line number Diff line change
@@ -182,6 +182,12 @@ button {
cursor: pointer;
transition: all 0.4s ease;
}
#btn a {
color:white;
}
#btn{
background-color: gray;
}
#btn:hover {
background-color: rgba(255,255,255,0.5);
transform: scale(0.95);
@@ -861,7 +867,7 @@ textarea:focus{

/* Footer Styles */
footer {
background: linear-gradient(135deg, #343a40, #212529);
background-color:#232323;
color: #ffffff;
text-align: center;
}
@@ -881,6 +887,9 @@ footer {
margin: 10px;
}

.footer-column p{
color:white;
}

.footer-column a {
font-size: 16px;
@@ -2341,4 +2350,4 @@ body.light-mode {
100%{
transform: translateY(0px);
}
}
}

0 comments on commit cfa995c

Please sign in to comment.