diff --git a/.gitignore b/.gitignore
index 4d29575..8b91dda 100644
--- a/.gitignore
+++ b/.gitignore
@@ -17,7 +17,7 @@
.env.development.local
.env.test.local
.env.production.local
-
+.idea
npm-debug.log*
yarn-debug.log*
yarn-error.log*
diff --git a/package-lock.json b/package-lock.json
index 00cdc7d..3da5221 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -14,7 +14,7 @@
"ionicons": "^7.4.0",
"react": "^18.3.1",
"react-dom": "^18.3.1",
- "react-router-dom": "^6.26.1",
+ "react-router-dom": "^6.26.2",
"react-scripts": "^5.0.1",
"react-typing-effect": "^2.0.5",
"web-vitals": "^2.1.4"
diff --git a/package.json b/package.json
index 392acb7..4f40661 100644
--- a/package.json
+++ b/package.json
@@ -9,7 +9,7 @@
"ionicons": "^7.4.0",
"react": "^18.3.1",
"react-dom": "^18.3.1",
- "react-router-dom": "^6.26.1",
+ "react-router-dom": "^6.26.2",
"react-scripts": "^5.0.1",
"react-typing-effect": "^2.0.5",
"web-vitals": "^2.1.4"
diff --git a/src/App.js b/src/App.js
index 6e5d209..1fd42c1 100644
--- a/src/App.js
+++ b/src/App.js
@@ -5,7 +5,9 @@ import './style.css';
import './script.js';
import './preloader.js';
import './TopBar.js';
+import {BrowserRouter as Router, Route, Routes} from "react-router-dom";
import Modal from './Modal';
+import Services from "./Pages/Services/Services";
function App() {
@@ -13,7 +15,12 @@ function App() {
);
diff --git a/src/Navbar.js b/src/Navbar.js
index db303fb..15a0a37 100644
--- a/src/Navbar.js
+++ b/src/Navbar.js
@@ -1,5 +1,6 @@
import React, { useState, useEffect } from 'react';
import Modal from './Modal'; // Import the modal component
+import {useLocation} from "react-router-dom";
function Navbar() {
const [prevScrollPos, setPrevScrollPos] = useState(window.scrollY);
@@ -8,6 +9,8 @@ function Navbar() {
const [isMenuOpen, setIsMenuOpen] = useState(false);
const [isModalOpen, setIsModalOpen] = useState(false); // Modal state
+ const location = useLocation();
+
useEffect(() => {
const handleScroll = () => {
const currentScrollPos = window.scrollY;
@@ -26,6 +29,17 @@ function Navbar() {
return () => window.removeEventListener('scroll', handleScroll);
}, [prevScrollPos]);
+ // for scrolling smoothly to each relevant section in home page
+ useEffect(() =>{
+ if(location.hash){
+ const sectionId = location.hash.replace("#","");
+ const section = document.getElementById(sectionId);
+ if(section){
+ section.scrollIntoView({behavior: 'smooth'});
+ }
+ }
+ },[location]);
+
const toggleMenu = () => {
setIsMenuOpen(!isMenuOpen);
};
@@ -35,6 +49,9 @@ function Navbar() {
setIsModalOpen(!isModalOpen);
};
+ const isHomeOpen = location.pathname === '/';
+ const isServicesOpen = location.pathname === '/services';
+
return (
<>
+