Merge pull request #10 from thughari/main

updating dev with main

Author: thughari

src/main/resources/static/index.css

@@ -1,3 +1,5 @@
+
+
 :root {
     --primary-color: #03dac6;
     --primary-hover-color: #00c1ab;
@@ -148,29 +150,72 @@ header p {
 }
 
 footer {
-    text-align: center;
-    padding: 2rem 1rem;
-    font-size: 0.9rem;
-    background-color: var(--footer-background);
-    margin-top: auto;
-    line-height: 1.5;
+  background-color: var(--footer-background);
+  color: var(--text-color);
+  text-align: center;
+  padding: 2rem 1rem;
+  font-size: 0.9rem;
+  line-height: 1.6;
+  margin-top: auto;
 }
 
 footer a {
-    color: var(--primary-color);
-    text-decoration: none;
+  color: var(--primary-color);
+  text-decoration: none;
 }
 
 footer a:hover {
-    text-decoration: underline;
+  text-decoration: underline;
 }
 
-footer .credit {
-    margin-top: 0.5rem;
+.footer-container {
+  max-width: 1100px;
+  margin: 0 auto;
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
 }
 
-footer .credit .fa-heart {
-    color: var(--danger-color);
+/* TOP SECTION: Product Hunt + Social Icons */
+.footer-top {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 1rem;
+  border-bottom: 1px solid rgba(255,255,255,0.1);
+  padding-bottom: 1rem;
+}
+
+.producthunt-badge img {
+  width: 230px;
+  height: auto;
+}
+
+/* SOCIAL ICONS */
+.social-links {
+  display: flex;
+  gap: 18px;
+}
+
+.social-links a {
+  font-size: 1.5rem;
+  color: var(--text-color);
+  transition: color 0.3s ease, transform 0.3s ease;
+}
+
+.social-links a:hover {
+  color: var(--primary-color);
+  transform: scale(1.15);
+}
+
+/* BOTTOM SECTION */
+.footer-bottom p {
+  margin: 0.3rem 0;
+}
+
+.credit .fa-heart {
+  color: var(--danger-color);
 }
 
 .modal-overlay {
@@ -315,4 +360,16 @@ footer .credit .fa-heart {
         padding: 2rem;
         max-height: none;
     }
+}
+
+@media (max-width: 768px) {
+  .footer-top {
+    flex-direction: column;
+    text-align: center;
+    border-bottom: none;
+  }
+
+  .social-links {
+    justify-content: center;
+  }
 }

src/main/resources/static/index.html

@@ -86,14 +86,43 @@ <h2>Ready to Connect?</h2>
     </main>
 
     <footer>
-        <div>© 2025 RandomChat. Built for fun. | <a href="privacy.html">Privacy Policy</a></div>
-        <div class="credit">
-            Made with <i class="fa-solid fa-heart"></i>
-            by <a href="https://thughari.github.io" target="_blank" rel="noopener noreferrer">
-                Hari Thatikonda
-            </a> and <a href="https://pawanbudati.github.io/portfolio" target="_blank" rel="noopener noreferrer">
-                Pavan Budati
-            </a>
+        <div class="footer-container">
+            <div class="footer-top">
+                <div class="producthunt-badge">
+                    <a href="https://www.producthunt.com/products/randomchat?embed=true&utm_source=badge-featured&utm_medium=badge&utm_source=badge-randomchat"
+                        target="_blank">
+                        <img src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=1008327&theme=neutral&t=1760345381317"
+                            alt="RandomChat - Meet strangers instantly, chat anonymously, connect globally | Product Hunt" />
+                    </a>
+                </div>
+    
+                <div class="social-links">
+                    <a href="https://github.com/thughari/RandomChat" target="_blank" aria-label="GitHub">
+                        <i class="fa-brands fa-github"></i>
+                    </a>
+                    <a href="https://www.linkedin.com/" target="_blank" aria-label="LinkedIn">
+                        <i class="fa-brands fa-linkedin"></i>
+                    </a>
+                    <a href="mailto:thughari3@gmail.com" aria-label="Email">
+                        <i class="fa-solid fa-envelope"></i>
+                    </a>
+                </div>
+            </div>
+    
+            <div class="footer-bottom">
+                <p>© 2025 <strong>RandomChat</strong>. Built for fun. |
+                    <a href="privacy.html">Privacy Policy</a>
+                </p>
+                <p class="credit">
+                    Made with <i class="fa-solid fa-heart"></i> by
+                    <a href="https://thughari.github.io" target="_blank" rel="noopener noreferrer">
+                        Hari Thatikonda
+                    </a> and
+                    <a href="https://pawanbudati.github.io/portfolio" target="_blank" rel="noopener noreferrer">
+                        Pavan Budati
+                    </a>
+                </p>
+            </div>
         </div>
     </footer>