Merge pull request #501 from Swati-in/fix-darkmode-issue

Fixed the darkmode text issue and also fixed the social  sidebar of a…

aboutus.html

@@ -6,7 +6,10 @@
     <title>About Us - GamingTools</title>
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
     <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap" rel="stylesheet">
+    <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="style.css">
+    <link rel="shortcut icon" href="images/logo.png" type="image/x-icon">
     <style>
 
         body {
@@ -123,7 +126,7 @@
 
     <div class="container main-content">
         <h1>About GamingTools</h1>
-        <p class="intro">Welcome to GamingTools, your ultimate destination for premium gaming accessories. We're passionate about providing gamers with the best tools to elevate their gaming experience to new heights.</p>
+        <p class="intro" id="intro">Welcome to GamingTools, your ultimate destination for premium gaming accessories. We're passionate about providing gamers with the best tools to elevate their gaming experience to new heights.</p>
 
         <h2>Why Choose Us</h2>
 
@@ -233,17 +236,18 @@ <h2>Feedback Form</h2>
 
     <!-- SIDEBAR -->
 
+    <!-- SIDEBAR -->
     <div class="social-sidebar">
         <div class="close-btn" id="SideBar" onclick="toggleSidebar()" title="Close Sidebar">&times;</div>
-        <ul id="sidebar-content">
-            <li><a class= "facebook" href="#"><i class="fa-brands fa-meta"></i></a></li>
-            <li><a class="twitter" href="#" ><i class="fa-brands fa-x-twitter"></i></a></li>
-            <li><a class= "facebook" href="#"><i class="fa-brands fa-instagram"></i></a></li>
-            <li><a class= "facebook" href="#"><i class="fa-brands fa-youtube"></i></a></li>
-        </ul>
-    </div>
+            <ul id="sidebar-content">
+                <li><a class="facebook" href="https://www.facebook.com/"><i class="fa-brands fa-meta"></i></a></li>
+                <li><a class="twitter" href="https://x.com/"><i class="fa-brands fa-x-twitter">‌</i></a></li>
+                <li><a class="instagram" href="https://www.instagram.com/"><i class="fa-brands fa-instagram"></i></a></li>
+                <li><a class="youtube" href="https://www.youtube.com/"><i class="fa-brands fa-youtube"></i></a></li>
+            </ul>
+        </div>
     <div class="toggle-arrow" onclick="toggleSidebar()" title="Open Sidebar" style="display: none;">
-        <i class="fas fa-arrow-left"></i>
+    <i class="fas fa-arrow-left"></i>
     </div>
 
 

style.css

@@ -436,9 +436,18 @@ nav ul li.login:hover {
   letter-spacing: 1px;
 }
 
+.dark-mode h2, .dark-mode h1{
+    color: #c3c3f0;
+}
+.dark-mode .intro{
+    color: #ccc;
+}
 .dark-mode h2 {
   color: #ccc;
 }
+.dark-mode .feature p {
+    color: #000; /* Set paragraph color to black */
+}
 
 .col-1 h3 {
   font-size: 30px;