Issue#812 fixed. navbar made uniform

apu52 · Jul 4, 2024 · cf8d846 · cf8d846
1 parent 01122e3
commit cf8d846
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 15 deletions.
diff --git a/feedback.html b/feedback.html
@@ -24,23 +24,31 @@
 </head>
 
 <body>
-    <div class="nav-container">
+    <div class="nav-container" id="top">
       <nav class="newNav">
+        <img src="./img/A T logo with a white background and a square shape, connected to nature for a travel company.png"
+          style="width:30px;height:30px;border-radius:50%;">
+
         <a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
-
+        
         <ul class="navLinks">
-          <li class="link home" data-aos="fade-down"><a href="./index.html#home" target="_blank">Home</a></li>
-          <li class="link" data-aos="fade-down"><a href="./index.html#AboutUs" target="_blank">AboutUs</a></li>
-          <li class="link" data-aos="fade-down"><a href="./index.html#Destinations" target="_blank">Destinations</a></li>
-          <li class="link" data-aos="fade-down"><a href="./index.html#trip" target="_blank">Pricing</a></li>
-          <li class="link" data-aos="fade-down"><a href="./index.html#ReviewGallery" target="_blank">Trip Gallery</a></li>
-          <li class="link" data-aos="fade-down"><a href="./index.html#testimonials" target="_blank">Testimonials</a></li>
-          <li class="link" data-aos="fade-down"><a href="./index.htmlfeedback.html" target="_blank">Rate Us?</a></li>
-          <li class="link" data-aos="fade-down"><a href="./index.html#cnt-form" target="_blank">Contact Us</a></li>
-
+
+          <li class="link" data-aos=""><a href="./index.html#Home">Home</a></li>
+          <li class="link" data-aos=""><a href="./index.html#AboutUs"> AboutUs</a></li>
+          <li class="link" data-aos=""><a href="./index.html#Destinations">Destinations</a></li>
+          <li class="link" data-aos=""><a href="./index.html#trip">Pricing</a></li>
+          <li class="link" data-aos=""><a href="./index.html#ReviewGallery">Trip Gallery</a></li>
+          <li class="link" data-aos=""><a href="./index.html#testimonials">Testimonials</a></li>
+          <li class="link" data-aos=""><a href="./feedback.html">Rate Us?</a></li>
+          <li class="link" data-aos=""><a href="./index.html#cnt-form">Contact Us</a></li>
         </ul>
         <a href="newLogin.html" class="contact-btn"><button class="btn" id="btn-style" style="margin: 0;"
           data-aos="fade-down">Login/SignUp</button></a>
+        <a href="mapa.html" class="contact-btn"><button class="btn" 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" id="logout-btn" style="margin: 0; display: none;"
+            data-aos="fade-down" disabled>Log Out</button></a>
         <div class="toggle-container" data-aos="fade-down">
           <input id="themeToggle" class="toggle" type="checkbox">
         </div>

diff --git a/index.html b/index.html
@@ -198,7 +198,6 @@ <h1>TourGuide . . .</h1>
           <li class="link" data-aos=""><a href="#cnt-form">Contact Us</a></li>
         </ul>
 
-
         <a href="newLogin.html" class="contact-btn"><button class="btn login" id="btn-style"
             data-aos="fade-down">Login/SignUp</button></a>
         <a href="mapa.html" class="contact-btn"><button class="btn" id="btn-style" style="margin: 0;"

diff --git a/styles.css b/styles.css
@@ -404,7 +404,7 @@ body {
   background: linear-gradient(120deg, #1C99FE 20.69%, #7644FF 50.19%, #FD4766 79.69%);
   ;
 
-  -webkit-background-clip: text;
+  background-clip: text;
   -webkit-text-fill-color: transparent;
 }
 
@@ -505,6 +505,13 @@ body.dark-theme #send {
   text-decoration: none;
   white-space: nowrap;
 }
+
+#btn-style:hover {
+  background-color: red;
+  border-color: red;
+  color: #fff;
+}
+
 /* ensures no box or shadow for the video button */
 .btn_video {
   background: none;
@@ -627,7 +634,7 @@ header {
 /* Apply fade-down animation to the toggle container */
 .toggle-container[data-aos="fade-down"] {
   transition: opacity 500ms ease-in-out;
-  opacity: 0;
+  opacity: 1;
 }
 
 .toggle-container[data-aos="fade-down"].aos-animate {
@@ -2645,5 +2652,4 @@ body {
   }
 
 }
->