From bc5f018dfd50f9a5b64837b55e1da2ce79de7fac Mon Sep 17 00:00:00 2001 From: Aditi Kuhar Date: Sat, 6 Sep 2025 12:38:19 +0530 Subject: [PATCH 1/2] Fix: header text overlapping with navbar (#71) --- client/src/App.jsx | 51 +- client/src/components/footer.jsx | 1060 ++++++++++++++++++------------ client/src/components/navbar.jsx | 297 +++++---- 3 files changed, 867 insertions(+), 541 deletions(-) diff --git a/client/src/App.jsx b/client/src/App.jsx index cf66fbd..7d855b6 100644 --- a/client/src/App.jsx +++ b/client/src/App.jsx @@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react"; import io from "socket.io-client"; import { BrowserRouter as Router, Routes, Route } from "react-router-dom"; import ScrollToTop from "./components/ScrollToTop"; -import Navbar from "./components/Navbar"; +import Navbar from "./components/navbar"; import AuthPage from "./pages/AuthPage"; import FeaturesPage from "./pages/FeaturesPage"; @@ -81,29 +81,32 @@ const App = () => { )} - - - } - /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - + {/* Offset for fixed navbar height */} +
+ + + } + /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + +
); }; diff --git a/client/src/components/footer.jsx b/client/src/components/footer.jsx index 2b8d958..b9f809b 100644 --- a/client/src/components/footer.jsx +++ b/client/src/components/footer.jsx @@ -1,446 +1,700 @@ -import React, { useState, useEffect } from "react"; -import { Bot, Home, Info, Star, Mail, Github, Twitter, Linkedin, Zap, Shield, Users, Globe } from 'lucide-react'; - -const Footer = () => { - const [mousePosition, setMousePosition] = useState({ x: 0, y: 0 }); - const [isHovered, setIsHovered] = useState(false); - - useEffect(() => { - const handleMouseMove = (e) => { - setMousePosition({ - x: (e.clientX / window.innerWidth) * 100, - y: (e.clientY / window.innerHeight) * 100, - }); - }; - - window.addEventListener('mousemove', handleMouseMove); - return () => window.removeEventListener('mousemove', handleMouseMove); - }, []); - - const navigationLinks = [ - { icon: , label: 'Home', href: '#home' }, - { icon: , label: 'About', href: '#about' }, - { icon: , label: 'Features', href: '#features' }, - { icon: , label: 'Testimonials', href: '#testimonials' }, - { icon: , label: 'Contact', href: '#contact' } - ]; - - const socialLinks = [ - { icon: , label: 'GitHub', color: 'hover:text-gray-300' }, - { icon: , label: 'Twitter', color: 'hover:text-blue-400' }, - { icon: , label: 'LinkedIn', color: 'hover:text-blue-500' }, - { icon: , label: 'Website', color: 'hover:text-green-400' } - ]; - - const features = [ - { - icon: , - title: 'Advanced AI', - desc: 'Next-gen conversational intelligence', - gradient: 'from-blue-400 to-cyan-500' - }, - { - icon: , - title: 'Lightning Fast', - desc: 'Instant responses worldwide', - gradient: 'from-yellow-400 to-orange-500' - }, - { - icon: , - title: 'Ultra Secure', - desc: 'End-to-end encryption', - gradient: 'from-green-400 to-emerald-500' - }, - { - icon: , - title: 'Global Community', - desc: 'Millions of active users', - gradient: 'from-purple-400 to-pink-500' - } - ]; - - const stats = [ - { value: '2M+', label: 'Conversations', color: 'text-cyan-400' }, - { value: '100K+', label: 'Active Users', color: 'text-purple-400' }, - { value: '99.99%', label: 'Uptime', color: 'text-green-400' }, - { value: '4.9★', label: 'User Rating', color: 'text-yellow-400' } - ]; - - return ( - - ); +
+ + Privacy Policy + + + Terms of Service + + v1.0.0 +
+ + + + +); }; export default Footer; \ No newline at end of file diff --git a/client/src/components/navbar.jsx b/client/src/components/navbar.jsx index 01d9b83..8492b53 100644 --- a/client/src/components/navbar.jsx +++ b/client/src/components/navbar.jsx @@ -1,132 +1,201 @@ -import React, { useState } from "react"; -import { - MessageCircle, - Menu, - X, - Info, - Mail, - Star, -} from "lucide-react"; - -const Navbar = ({ onLoginClick, onSignupClick }) => { - const [isMenuOpen, setIsMenuOpen] = useState(false); - const [activeItem, setActiveItem] = useState("Home"); - - const menuItems = [ - { name: "About", icon: }, - { name: "Testimonials", icon: }, - { name: "Footer", icon: }, - ]; - - // Smooth scroll - const handleScroll = (sectionId, itemName) => { - const section = document.getElementById(sectionId.toLowerCase()); - if (section) { - section.scrollIntoView({ behavior: "smooth" }); - setActiveItem(itemName); - setIsMenuOpen(false); - } - }; +// import React, { useState } from "react"; +// import { +// MessageCircle, +// Menu, +// X, +// Info, +// Mail, +// Star, +// } from "lucide-react"; + +// const Navbar = ({ onLoginClick, onSignupClick }) => { +// const [isMenuOpen, setIsMenuOpen] = useState(false); +// const [activeItem, setActiveItem] = useState("Home"); + +// const menuItems = [ +// { name: "About", icon: }, +// { name: "Testimonials", icon: }, +// { name: "Footer", icon: }, +// ]; + +// // Smooth scroll +// const handleScroll = (sectionId, itemName) => { +// const section = document.getElementById(sectionId.toLowerCase()); +// if (section) { +// section.scrollIntoView({ behavior: "smooth" }); +// setActiveItem(itemName); +// setIsMenuOpen(false); +// } +// }; + +// return ( +// +// ); +// }; + +// export default Navbar; + + +// src/components/Navbar.jsx +import React, { useState } from 'react'; +import { MessageCircle, Menu, X } from 'lucide-react'; + +// importing useNavigate +import { Link, useNavigate } from 'react-router-dom'; +export default function Navbar() { + const [menuOpen, setMenuOpen] = useState(false); + + const toggleMenu = () => setMenuOpen(!menuOpen); + + const navigate = useNavigate(); + const handleSignup = ()=>{ + navigate('/authpage'); + } return ( -