Merge branch 'main' of https://github.com/Dishika18/InsightSync

contact.html

@@ -23,6 +23,9 @@
     <link href="css/bootstrap-icons.css" rel="stylesheet">
 
     <link href="css/style.css" rel="stylesheet">
+
+    <!--icons cdn link-->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
     <script>
         function togglePasswordVisibility() {
             const passwordInput = document.getElementById('loginPassword');
@@ -444,6 +447,15 @@ <h6 class="site-footer-title mb-3">Information</h6>
                             info@company.com
                         </a>
                     </p>
+                    <p class="socialmedia_links">
+
+                        <a href="https://www.instagram.com/" id="social-links"><i class="fa-brands fa-instagram" ></i></a>
+                        <a href="https://x.com/i/flow/login?lang=en" id="social-links"><i class="fa-brands fa-x-twitter"></i></a>
+                        <a href="https://api.linkedin.com/login" id="social-links"><i class="fa-brands fa-linkedin"></i></a>
+                        <a href="https://github.com/login" id="social-links"><i class="fa-brands fa-github"></i></a>
+                        <a href="https://canary.discord.com/login" id="social-links"><i  class="fa-brands fa-discord"></i></a>
+
+                    </p>
                 </div>
 
                 <div class="col-lg-3 col-md-4 col-12 mt-4 mt-lg-0 ms-auto">

css/style.css

@@ -1256,7 +1256,7 @@ blockquote {
     left: 10px;
     opacity: 1;
     pointer-events: auto;
-    max-width: 155px;
+    max-width: 190px;
     margin-top: 10px;
     margin-bottom: 15px;
   }
@@ -1449,4 +1449,12 @@ blockquote {
 
 #scrollToTopBtn:hover {
     background-color: #333;
+}
+
+/* icons hover effect */
+#social-links {
+   color: #63E6BE;
+}
+#social-links :hover{
+  color:#000000;
 }