diff --git a/components/home/about/about-section.tsx b/components/home/about/about-section.tsx index 7dab85a5..b3217427 100644 --- a/components/home/about/about-section.tsx +++ b/components/home/about/about-section.tsx @@ -2,12 +2,10 @@ import { m } from "framer-motion"; import { Heart } from "lucide-react"; -import Image from "next/image"; import PolandMap from "@/components/home/about/poland-map"; import PeopleGroupIcon from "@/components/icons/people-group"; import { Button } from "@/components/ui/button"; import { SlideIn } from "@/components/ui/motion/motion-components"; -import AboutImage from "@/public/hero image.png"; export default function About() { return ( @@ -34,8 +32,8 @@ export default function About() { From{" "} Poland @@ -89,29 +87,8 @@ export default function About() { {/* Image & Map Content */}
-
- {/* Animated Map Background */} +
- - - - EternalCode Team - {/* Subtle clean overlay */} -
- -
diff --git a/components/home/about/poland-map.tsx b/components/home/about/poland-map.tsx index 696a83be..1c77bd72 100644 --- a/components/home/about/poland-map.tsx +++ b/components/home/about/poland-map.tsx @@ -1,26 +1,143 @@ import { m } from "framer-motion"; +import { useState } from "react"; + +interface City { + id: string; + name: string; + x: number; + y: number; +} + +const CITIES: City[] = [ + { id: "waw", name: "Warszawa", x: 635, y: 410 }, + { id: "wro", name: "Wrocław", x: 305, y: 610 }, + { id: "gda", name: "Gdańsk", x: 465, y: 120 }, + { id: "szc", name: "Szczecin", x: 85, y: 230 }, + { id: "zie", name: "Zielona Góra", x: 165, y: 485 }, + { id: "glo", name: "Głogów", x: 215, y: 545 }, + { id: "wol", name: "Wołomin", x: 675, y: 390 }, + { id: "lub", name: "Lublin", x: 785, y: 545 }, + { id: "byd", name: "Bydgoszcz", x: 395, y: 260 }, + { id: "zar", name: "Żary", x: 125, y: 535 }, +]; + +const globalOffset = { x: -35, y: -25 }; export default function PolandMap() { + const [hoveredCity, setHoveredCity] = useState(null); + const MAP_DRAW_DURATION = 4; + const WAVE_START_DELAY = 2.5; + const WAVE_SPEED = 0.002; + return ( +
+ + + + + {CITIES.map((city) => { + const cityDelay = WAVE_START_DELAY + city.x * WAVE_SPEED; + + return ( + setHoveredCity(city.id)} + onLeave={() => setHoveredCity(null)} + /> + ); + })} + + +
+ ); +} + +interface CityMarkerProps { + city: City; + delay: number; + isHovered: boolean; + onHover: () => void; + onLeave: () => void; +} + +function CityMarker({ city, delay, isHovered, onHover, onLeave }: CityMarkerProps) { return ( - - - + + + + + {city.name} + + + + ); } diff --git a/components/shared/cta-section.tsx b/components/shared/cta-section.tsx index c75850ce..3c0b24f4 100644 --- a/components/shared/cta-section.tsx +++ b/components/shared/cta-section.tsx @@ -1,7 +1,7 @@ "use client"; import { Icon } from "@iconify/react"; - +import { m } from "framer-motion"; import { Button } from "@/components/ui/button"; import { SlideIn } from "@/components/ui/motion/motion-components"; @@ -11,9 +11,35 @@ export default function Cta() {
-

- Join our Community -

+ +

+ Join our Community +

+ +
+ + Pride Flag + + + + + + + +
+
+ + +

Connect with other developers, showcase your projects, and get help with EternalCode libraries. The best discussions happen on our Discord.