Merge pull request #195 from abdulshahvez/navbar-icons

Adding icons . #190
JAYESHBATRA · May 9, 2024 · 0f9a8d0 · 0f9a8d0
2 parents 308457c + e0e0d6f
commit 0f9a8d0
Show file tree

Hide file tree

Showing 14 changed files with 315 additions and 64 deletions.
diff --git a/Pages/3D-Visualizations/index.html b/Pages/3D-Visualizations/index.html
@@ -20,17 +20,32 @@
           <a href="../../index.html" class="company-logo">
               <img src="./assets/asset 41.png" alt="company logo">
           </a>
-          <div class="nav-links" id="nav-links">
-              <ul class="nav-menu">
-                  <li><a href="../../index.html" class="hover-link">Home</a></li>
-                  <li><a href="../About-Us/index.html" class="hover-link">About Us</a></li>
-                  <li><a href="../Simulation/index.html" class="hover-link">Simulations</a></li>
-                  <li><a href="../3D-Visualizations/index.html" class="hover-link current-page">3D Visualisations</a></li>
-                  <li><a href="../Quizes/index.html" class="hover-link">Quizzes</a></li>
-                  <li><a href="../Videos/index.html" class="hover-link">Videos</a></li>
-                  <li><a href="../Doubt Engine/index.html" class="hover-link">Doubt Engine</a></li>
-              </ul>
-          </div>
+          <div class="basis-[730px] nav-links" id="nav-links">
+            <ul class="nav-menu flex items-center list-none justify-between">
+                <li><a href="../../index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                  <i class="fa-solid fa-house"  style="font-size:10px;"></i>
+                  Home</a>
+                </li>
+                <li><a href="../About-Us/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color ">
+                  <i class="fa-solid fa-building-columns" style="font-size:10px;"></i>
+                  About Us</a></li>
+                <li><a href="../Simulation/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color ">
+                  <i class="fa-solid fa-plug-circle-check" style="font-size:10px;"></i>
+                  Simulations</a></li>
+                <li><a href="../3D-Visualizations/index.html" class="text-primary_text_color transition duration-200 ease-out hover:text-accent_color current-page">
+                  <i class="fa-brands fa-unity"  style="font-size:10px;"></i>
+                  3D Visualisations</a></li>
+                <li><a href="../Quizes/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                  <i class="fa-solid fa-list-check"  style="font-size:10px;"></i>
+                  Quizzes</a></li>
+                <li><a href="../Videos/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                  <i class="fa-solid fa-video"  style="font-size:10px;"></i>
+                  Videos</a></li>
+                <li><a href="../Doubt Engine/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                  <i class="fa-solid fa-check-double" style="font-size:10px;"></i>
+                  Doubt Engine</a></li>
+            </ul>
+        </div>
           <div class="hamburger">
             <span class="bar"></span>
             <span class="bar"></span>

diff --git a/Pages/3D-Visualizations/style.css b/Pages/3D-Visualizations/style.css
@@ -307,3 +307,22 @@ footer{
   font-size: 14px;
   color: #cacdd2;
 }
+nav {
+    text-align: center;
+    }
+
+    nav ul{
+      list-style: none;
+      margin: 0 2px;
+      padding: 0;
+    }
+
+    nav li {
+       display: inline-block;
+       padding: 5px 5px;
+    }
+
+    nav a {
+      font-weight: normal;
+      font-size: .80em;
+    }
diff --git a/Pages/About-Us/index.html b/Pages/About-Us/index.html
@@ -49,13 +49,28 @@
           </a>
           <div class="basis-[730px] nav-links" id="nav-links">
               <ul class="nav-menu flex items-center list-none justify-between">
-                  <li><a href="../../index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">Home</a></li>
-                  <li><a href="../About-Us/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color current-page">About Us</a></li>
-                  <li><a href="../Simulation/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">Simulations</a></li>
-                  <li><a href="../3D-Visualizations/index.html" class="text-primary_text_color transition duration-200 ease-out hover:text-accent_color">3D Visualisations</a></li>
-                  <li><a href="../Quizes/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">Quizzes</a></li>
-                  <li><a href="../Videos/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">Videos</a></li>
-                  <li><a href="../Doubt Engine/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">Doubt Engine</a></li>
+                  <li><a href="../../index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                    <i class="fa-solid fa-house"  style="font-size:10px;"></i>
+                    Home</a>
+                  </li>
+                  <li><a href="../About-Us/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color current-page">
+                    <i class="fa-solid fa-building-columns" style="font-size:10px;"></i>
+                    About Us</a></li>
+                  <li><a href="../Simulation/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                    <i class="fa-solid fa-plug-circle-check" style="font-size:10px;"></i>
+                    Simulations</a></li>
+                  <li><a href="../3D-Visualizations/index.html" class="text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                    <i class="fa-brands fa-unity"  style="font-size:10px;"></i>
+                    3D Visualisations</a></li>
+                  <li><a href="../Quizes/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                    <i class="fa-solid fa-list-check"  style="font-size:10px;"></i>
+                    Quizzes</a></li>
+                  <li><a href="../Videos/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                    <i class="fa-solid fa-video"  style="font-size:10px;"></i>
+                    Videos</a></li>
+                  <li><a href="../Doubt Engine/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                    <i class="fa-solid fa-check-double" style="font-size:10px;"></i>
+                    Doubt Engine</a></li>
               </ul>
           </div>
           <div class="hamburger cursor-pointer">

diff --git a/Pages/About-Us/style.css b/Pages/About-Us/style.css
@@ -51,3 +51,23 @@
   transition: all 0.3s ease-in-out;
   background-color: black;
 }
+
+nav {
+    text-align: center;
+    }
+
+    nav ul{
+      list-style: none;
+      margin: 0 2px;
+      padding: 0;
+    }
+
+    nav li {
+       display: inline-block;
+       padding: 5px 5px;
+    }
+
+    nav a {
+      font-weight: normal;
+      font-size: .80em;
+    }
diff --git a/Pages/Doubt Engine/index.html b/Pages/Doubt Engine/index.html
@@ -50,13 +50,28 @@
           </a>
           <div class="basis-[730px] nav-links" id="nav-links">
             <ul class="nav-menu flex items-center list-none justify-between">
-                <li><a href="../../index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">Home</a></li>
-                <li><a href="../About-Us/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">About Us</a></li>
-                <li><a href="../Simulation/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">Simulations</a></li>
-                <li><a href="../3D-Visualizations/index.html" class="text-primary_text_color transition duration-200 ease-out hover:text-accent_color">3D Visualisations</a></li>
-                <li><a href="../Quizes/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">Quizzes</a></li>
-                <li><a href="../Videos/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">Videos</a></li>
-                <li><a href="../Doubt Engine/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color current-page">Doubt Engine</a></li>
+                <li><a href="../../index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                  <i class="fa-solid fa-house"  style="font-size:10px;"></i>
+                  Home</a>
+                </li>
+                <li><a href="../About-Us/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color ">
+                  <i class="fa-solid fa-building-columns" style="font-size:10px;"></i>
+                  About Us</a></li>
+                <li><a href="../Simulation/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                  <i class="fa-solid fa-plug-circle-check" style="font-size:10px;"></i>
+                  Simulations</a></li>
+                <li><a href="../3D-Visualizations/index.html" class="text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                  <i class="fa-brands fa-unity"  style="font-size:10px;"></i>
+                  3D Visualisations</a></li>
+                <li><a href="../Quizes/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                  <i class="fa-solid fa-list-check"  style="font-size:10px;"></i>
+                  Quizzes</a></li>
+                <li><a href="../Videos/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                  <i class="fa-solid fa-video"  style="font-size:10px;"></i>
+                  Videos</a></li>
+                <li><a href="../Doubt Engine/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color current-page">
+                  <i class="fa-solid fa-check-double" style="font-size:10px;"></i>
+                  Doubt Engine</a></li>
             </ul>
         </div>
         <div class="hamburger cursor-pointer">

diff --git a/Pages/Doubt Engine/style.css b/Pages/Doubt Engine/style.css
@@ -71,3 +71,22 @@
     box-shadow: inset 0px 0.8px 0px -0.25px rgba(255, 255, 255, 0.2), 0px 0.5px 1.5px rgba(54, 122, 246, 0.25), 0px 0px 0px 3.5px rgba(58, 108, 217, 0.5);
     outline: 0;
   }
+  nav {
+    text-align: center;
+    }
+
+    nav ul{
+      list-style: none;
+      margin: 0 2px;
+      padding: 0;
+    }
+
+    nav li {
+       display: inline-block;
+       padding: 5px 5px;
+    }
+
+    nav a {
+      font-weight: normal;
+      font-size: .80em;
+    }
diff --git a/Pages/Quizes/index.html b/Pages/Quizes/index.html
@@ -21,15 +21,31 @@
           <a href="../../index.html" class="company-logo">
               <img src="./assets/asset 41.png" alt="company logo">
           </a>
-          <div class="nav-links" id="nav-links">
-              <ul class="nav-menu">
-                  <li><a href="../../index.html" class="hover-link">Home</a></li>
-                  <li><a href="../About-Us/index.html" class="hover-link">About Us</a></li>
-                  <li><a href="../Simulation/index.html" class="hover-link">Simulations</a></li>
-                  <li><a href="../3D-Visualizations/index.html" class="hover-link">3D Visualisations</a></li>
-                  <li><a href="../Quizes/index.html" class="hover-link current-page">Quizzes</a></li>
-                  <li><a href="../Videos/index.html" class="hover-link">Videos</a></li>
-                  <li><a href="../Doubt Engine/index.html" class="hover-link">Doubt Engine</a></li>
+
+            <div class="basis-[730px] nav-links" id="nav-links">
+              <ul class="nav-menu flex items-center list-none justify-between">
+                  <li><a href="../../index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                    <i class="fa-solid fa-house"  style="font-size:10px;"></i>
+                    Home</a>
+                  </li>
+                  <li><a href="../About-Us/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color ">
+                    <i class="fa-solid fa-building-columns" style="font-size:10px;"></i>
+                    About Us</a></li>
+                  <li><a href="../Simulation/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                    <i class="fa-solid fa-plug-circle-check" style="font-size:10px;"></i>
+                    Simulations</a></li>
+                  <li><a href="../3D-Visualizations/index.html" class="text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                    <i class="fa-brands fa-unity"  style="font-size:10px;"></i>
+                    3D Visualisations</a></li>
+                  <li><a href="../Quizes/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color current-page">
+                    <i class="fa-solid fa-list-check"  style="font-size:10px;"></i>
+                    Quizzes</a></li>
+                  <li><a href="../Videos/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                    <i class="fa-solid fa-video"  style="font-size:10px;"></i>
+                    Videos</a></li>
+                  <li><a href="../Doubt Engine/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                    <i class="fa-solid fa-check-double" style="font-size:10px;"></i>
+                    Doubt Engine</a></li>
               </ul>
           </div>
           <div class="hamburger">

diff --git a/Pages/Quizes/style.css b/Pages/Quizes/style.css
@@ -343,3 +343,22 @@ footer{
   font-size: 14px;
   color: #cacdd2;
 }
+nav {
+    text-align: center;
+    }
+
+    nav ul{
+      list-style: none;
+      margin: 0 2px;
+      padding: 0;
+    }
+
+    nav li {
+       display: inline-block;
+       padding: 5px 5px;
+    }
+
+    nav a {
+      font-weight: normal;
+      font-size: .80em;
+    }
diff --git a/Pages/Simulation/index.html b/Pages/Simulation/index.html
@@ -21,17 +21,32 @@
           <a href="../../index.html" class="company-logo">
               <img src="./assets/asset 41.png" alt="company logo">
           </a>
-          <div class="nav-links" id="nav-links">
-              <ul class="nav-menu">
-                <li><a href="../../index.html" class="hover-link">Home</a></li>
-                  <li><a href="../About-Us/index.html" class="hover-link">About Us</a></li>
-                  <li><a href="../Simulation/index.html" class="hover-link current-page">Simulations</a></li>
-                  <li><a href="../3D-Visualizations/index.html" class="hover-link">3D Visualisations</a></li>
-                  <li><a href="../Quizes/index.html" class="hover-link">Quizzes</a></li>
-                  <li><a href="../Videos/index.html" class="hover-link">Videos</a></li>
-                  <li><a href="../Doubt Engine/index.html" class="hover-link">Doubt Engine</a></li>
-              </ul>
-          </div>
+          <div class="basis-[730px] nav-links" id="nav-links">
+            <ul class="nav-menu flex items-center list-none justify-between">
+                <li><a href="../../index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                  <i class="fa-solid fa-house"  style="font-size:10px;"></i>
+                  Home</a>
+                </li>
+                <li><a href="../About-Us/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color ">
+                  <i class="fa-solid fa-building-columns" style="font-size:10px;"></i>
+                  About Us</a></li>
+                <li><a href="../Simulation/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color current-page">
+                  <i class="fa-solid fa-plug-circle-check" style="font-size:10px;"></i>
+                  Simulations</a></li>
+                <li><a href="../3D-Visualizations/index.html" class="text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                  <i class="fa-brands fa-unity"  style="font-size:10px;"></i>
+                  3D Visualisations</a></li>
+                <li><a href="../Quizes/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                  <i class="fa-solid fa-list-check"  style="font-size:10px;"></i>
+                  Quizzes</a></li>
+                <li><a href="../Videos/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                  <i class="fa-solid fa-video"  style="font-size:10px;"></i>
+                  Videos</a></li>
+                <li><a href="../Doubt Engine/index.html" class="no-underline inline-block text-primary_text_color transition duration-200 ease-out hover:text-accent_color">
+                  <i class="fa-solid fa-check-double" style="font-size:10px;"></i>
+                  Doubt Engine</a></li>
+            </ul>
+        </div>
           <div class="hamburger">
             <span class="bar"></span>
             <span class="bar"></span>

diff --git a/Pages/Simulation/style.css b/Pages/Simulation/style.css
@@ -306,3 +306,22 @@ footer{
   font-size: 14px;
   color: #cacdd2;
 }
+nav {
+    text-align: center;
+    }
+
+    nav ul{
+      list-style: none;
+      margin: 0 2px;
+      padding: 0;
+    }
+
+    nav li {
+       display: inline-block;
+       padding: 5px 5px;
+    }
+
+    nav a {
+      font-weight: normal;
+      font-size: .80em;
+    }