Novo site

geradoresfe/src/pages/Home.tsx

@@ -0,0 +1,56 @@
+import React, { useEffect } from "react";
+import PageBreadcrumb from "../components/common/PageBreadCrumb";
+import PageMeta from "../components/common/PageMeta";
+import { motion } from "framer-motion";
+import { Link, useLocation } from "react-router";
+import GenerateNIF from "./GenerateNIF";
+import GenerateNISS from "./GenerateNISS";
+import GenerateCC from "./GenerateCC";
+
+export default function Home() {
+  const location = useLocation(); // Pegando a rota atual
+
+  // Efeito para rolar até a seção correspondente ao path
+  useEffect(() => {
+    const featuresSection = document.getElementById(location.hash.substring(1));
+    if (featuresSection) {
+      featuresSection.scrollIntoView({ behavior: "smooth" });
+    }
+
+  }, [location]);
+
+  return (
+    <div className="dark:bg-gray-900">
+      <PageMeta
+        title="Home Page | FactoryId"
+        description="App to Generate"
+      />
+      <div className="bg-gray-50 min-h-screen dark:bg-gray-900 dark:text-white">
+        {/* Seção de Introdução */}
+        <section id="home" className="bg-blue-600 text-white text-center py-16 dark:bg-blue-700">
+          <h1 className="text-3xl md:text-4xl font-bold mb-4">
+            Generate Your NIF, NISS, and Cartão de Cidadão Easily
+          </h1>
+          <p className="text-lg md:text-xl max-w-2xl mx-auto">
+            Welcome to our platform where you can easily generate your NIF, NISS, and Cartão de Cidadão without the hassle. Get started now and simplify your documentation process!
+          </p>
+        </section>
+
+        {/* Seção de Funcionalidades */}
+        <section id="features" className="py-16 px-4 md:px-8">
+          <div className="max-w-6xl mx-auto grid grid-cols-1 md:grid-cols-3 gap-8">
+            <div id="nif">
+              <GenerateNIF />
+            </div>
+            <div id="niss">
+              <GenerateNISS />
+            </div>
+            <div id="cc">
+              <GenerateCC />
+            </div>
+          </div>
+        </section>
+      </div>
+    </div>
+  );
+}