fix: implement scroll to demo section on 'Guarda la Demo' button click

The 'Guarda la Demo' (Watch Demo) button in Hero section was not working.
Now it smoothly scrolls to the InteractiveDemo section.

Changes:
- Added id='demo-interattiva' to InteractiveDemo section
- Implemented handleSecondaryCta with document.getElementById
- Used scrollIntoView with smooth behavior for better UX

Refs: User feedback - button was not functional
This commit is contained in:
Luca Sacchi Ricciardi
2026-04-03 16:22:32 +02:00
parent 04db2b30be
commit 9eb1e0ddf5
2 changed files with 5 additions and 3 deletions

View File

@@ -8,8 +8,10 @@ function App() {
}; };
const handleSecondaryCta = () => { const handleSecondaryCta = () => {
console.log('Secondary CTA clicked: Guarda Demo'); const demoSection = document.getElementById('demo-interattiva');
// TODO: Implementare logica per apertura demo if (demoSection) {
demoSection.scrollIntoView({ behavior: 'smooth' });
}
}; };
const handleNavbarCta = () => { const handleNavbarCta = () => {

View File

@@ -121,7 +121,7 @@ export const InteractiveDemo: React.FC = () => {
const selectedLogData = DEMO_LOGS.find((l) => l.id === selectedLog); const selectedLogData = DEMO_LOGS.find((l) => l.id === selectedLog);
return ( return (
<section className="w-full py-24 lg:py-32 bg-white" aria-labelledby="demo-heading"> <section id="demo-interattiva" className="w-full py-24 lg:py-32 bg-white" aria-labelledby="demo-heading">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
{/* Section Header */} {/* Section Header */}
<div className="text-center mb-16"> <div className="text-center mb-16">