From dd2af5072259aa8533636cfe67f5f865e9e9ba03 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jos=C3=A9=20Henrique?= <jose.henrique.ivan@gmail.com>
Date: Fri, 12 Sep 2025 21:30:30 -0300
Subject: [PATCH] scroll not working for recursos

---
 src/App.tsx | 47 ++++++++++++++++++++++++++++++++++++-----------
 1 file changed, 36 insertions(+), 11 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 2e6032b..24a3c02 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,5 +1,5 @@
-import React from 'react';
-import { Routes, Route } from 'react-router-dom';
+import React, { useEffect } from 'react';
+import { Routes, Route, useLocation } from 'react-router-dom';
 import Navbar from './components/Navbar';
 import HeroSection from './components/HeroSection';
 import StatisticsSection from './components/StatisticsSection';
@@ -14,17 +14,42 @@ import MatrixBackground from './components/MatrixBackground';
 import './App.css';
 
 // HomePage component
-const HomePage: React.FC = () => (
-  <main className="flex-grow">
-    <HeroSection />
-    <div className="w-32 h-1 bg-gradient-to-r from-indigo-400 to-purple-400 mx-auto mt-12 rounded-full"></div>
-    <StatisticsSection />
-    <div className="w-32 h-1 bg-gradient-to-r from-indigo-400 to-purple-400 mx-auto mt-6 rounded-full"></div>
-    <FeaturesSection />
-  </main>
-);
+const HomePage: React.FC = () => {
+  const location = useLocation();
+
+  useEffect(() => {
+    if (location.hash) {
+      const element = document.getElementById(location.hash.substring(1));
+      if (element) {
+        element.scrollIntoView({ behavior: 'smooth' });
+      }
+    }
+  }, [location]);
+
+  return (
+    <main className="flex-grow">
+      <HeroSection />
+      <div className="w-32 h-1 bg-gradient-to-r from-indigo-400 to-purple-400 mx-auto mt-12 rounded-full"></div>
+      <StatisticsSection />
+      <div className="w-32 h-1 bg-gradient-to-r from-indigo-400 to-purple-400 mx-auto mt-6 rounded-full"></div>
+      <FeaturesSection />
+    </main>
+  );
+};
 
 function App() {
+  const location = useLocation();
+
+  useEffect(() => {
+    const segment = location.hash;
+    if (segment) {
+      const element = document.getElementById(segment.replace('#', ''));
+      if (element) {
+        element.scrollIntoView({ behavior: 'smooth', block: 'start' });
+      }
+    }
+  }, [location]);
+
   return (
     <div className="min-h-screen w-full flex flex-col relative" style={{ backgroundColor: 'transparent' }}>
       <MatrixBackground />