Skip to content

Commit

Permalink
Merge pull request #1259 from sau-mili/main
Browse files Browse the repository at this point in the history 
feat: NavBar added to all pages
  • Loading branch information
@apu52
apu52 authored Aug 5, 2024
2 parents ecaeaef + e4852d8 commit bede2fa
Show file tree
Hide file tree
Showing 4 changed files with 632 additions and 63 deletions.
55 changes: 52 additions & 3 deletions Adventure.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,15 @@
integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<style>
.newNav{
opacity:1 !important;
translate: none !important;
rotate: none !important;
scale: none !important;
transform: none !important;
}



.top-btn {
display: none;
Expand Down Expand Up @@ -91,9 +100,9 @@
<style>
/* Toggle button styles */
.toggle-container {
position: fixed; /* Change this as needed for positioning */
top: 10px;
right: 10px;
/* position: fixed; Change this as needed for positioning */
/* top: 10px; */
/* right: 10px; */
}

.toggle {
Expand Down Expand Up @@ -148,6 +157,38 @@
background-color: #002152;
color: #ffffff;
}


@media screen and (max-width:390px) {
.nav__logo {
position: relative;
right: 1.9rem;
}

.contact-btn {
position: relative;
right: 2.5rem;
}

.toggle-container {
position: relative;
right: 2.5rem;

}

.toggle {
width: 130%;
}

.line {
width: 150%;
}

.hamburger {
position: relative;
right: 1rem;
}
}
</style>

<link href="https://cdn.jsdelivr.net/npm/[email protected]/fonts/remixicon.css" rel="stylesheet" />
Expand Down Expand Up @@ -176,6 +217,14 @@
}
</style>

<!-- sticky animation -->
<script type="text/javascript">
window.addEventListener("scroll", function () {
var header = document.querySelector("nav");
header.classList.toggle("sticky", window.scrollY > 50)
})
</script>

</head>

<body>
Expand Down
70 changes: 51 additions & 19 deletions Cultural_Exp.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,13 @@
integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<style>
.newNav{
opacity:1 !important;
translate: none !important;
rotate: none !important;
scale: none !important;
transform: none !important;
}

.top-btn {
display: none;
Expand Down Expand Up @@ -114,6 +121,14 @@
}
</style>

<!-- sticky animation -->
<script type="text/javascript">
window.addEventListener("scroll", function () {
var header = document.querySelector("nav");
header.classList.toggle("sticky", window.scrollY > 50)
})
</script>

</head>

<body>
Expand All @@ -131,33 +146,50 @@
</ul>
<a href="/index.html"><button class="btn">Contact Us</button></a>
</nav> -->
<div class="nav-container">
<nav class="newNav">
<a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
<div style="display: flex; flex-direction: row; align-items: center;">
<img src="./img/tour1.png" class="sitelogo">

<a href="#" class="nav__logo aos-init aos-animate" data-aos="fade-right">Tourguide<span>.</span></a>
</div>

<ul class="navLinks">
<li class="link" data-aos="fade-down"><a href="./index.html#Home">Home</a></li>
<li class="link" data-aos="fade-down"><a href="./index.html#AboutUs">AboutUs</a></li>
<li class="link" data-aos="fade-down"><a href="./index.html#Destinations">Destinations</a></li>
<li class="link" data-aos="fade-down"><a href="./index.html#trip">Pricing</a></li>
<li class="link" data-aos="fade-down"><a href="./index.html#testimonials">Testimonials</a></li>
<li class="link" data-aos="fade-down"><a href="./index.html#ReviewGallery">Reviews</a></li>
<li class="link" data-aos="fade-down"><a href="./feedback.html">Rate Us?</a></li>
<li class="link" data-aos="fade-down"><a href="./login.html">Login</a></li>
</ul>
<a href="./index.html#contact" class="contact-btn"><button class="btn" id="btn-style" style="margin: 0;"
data-aos="fade-down">Contact Us</button></a>
<div class="hamburger" data-aos="fade-down">
<li class="link aos-init aos-animate" id="View-link" data-aos=""><a href="mapa.html">View</a></li>
<li class="link aos-init aos-animate" id="LogIn-link" data-aos=""><a href="newLogin.html">Log In</a></li>
<li class="link aos-init aos-animate" data-aos=""><a href="#Home">Home</a></li>
<li class="link aos-init aos-animate" data-aos=""><a href="#AboutUs">About</a></li>
<li class="link dropdown aos-init aos-animate" data-aos="">
<a href="#Services" class="dropdown">Services</a>
<ul class="dropdown-menu">
<li><a href="#Destinations">Destination</a></li>
<li><a href="#trip">Prices</a></li>
<li><a href="#ReviewGallery">Trip Gallery</a></li>
<li><a href="#tourist">Tourist Guide</a></li>
<li><a href="#hotel">Hotel &amp; Resort</a></li>
</ul>
</li>
<li class="link aos-init aos-animate" data-aos=""><a href="#testimonials">Testimonial</a></li>
<li class="link aos-init aos-animate" data-aos=""><a href="feedback.html">Rate Us?</a></li>
<li class="link aos-init aos-animate" data-aos=""><a href="#cnt-form">Contact Us</a></li>
</ul>

<a href="newLogin.html" class="contact-btn" id="nav-login-btn"><button class="btn login aos-init aos-animate" id="btn-style" data-aos="fade-down" style="display: block;">Login/SignUp</button></a>
<a href="mapa.html" class="contact-btn" id="nav-view-btn"><button class="btn aos-init aos-animate" id="btn-style" style="margin: 0;" data-aos="fade-down">view <map name=""></map></button></a>

<a href="loginPage.html" class="contact-btn"><button class="btn aos-init aos-animate" id="logout-btn" style="margin: 0; display: none;" data-aos="fade-down" disabled="">Log Out</button></a>

<!-- <a href="login-modified.html" class="contact-btn"><button class="btn" id="btn-style"
style="margin: 0; box-shadow:1.5px 1.5px 6px red;" data-aos="fade-down">Login</button></a> -->

<div class="toggle-container aos-init aos-animate" data-aos="fade-down">
<input id="themeToggle" class="toggle" type="checkbox">
</div>
<div class="hamburger aos-init aos-animate" data-aos="fade-down">
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</div>
</nav>
</div>





<section class="trip" id="trip">
<div class="section__container trip__container">
Expand Down
65 changes: 50 additions & 15 deletions HoneyMoon.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,13 @@
integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<style>
.newNav{
opacity:1 !important;
translate: none !important;
rotate: none !important;
scale: none !important;
transform: none !important;
}

.top-btn {
display: none;
Expand Down Expand Up @@ -106,6 +113,13 @@
emailjs.init("WB9rAyWwwLZube-er");
})();
</script>
<!-- sticky animation -->
<script type="text/javascript">
window.addEventListener("scroll", function () {
var header = document.querySelector("nav");
header.classList.toggle("sticky", window.scrollY > 50)
})
</script>

<style>
html {
Expand All @@ -130,29 +144,50 @@
</ul>
<a href="/index.html"><button class="btn">Contact Us</button></a>
</nav> -->
<div class="nav-container">
<nav class="newNav">
<a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
<div style="display: flex; flex-direction: row; align-items: center;">
<img src="./img/tour1.png" class="sitelogo">

<a href="#" class="nav__logo aos-init aos-animate" data-aos="fade-right">Tourguide<span>.</span></a>
</div>

<ul class="navLinks">
<li class="link" data-aos="fade-down"><a href="./index.html#Home">Home</a></li>
<li class="link" data-aos="fade-down"><a href="./index.html#AboutUs">AboutUs</a></li>
<li class="link" data-aos="fade-down"><a href="./index.html#Destinations">Destinations</a></li>
<li class="link" data-aos="fade-down"><a href="./index.html#trip">Pricing</a></li>
<li class="link" data-aos="fade-down"><a href="./index.html#testimonials">Testimonials</a></li>
<li class="link" data-aos="fade-down"><a href="./index.html#ReviewGallery">Reviews</a></li>
<li class="link" data-aos="fade-down"><a href="./feedback.html">Rate Us?</a></li>
<li class="link" data-aos="fade-down"><a href="./login.html">Login</a></li>
</ul>
<a href="./index.html#contact" class="contact-btn"><button class="btn" id="btn-style" style="margin: 0;"
data-aos="fade-down">Contact Us</button></a>
<div class="hamburger" data-aos="fade-down">
<li class="link aos-init aos-animate" id="View-link" data-aos=""><a href="mapa.html">View</a></li>
<li class="link aos-init aos-animate" id="LogIn-link" data-aos=""><a href="newLogin.html">Log In</a></li>
<li class="link aos-init aos-animate" data-aos=""><a href="#Home">Home</a></li>
<li class="link aos-init aos-animate" data-aos=""><a href="#AboutUs">About</a></li>
<li class="link dropdown aos-init aos-animate" data-aos="">
<a href="#Services" class="dropdown">Services</a>
<ul class="dropdown-menu">
<li><a href="#Destinations">Destination</a></li>
<li><a href="#trip">Prices</a></li>
<li><a href="#ReviewGallery">Trip Gallery</a></li>
<li><a href="#tourist">Tourist Guide</a></li>
<li><a href="#hotel">Hotel &amp; Resort</a></li>
</ul>
</li>
<li class="link aos-init aos-animate" data-aos=""><a href="#testimonials">Testimonial</a></li>
<li class="link aos-init aos-animate" data-aos=""><a href="feedback.html">Rate Us?</a></li>
<li class="link aos-init aos-animate" data-aos=""><a href="#cnt-form">Contact Us</a></li>
</ul>

<a href="newLogin.html" class="contact-btn" id="nav-login-btn"><button class="btn login aos-init aos-animate" id="btn-style" data-aos="fade-down" style="display: block;">Login/SignUp</button></a>
<a href="mapa.html" class="contact-btn" id="nav-view-btn"><button class="btn aos-init aos-animate" id="btn-style" style="margin: 0;" data-aos="fade-down">view <map name=""></map></button></a>

<a href="loginPage.html" class="contact-btn"><button class="btn aos-init aos-animate" id="logout-btn" style="margin: 0; display: none;" data-aos="fade-down" disabled="">Log Out</button></a>

<!-- <a href="login-modified.html" class="contact-btn"><button class="btn" id="btn-style"
style="margin: 0; box-shadow:1.5px 1.5px 6px red;" data-aos="fade-down">Login</button></a> -->

<div class="toggle-container aos-init aos-animate" data-aos="fade-down">
<input id="themeToggle" class="toggle" type="checkbox">
</div>
<div class="hamburger aos-init aos-animate" data-aos="fade-down">
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</div>
</nav>
</div>
<section class="trip" id="trip">
<div class="section__container trip__container">
<h2 class="section__title">HoneyMoon Travel</h2>
Expand Down
Loading

0 comments on commit bede2fa

Please sign in to comment.