diff --git a/index.html b/index.html
index df1c6ff..27987ba 100644
--- a/index.html
+++ b/index.html
@@ -1,5 +1,5 @@
-
+
diff --git a/src/tsx/components/homepage/HomepageOverlay.tsx b/src/tsx/components/homepage/HomepageOverlay.tsx
index cc7e688..f4ea075 100644
--- a/src/tsx/components/homepage/HomepageOverlay.tsx
+++ b/src/tsx/components/homepage/HomepageOverlay.tsx
@@ -3,28 +3,47 @@ import Arrow from "../../icons/Arrow";
import HomepageOverlayIcons from "./HomepageOverlayIcons";
import WelcomeCard from "../cards/WelcomeCard";
+interface Popup {
+ label: string;
+ shortName: string;
+ description: JSX.Element;
+}
+
interface HomepageOverlayProps {
initialLoad: boolean;
isOverlayVisible: boolean;
onClose: () => void;
}
-const popups = [
+const popups: Popup[] = [
{
label: "Messung des Bewässerungsstand",
shortName: "Bewässerungsstand",
- description: "Die Bodenfeuchte um den Wurzelballen herum wird in drei (30cm, 60cm und 90cm) unterschiedlichen Bodentiefen gemessen. Daraus lässt sich erschließen, wie feucht der Boden auch in tieferen Bodenschichten ist."
+ description: (
+ <>
+ Die Bodenfeuchte um den Wurzelballen herum wird in drei (30cm, 60cm und 90cm) unterschiedlichen Bodentiefen gemessen. Daraus lässt sich erschließen, wie feucht der Boden auch in tieferen Bodenschichten ist.
+
+ ),
},
{
label: "Übertragung der Daten",
shortName: "Datenübertragung",
- description: "Die Daten werden mithilfe von öffentlichen LoRaWAN (Long Range Wide Area Network) Zugängen übermittelt."
+ description: (
+ <>
+ Die Daten werden mithilfe von öffentlichen LoRaWAN (Long Range Wide Area Network) Zugängen übermittelt.
+
+ ),
},
{
label: "Handlungsempfehlungen",
shortName: "Handlungsempfehlungen",
- description: "Die gemessenen Sensordaten werden mittels wissenschaftlichen, mathematischen Daten interpretiert und in Empfehlungen umgewandelt. Dies wird alles auf ein Dashboard dargestellt."
- }
+ description: (
+ <>
+ Die gemessenen Sensordaten werden mittels wissenschaftlichen, mathematischen Daten interpretiert und in Empfehlungen umgewandelt. Dies wird alles auf ein Dashboard dargestellt.
+ Zu den Vorteilen
+
+ ),
+ },
];
const HomepageOverlay: React.FC = ({ initialLoad, isOverlayVisible, onClose }) => {
diff --git a/src/tsx/components/sections/Advantages.tsx b/src/tsx/components/sections/Advantages.tsx
index 11b9e65..e8dec16 100644
--- a/src/tsx/components/sections/Advantages.tsx
+++ b/src/tsx/components/sections/Advantages.tsx
@@ -20,7 +20,7 @@ function Advantages() {
];
return (
-
+
Alle weiteren Funktionen und Vorteile im Überblick.
diff --git a/src/tsx/pages/ProjectPage.tsx b/src/tsx/pages/ProjectPage.tsx
index 0f721bd..171bccf 100644
--- a/src/tsx/pages/ProjectPage.tsx
+++ b/src/tsx/pages/ProjectPage.tsx
@@ -10,6 +10,16 @@ function ProjectPage() {
document.title = "Projekt | Green Ecolution | Smartes Grünflächenmanagement";
}, []);
+ useEffect(() => {
+ const hash = window.location.hash;
+ if (hash) {
+ const element = document.getElementById(hash.substring(1));
+ if (element) {
+ element.scrollIntoView({ behavior: 'smooth' });
+ }
+ }
+ }, []);
+
const heroHeadline = "Alles wissenswerte über das Projekt";
const heroDescription = "Eu elit quis eiusmod proident officia aute tempor tempor qui commodo aute qui. Excepteur id ea laboris fugiat dolor exercitation ut pariatur ut commodo non. Eu deserunt laboris dolore elit. Aliquip magna do nostrud velit esse anim do. Dolor culpa duis laboris nisi ea nulla nulla magna"