54 lines
1.5 KiB
TypeScript
54 lines
1.5 KiB
TypeScript
import React, { useEffect, useRef } from 'react';
|
|
import { BrowserRouter, Routes, Route, useLocation } from 'react-router-dom';
|
|
import './App.css';
|
|
import FloatingHeader from './components/floatingHeader';
|
|
import ParticlesBackground from './components/ParticlesBackground';
|
|
import Home from './pages/Home';
|
|
import About from './pages/About';
|
|
import WorkExperience from './pages/WorkExperience';
|
|
import Projects from './pages/Projects';
|
|
import Contact from './pages/Contact';
|
|
|
|
function ScrollToTop() {
|
|
const { pathname } = useLocation();
|
|
|
|
useEffect(() => {
|
|
const backgroundDiv = document.querySelector('.background');
|
|
if (backgroundDiv) {
|
|
backgroundDiv.scrollTop = 0;
|
|
}
|
|
}, [pathname]);
|
|
|
|
return null;
|
|
}
|
|
|
|
function App() {
|
|
|
|
return (
|
|
<BrowserRouter>
|
|
<ScrollToTop />
|
|
<ParticlesBackground />
|
|
<div className='background'>
|
|
<div className='verticalContentItem'>
|
|
<FloatingHeader></FloatingHeader>
|
|
<div>
|
|
<div style={{ height: "65px" }}></div>
|
|
</div>
|
|
<Routes>
|
|
<Route path="/" element={<Home />} />
|
|
<Route path="/about" element={<About />} />
|
|
<Route path="/work-experience" element={<WorkExperience />} />
|
|
<Route path="/projects" element={<Projects />} />
|
|
<Route path="/contact" element={<Contact />} />
|
|
</Routes>
|
|
<div>
|
|
<div style={{ height: "20px" }}></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</BrowserRouter>
|
|
);
|
|
}
|
|
|
|
export default App;
|