mmintel/e-tib.com
1
0
Fork 0
Code Issues Pull Requests 2 Actions 150 Packages Projects Releases Wiki Activity

fix: render map as card on references page to enable glowing border

Browse Source
This commit is contained in:
Marc Mintel
2026-05-15 21:15:57 +02:00
parent 843d61cd5d
commit 68b0ed7ba0
2 changed files with 16 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
app/[locale]/referenzen/page.tsx
View File

@@ -8,6 +8,7 @@ import { getButtonClasses, ButtonOverlay } from '@/components/ui/Button';
import { SITE_URL } from '@/lib/schema'; import { SITE_URL } from '@/lib/schema';
import Image from 'next/image'; import Image from 'next/image';
import { InteractiveGermanyMap } from '@/components/blocks/InteractiveGermanyMap'; import { InteractiveGermanyMap } from '@/components/blocks/InteractiveGermanyMap';
import { HeroSection } from '@/components/blocks/HeroSection';
import { defaultLocations } from '@/lib/map-data'; import { defaultLocations } from '@/lib/map-data';
interface PageProps { interface PageProps {
@@ -61,12 +62,21 @@ export default async function ReferenzenOverview(props: { params: Promise<{ loca
return ( return (
<div className="flex flex-col min-h-screen bg-neutral-50 pb-16 md:pb-24"> <div className="flex flex-col min-h-screen bg-neutral-50 pb-16 md:pb-24">
{/* Map Hero Section */} {/* Hero Section */}
<HeroSection
badge="Referenzen"
title="Erfolgreich umgesetzte Projekte."
subtitle="Vom Breitbandausbau bis zur komplexen 110kV-Trasse: Ein Auszug unserer bundesweiten Projekte, bei denen wir Infrastruktur für die Zukunft geschaffen haben."
alignment="center"
backgroundImage={{ url: '/assets/photos/DSC08653.JPG' }}
/>
{/* Map Section */}
<InteractiveGermanyMap <InteractiveGermanyMap
isHero={true} isHero={false}
badge="Unsere Referenzen" badge="Einsatzgebiete"
title={<>Erfolgreich umgesetzte<br/>Projekte.</>} title="Deutschlandweit für Sie im Einsatz."
description="Vom Breitbandausbau bis zur komplexen 110kV-Trasse: Ein Auszug unserer bundesweiten Projekte, bei denen wir Infrastruktur für die Zukunft geschaffen haben. Entdecken Sie unsere Standorte." description="Entdecken Sie unsere strategischen Standorte und eine Auswahl unserer deutschlandweiten Referenzprojekte."
locations={enrichedLocations} locations={enrichedLocations}
/> />

2
components/blocks/InteractiveGermanyMap.tsx
View File

@@ -45,7 +45,7 @@ export function InteractiveGermanyMap({
<div className={isHero ? "relative w-full" : "relative w-full max-w-7xl mx-auto py-16 md:py-24 px-4 sm:px-6 mt-16 md:mt-20"}> <div className={isHero ? "relative w-full" : "relative w-full max-w-7xl mx-auto py-16 md:py-24 px-4 sm:px-6 mt-16 md:mt-20"}>
<div className={`bg-[#050B14] ${isHero ? 'pt-32 pb-16 md:pt-40 md:pb-24' : 'rounded-[2.5rem] md:rounded-[3.5rem] shadow-2xl border border-white/5'} overflow-visible relative group/map`}> <div className={`bg-[#050B14] ${isHero ? 'pt-32 pb-16 md:pt-40 md:pb-24' : 'rounded-[2.5rem] md:rounded-[3.5rem] shadow-2xl border border-white/5'} overflow-visible relative group/map`}>
{/* Animated Border Glow */} {/* Animated Border Glow */}
{!isHero && <AnimatedGlossyBorder opacity={0.7} className="z-30" />} <AnimatedGlossyBorder opacity={0.7} className="z-30" />
{/* Background Effects */} {/* Background Effects */}
<div className={`absolute inset-0 bg-gradient-to-br from-[#050B14] via-[#0A1322] to-[#050B14] ${!isHero && 'rounded-[2.5rem] md:rounded-[3.5rem]'} overflow-hidden`} /> <div className={`absolute inset-0 bg-gradient-to-br from-[#050B14] via-[#0A1322] to-[#050B14] ${!isHero && 'rounded-[2.5rem] md:rounded-[3.5rem]'} overflow-hidden`} />