Compare commits
No commits in common. "16e00659aadd6b5ea40ca5195d12312149f44cf5" and "96b6f6ec94a254fbf5c9e86cbff9cd879c19949f" have entirely different histories.
16e00659aa
...
96b6f6ec94
@ -50,7 +50,6 @@ import BruttoNettoRechner from "./pages/BruttoNettoRechner";
|
|||||||
import SeniorenAltersvorsorge from "./pages/SeniorenAltersvorsorge";
|
import SeniorenAltersvorsorge from "./pages/SeniorenAltersvorsorge";
|
||||||
import SeniorenGesundheitsvorsorge from "./pages/SeniorenGesundheitsvorsorge";
|
import SeniorenGesundheitsvorsorge from "./pages/SeniorenGesundheitsvorsorge";
|
||||||
import SeniorenRisikoschutz from "./pages/SeniorenRisikoschutz";
|
import SeniorenRisikoschutz from "./pages/SeniorenRisikoschutz";
|
||||||
import SeniorenSterbegeldversicherung from "./pages/SeniorenSterbegeldversicherung";
|
|
||||||
import PrivateKrankenversicherung from "./pages/PrivateKrankenversicherung";
|
import PrivateKrankenversicherung from "./pages/PrivateKrankenversicherung";
|
||||||
import Zahnzusatzversicherung from "./pages/Zahnzusatzversicherung";
|
import Zahnzusatzversicherung from "./pages/Zahnzusatzversicherung";
|
||||||
import Auslandsreisekrankenversicherung from "./pages/Auslandsreisekrankenversicherung";
|
import Auslandsreisekrankenversicherung from "./pages/Auslandsreisekrankenversicherung";
|
||||||
@ -164,7 +163,6 @@ const App = () => {
|
|||||||
<Route path="/senioren-altersvorsorge" element={<SeniorenAltersvorsorge />} />
|
<Route path="/senioren-altersvorsorge" element={<SeniorenAltersvorsorge />} />
|
||||||
<Route path="/senioren-gesundheitsvorsorge" element={<SeniorenGesundheitsvorsorge />} />
|
<Route path="/senioren-gesundheitsvorsorge" element={<SeniorenGesundheitsvorsorge />} />
|
||||||
<Route path="/senioren-risikoschutz" element={<SeniorenRisikoschutz />} />
|
<Route path="/senioren-risikoschutz" element={<SeniorenRisikoschutz />} />
|
||||||
<Route path="/senioren-sterbegeldversicherung" element={<SeniorenSterbegeldversicherung />} />
|
|
||||||
<Route path="/private-krankenversicherung" element={<PrivateKrankenversicherung />} />
|
<Route path="/private-krankenversicherung" element={<PrivateKrankenversicherung />} />
|
||||||
<Route path="/zahnzusatzversicherung" element={<Zahnzusatzversicherung />} />
|
<Route path="/zahnzusatzversicherung" element={<Zahnzusatzversicherung />} />
|
||||||
<Route path="/auslandsreisekrankenversicherung" element={<Auslandsreisekrankenversicherung />} />
|
<Route path="/auslandsreisekrankenversicherung" element={<Auslandsreisekrankenversicherung />} />
|
||||||
|
|||||||
@ -1,24 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import { AlertTriangle } from 'lucide-react';
|
|
||||||
|
|
||||||
const Disclaimer = () => {
|
|
||||||
return (
|
|
||||||
<div className="bg-amber-50/80 border border-amber-200/50">
|
|
||||||
<div className="container mx-auto px-4 py-6">
|
|
||||||
<div className="max-w-4xl mx-auto">
|
|
||||||
<div className="flex items-start gap-3">
|
|
||||||
<AlertTriangle className="w-6 h-6 text-amber-600 mt-0.5 flex-shrink-0" />
|
|
||||||
<div className="text-base text-amber-800">
|
|
||||||
<h4 className="font-semibold mb-2">Wichtiger Hinweis:</h4>
|
|
||||||
<p>
|
|
||||||
Die auf diesen Seiten enthaltenen Tipps und Informationen stellen allgemeine, unverbindliche Hinweise zu Versicherungen dar. Es handelt sich um eine private Meinungsäußerung ohne Anspruch auf Richtigkeit, Vollständigkeit oder Haftung und ersetzt keine individuelle Beratung. Maßgeblich sind ausschließlich die jeweiligen Versicherungsbedingungen des Versicherungsunternehmens.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Disclaimer;
|
|
||||||
@ -1,20 +1,18 @@
|
|||||||
import { AlertTriangle } from 'lucide-react';
|
import { AlertTriangle } from 'lucide-react';
|
||||||
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
className?: string;
|
className?: string;
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function GeneralNotice({ className }: Props) {
|
export default function GeneralNotice({ className }: Props) {
|
||||||
|
const { t } = useTranslation('common');
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={className ?? 'mt-8 rounded-md border border-amber-200 bg-amber-50/80 p-4'}>
|
<div className={className ?? 'mt-8 rounded-md border border-gray-200 bg-white p-4'}>
|
||||||
<div className="flex items-start gap-3">
|
<div className="flex items-start gap-3">
|
||||||
<AlertTriangle className="w-6 h-6 text-amber-600 mt-0.5 flex-shrink-0" />
|
<AlertTriangle className="w-5 h-5 text-[#7a0000] mt-0.5 flex-shrink-0" />
|
||||||
<div className="text-base text-amber-800 leading-relaxed">
|
<div className="text-sm text-gray-800 leading-relaxed whitespace-pre-line">{t('generalNotice.text')}</div>
|
||||||
<h4 className="font-semibold mb-2">Wichtiger Hinweis:</h4>
|
|
||||||
<p>
|
|
||||||
Die auf diesen Seiten enthaltenen Tipps und Informationen stellen allgemeine, unverbindliche Hinweise zu Versicherungen dar. Es handelt sich um eine private Meinungsäußerung ohne Anspruch auf Richtigkeit, Vollständigkeit oder Haftung und ersetzt keine individuelle Beratung. Maßgeblich sind ausschließlich die jeweiligen Versicherungsbedingungen des Versicherungsunternehmens.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
@ -3,7 +3,6 @@ import { Link } from 'react-router-dom';
|
|||||||
import { Heart, Shield, TrendingUp, PiggyBank, Home, Calculator } from 'lucide-react';
|
import { Heart, Shield, TrendingUp, PiggyBank, Home, Calculator } from 'lucide-react';
|
||||||
import Layout from '@/components/Layout';
|
import Layout from '@/components/Layout';
|
||||||
import { Card } from '@/components/ui/card';
|
import { Card } from '@/components/ui/card';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
|
|
||||||
const Altersvorsorge = () => {
|
const Altersvorsorge = () => {
|
||||||
const baseUrl = import.meta.env.BASE_URL;
|
const baseUrl = import.meta.env.BASE_URL;
|
||||||
@ -84,8 +83,6 @@ const Altersvorsorge = () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Disclaimer />
|
|
||||||
</Layout>
|
</Layout>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -10,7 +10,6 @@ import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
|||||||
import GeneralNotice from '@/components/GeneralNotice';
|
import GeneralNotice from '@/components/GeneralNotice';
|
||||||
import TwoColumnTab from '@/components/tab-pages/TwoColumnTab';
|
import TwoColumnTab from '@/components/tab-pages/TwoColumnTab';
|
||||||
import RightImageCard from '@/components/tab-pages/RightImageCard';
|
import RightImageCard from '@/components/tab-pages/RightImageCard';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
|
|
||||||
const Autoversicherung = () => {
|
const Autoversicherung = () => {
|
||||||
const { t } = useTranslation('autoversicherung');
|
const { t } = useTranslation('autoversicherung');
|
||||||
|
|||||||
@ -2,7 +2,6 @@ import { useState, useEffect } from 'react';
|
|||||||
import Layout from '@/components/Layout';
|
import Layout from '@/components/Layout';
|
||||||
import TenReasons from '@/components/TenReasons';
|
import TenReasons from '@/components/TenReasons';
|
||||||
import GeneralNotice from '@/components/GeneralNotice';
|
import GeneralNotice from '@/components/GeneralNotice';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
||||||
import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/components/ui/accordion';
|
import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/components/ui/accordion';
|
||||||
import { Mail, Phone, MapPin, Globe, TrendingUp, LineChart, CloudSun, Newspaper, ExternalLink, Star, FileText, Shield, Lock, HelpCircle, Send, User, MessageSquare, MessageCircle } from 'lucide-react';
|
import { Mail, Phone, MapPin, Globe, TrendingUp, LineChart, CloudSun, Newspaper, ExternalLink, Star, FileText, Shield, Lock, HelpCircle, Send, User, MessageSquare, MessageCircle } from 'lucide-react';
|
||||||
|
|||||||
@ -3,7 +3,6 @@ import { useEffect } from 'react';
|
|||||||
import Layout from '@/components/Layout';
|
import Layout from '@/components/Layout';
|
||||||
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
|
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
|
||||||
import { Shield, AlertTriangle, Users, Activity, FileText, Clock, CheckCircle, Phone, Mail } from 'lucide-react';
|
import { Shield, AlertTriangle, Users, Activity, FileText, Clock, CheckCircle, Phone, Mail } from 'lucide-react';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
|
|
||||||
const Datenschutz = () => {
|
const Datenschutz = () => {
|
||||||
const { t } = useTranslation('privacy');
|
const { t } = useTranslation('privacy');
|
||||||
@ -273,8 +272,6 @@ const Datenschutz = () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<Disclaimer />
|
|
||||||
</Layout>
|
</Layout>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -7,7 +7,6 @@ import GeneralNotice from '@/components/GeneralNotice';
|
|||||||
import { Button } from '@/components/ui/button';
|
import { Button } from '@/components/ui/button';
|
||||||
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
||||||
import HeroSlider from '@/components/HeroSlider';
|
import HeroSlider from '@/components/HeroSlider';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
|
|
||||||
const Finanzen = () => {
|
const Finanzen = () => {
|
||||||
const { t } = useTranslation('finanzen');
|
const { t } = useTranslation('finanzen');
|
||||||
@ -129,8 +128,6 @@ const Finanzen = () => {
|
|||||||
</section>
|
</section>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Disclaimer />
|
|
||||||
</Layout>
|
</Layout>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -4,7 +4,6 @@ import { Heart, Shield, Plane, ArrowRight } from 'lucide-react';
|
|||||||
import Layout from '@/components/Layout';
|
import Layout from '@/components/Layout';
|
||||||
import { Button } from '@/components/ui/button';
|
import { Button } from '@/components/ui/button';
|
||||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
|
|
||||||
const Gesundheitsvorsorge = () => {
|
const Gesundheitsvorsorge = () => {
|
||||||
const baseUrl = import.meta.env.BASE_URL;
|
const baseUrl = import.meta.env.BASE_URL;
|
||||||
@ -105,8 +104,6 @@ const Gesundheitsvorsorge = () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Disclaimer />
|
|
||||||
</Layout>
|
</Layout>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -4,7 +4,6 @@ import { Shield, Phone, Mail, CheckCircle, Star, Home, FileText, Calculator, Use
|
|||||||
import Layout from '@/components/Layout';
|
import Layout from '@/components/Layout';
|
||||||
import { Button } from '@/components/ui/button';
|
import { Button } from '@/components/ui/button';
|
||||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
|
|
||||||
const Hausratversicherung = () => {
|
const Hausratversicherung = () => {
|
||||||
const { t } = useTranslation('hausrat');
|
const { t } = useTranslation('hausrat');
|
||||||
@ -158,8 +157,6 @@ const Hausratversicherung = () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Disclaimer />
|
|
||||||
</Layout>
|
</Layout>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -2,7 +2,6 @@ import React from 'react';
|
|||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
import { Shield, Phone, Mail, MapPin, Building, User, Calendar, Globe, FileText } from 'lucide-react';
|
import { Shield, Phone, Mail, MapPin, Building, User, Calendar, Globe, FileText } from 'lucide-react';
|
||||||
import Layout from '@/components/Layout';
|
import Layout from '@/components/Layout';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
|
|
||||||
const Impressum = () => {
|
const Impressum = () => {
|
||||||
const { t } = useTranslation('impressum');
|
const { t } = useTranslation('impressum');
|
||||||
@ -378,8 +377,6 @@ const Impressum = () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Disclaimer />
|
|
||||||
</Layout>
|
</Layout>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -6,7 +6,6 @@ import { Button } from '@/components/ui/button';
|
|||||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
|
||||||
import { Shield, Car, Phone, Users, Award, CheckCircle, ArrowRight, Star, FileText } from 'lucide-react';
|
import { Shield, Car, Phone, Users, Award, CheckCircle, ArrowRight, Star, FileText } from 'lucide-react';
|
||||||
import HeroSlider from '@/components/HeroSlider';
|
import HeroSlider from '@/components/HeroSlider';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
|
|
||||||
const Index = () => {
|
const Index = () => {
|
||||||
const { t } = useTranslation('home');
|
const { t } = useTranslation('home');
|
||||||
@ -41,7 +40,6 @@ const Index = () => {
|
|||||||
{ title: 'Zahnzusatzversicherung', href: '/zahnzusatzversicherung', image: import.meta.env.BASE_URL + encodeURI('Fotolia_45263348_S.jpg') },
|
{ title: 'Zahnzusatzversicherung', href: '/zahnzusatzversicherung', image: import.meta.env.BASE_URL + encodeURI('Fotolia_45263348_S.jpg') },
|
||||||
{ title: 'Auslandsreisekrankenversicherung', href: '/auslandsreisekrankenversicherung', image: import.meta.env.BASE_URL + encodeURI('iStock-637584740.jpg') },
|
{ title: 'Auslandsreisekrankenversicherung', href: '/auslandsreisekrankenversicherung', image: import.meta.env.BASE_URL + encodeURI('iStock-637584740.jpg') },
|
||||||
{ title: 'Gesundheitsvorsorge', href: '/gesundheitsvorsorge', image: import.meta.env.BASE_URL + encodeURI('iStock-819100588.jpg') },
|
{ title: 'Gesundheitsvorsorge', href: '/gesundheitsvorsorge', image: import.meta.env.BASE_URL + encodeURI('iStock-819100588.jpg') },
|
||||||
{ title: 'Sterbegeldversicherung', href: '/senioren-sterbegeldversicherung', image: import.meta.env.BASE_URL + encodeURI('iStock-939772870.jpg') },
|
|
||||||
];
|
];
|
||||||
|
|
||||||
setFocusTopics(
|
setFocusTopics(
|
||||||
@ -109,7 +107,6 @@ const Index = () => {
|
|||||||
{ label: 'Private Krankenversicherung', href: '/private-krankenversicherung' },
|
{ label: 'Private Krankenversicherung', href: '/private-krankenversicherung' },
|
||||||
{ label: 'Zahnzusatzversicherung', href: '/zahnzusatzversicherung' },
|
{ label: 'Zahnzusatzversicherung', href: '/zahnzusatzversicherung' },
|
||||||
{ label: t('topics.item6.title', 'Unfall – Was jetzt?'), href: '/unfall' },
|
{ label: t('topics.item6.title', 'Unfall – Was jetzt?'), href: '/unfall' },
|
||||||
{ label: 'Sterbegeldversicherung', href: '/senioren-sterbegeldversicherung' },
|
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -166,20 +163,17 @@ const Index = () => {
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'home-5',
|
id: 'home-5',
|
||||||
kicker: 'Sterbegeldversicherung',
|
kicker: t('hero.private.kicker', 'Privatkunden'),
|
||||||
title: 'Für Ihre Liebsten vorsorgen',
|
title: t('hero.private.title', 'Sicherheit für Ihre Familie und Ihr Zuhause.'),
|
||||||
subtitle: 'Sichern Sie Ihre Familie mit einer Sterbegeldversicherung ab - finanzielle Sicherheit im Todesfall.',
|
subtitle: t(
|
||||||
imageUrl: import.meta.env.BASE_URL + encodeURI('iStock-939772870.jpg'),
|
'hero.private.subtitle',
|
||||||
imagePosition: 'center 35%',
|
'Individuelle Beratung für alle Lebensbereiche – von der Kfz-Versicherung bis zur Altersvorsorge.'
|
||||||
|
),
|
||||||
|
imageUrl: import.meta.env.BASE_URL + encodeURI('Fotolia_11700075_XS.jpg'),
|
||||||
|
imagePosition: 'center',
|
||||||
ctas: [
|
ctas: [
|
||||||
{ label: 'Jetzt beraten lassen', href: '/senioren-sterbegeldversicherung' },
|
{ label: t('hero.private.primaryCta', 'Privatkunden'), href: '/privatkunden' },
|
||||||
{ label: 'Alle Senioren-Themen', href: '/senioren' },
|
{ label: t('hero.private.secondaryCta', 'Beratung'), href: '/contact' },
|
||||||
],
|
|
||||||
topics: [
|
|
||||||
{ label: 'Sterbegeldversicherung', href: '/senioren-sterbegeldversicherung' },
|
|
||||||
{ label: 'Risikolebensversicherung', href: '/senioren-sterbegeldversicherung' },
|
|
||||||
{ label: 'Bestattungsvorsorge', href: '/senioren-sterbegeldversicherung' },
|
|
||||||
{ label: 'Senioren', href: '/senioren' },
|
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -455,7 +449,6 @@ const Index = () => {
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<Disclaimer />
|
|
||||||
</Layout>
|
</Layout>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -4,7 +4,6 @@ import { useTranslation } from 'react-i18next';
|
|||||||
import { Button } from '@/components/ui/button';
|
import { Button } from '@/components/ui/button';
|
||||||
import Layout from '@/components/Layout';
|
import Layout from '@/components/Layout';
|
||||||
import HeroSlider from '@/components/HeroSlider';
|
import HeroSlider from '@/components/HeroSlider';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
|
|
||||||
const KFZ = () => {
|
const KFZ = () => {
|
||||||
const { t } = useTranslation('kfz');
|
const { t } = useTranslation('kfz');
|
||||||
@ -79,8 +78,6 @@ const KFZ = () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<Disclaimer />
|
|
||||||
</Layout>
|
</Layout>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -24,7 +24,6 @@ import Layout from '@/components/Layout';
|
|||||||
import GeneralNotice from '@/components/GeneralNotice';
|
import GeneralNotice from '@/components/GeneralNotice';
|
||||||
import HeroSlider from '@/components/HeroSlider';
|
import HeroSlider from '@/components/HeroSlider';
|
||||||
import { Button } from '@/components/ui/button';
|
import { Button } from '@/components/ui/button';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
|
||||||
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
||||||
import TwoColumnTab from '@/components/tab-pages/TwoColumnTab';
|
import TwoColumnTab from '@/components/tab-pages/TwoColumnTab';
|
||||||
@ -279,17 +278,12 @@ const KinderGesundheit = () => {
|
|||||||
</CardHeader>
|
</CardHeader>
|
||||||
<CardContent className="text-sm">
|
<CardContent className="text-sm">
|
||||||
<div className="space-y-2">
|
<div className="space-y-2">
|
||||||
{(() => {
|
{(t('details.leistung.rows', { returnObjects: true }) as unknown as string[]).map((row) => (
|
||||||
const rows = t('details.leistung.rows', { returnObjects: true }) as unknown;
|
<div key={row} className="flex items-start gap-2">
|
||||||
return Array.isArray(rows)
|
|
||||||
? (rows as string[]).map((row, index) => (
|
|
||||||
<div key={index} className="flex items-start gap-2">
|
|
||||||
<CheckCircle className="w-4 h-4 text-green-700 mt-0.5" />
|
<CheckCircle className="w-4 h-4 text-green-700 mt-0.5" />
|
||||||
<span className="text-gray-900">{row}</span>
|
<span className="text-gray-900">{row}</span>
|
||||||
</div>
|
</div>
|
||||||
))
|
))}
|
||||||
: null;
|
|
||||||
})()}
|
|
||||||
</div>
|
</div>
|
||||||
</CardContent>
|
</CardContent>
|
||||||
</Card>
|
</Card>
|
||||||
@ -302,17 +296,12 @@ const KinderGesundheit = () => {
|
|||||||
</CardHeader>
|
</CardHeader>
|
||||||
<CardContent className="text-sm">
|
<CardContent className="text-sm">
|
||||||
<div className="space-y-2">
|
<div className="space-y-2">
|
||||||
{(() => {
|
{(t('details.ueberblick.items', { returnObjects: true }) as unknown as string[]).map((row) => (
|
||||||
const items = t('details.ueberblick.items', { returnObjects: true }) as unknown;
|
<div key={row} className="flex items-start gap-2">
|
||||||
return Array.isArray(items)
|
|
||||||
? (items as string[]).map((row, index) => (
|
|
||||||
<div key={index} className="flex items-start gap-2">
|
|
||||||
<CheckCircle className="w-4 h-4 text-green-700 mt-0.5" />
|
<CheckCircle className="w-4 h-4 text-green-700 mt-0.5" />
|
||||||
<span className="text-gray-900">{row}</span>
|
<span className="text-gray-900">{row}</span>
|
||||||
</div>
|
</div>
|
||||||
))
|
))}
|
||||||
: null;
|
|
||||||
})()}
|
|
||||||
</div>
|
</div>
|
||||||
<div className="mt-4 text-xs text-gray-500">{t('details.ueberblick.disclaimer')}</div>
|
<div className="mt-4 text-xs text-gray-500">{t('details.ueberblick.disclaimer')}</div>
|
||||||
</CardContent>
|
</CardContent>
|
||||||
@ -337,19 +326,14 @@ const KinderGesundheit = () => {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="mt-4 space-y-2">
|
<div className="mt-4 space-y-2">
|
||||||
{(() => {
|
{(t('details.leistungsfall.rows', { returnObjects: true }) as unknown as Array<{ label: string; value: string; strong?: boolean }>).map(
|
||||||
const rows = t('details.leistungsfall.rows', { returnObjects: true }) as unknown;
|
(row) => (
|
||||||
return Array.isArray(rows)
|
<div key={`${row.label}-${row.value}`} className="flex items-start justify-between gap-3">
|
||||||
? (rows as Array<{ label: string; value: string; strong?: boolean }>).map(
|
|
||||||
(row, index) => (
|
|
||||||
<div key={`${row.label}-${row.value}-${index}`} className="flex items-start justify-between gap-3">
|
|
||||||
<div className={row.strong ? 'font-semibold text-gray-900' : 'text-gray-700'}>{row.label}</div>
|
<div className={row.strong ? 'font-semibold text-gray-900' : 'text-gray-700'}>{row.label}</div>
|
||||||
<div className={row.strong ? 'font-semibold text-gray-900' : 'text-gray-700'}>{row.value}</div>
|
<div className={row.strong ? 'font-semibold text-gray-900' : 'text-gray-700'}>{row.value}</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
),
|
||||||
)
|
)}
|
||||||
: null;
|
|
||||||
})()}
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="mt-4 rounded-lg border border-gray-200 bg-white p-4">
|
<div className="mt-4 rounded-lg border border-gray-200 bg-white p-4">
|
||||||
|
|||||||
@ -10,7 +10,6 @@ import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
|||||||
import TwoColumnTab from '@/components/tab-pages/TwoColumnTab';
|
import TwoColumnTab from '@/components/tab-pages/TwoColumnTab';
|
||||||
import RightImageCard from '@/components/tab-pages/RightImageCard';
|
import RightImageCard from '@/components/tab-pages/RightImageCard';
|
||||||
import { CheckCircle, Download, Mail, Phone, Shield, Home, FileText, Calculator, Star, Search } from 'lucide-react';
|
import { CheckCircle, Download, Mail, Phone, Shield, Home, FileText, Calculator, Star, Search } from 'lucide-react';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
|
|
||||||
const TAB_OVERVIEW = 'overview';
|
const TAB_OVERVIEW = 'overview';
|
||||||
const TAB_DETAILS = 'details';
|
const TAB_DETAILS = 'details';
|
||||||
|
|||||||
@ -10,7 +10,6 @@ import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
|||||||
import TwoColumnTab from '@/components/tab-pages/TwoColumnTab';
|
import TwoColumnTab from '@/components/tab-pages/TwoColumnTab';
|
||||||
import RightImageCard from '@/components/tab-pages/RightImageCard';
|
import RightImageCard from '@/components/tab-pages/RightImageCard';
|
||||||
import HeroSlider from '@/components/HeroSlider';
|
import HeroSlider from '@/components/HeroSlider';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
|
|
||||||
const Kinderunfall = () => {
|
const Kinderunfall = () => {
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
|
|||||||
@ -2,7 +2,6 @@ import React from 'react';
|
|||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
import { Shield, Car, Home, Users, Briefcase, Heart, FileText, CheckCircle, Star, TrendingUp } from 'lucide-react';
|
import { Shield, Car, Home, Users, Briefcase, Heart, FileText, CheckCircle, Star, TrendingUp } from 'lucide-react';
|
||||||
import Layout from '@/components/Layout';
|
import Layout from '@/components/Layout';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
|
|
||||||
const Leistungen = () => {
|
const Leistungen = () => {
|
||||||
const { t } = useTranslation('leistungen');
|
const { t } = useTranslation('leistungen');
|
||||||
@ -151,8 +150,6 @@ const Leistungen = () => {
|
|||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Disclaimer />
|
|
||||||
</Layout>
|
</Layout>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -3,7 +3,6 @@ import { Link } from 'react-router-dom';
|
|||||||
import Layout from '@/components/Layout';
|
import Layout from '@/components/Layout';
|
||||||
import { Card, CardContent, CardHeader, CardTitle, CardDescription } from '@/components/ui/card';
|
import { Card, CardContent, CardHeader, CardTitle, CardDescription } from '@/components/ui/card';
|
||||||
import { Phone, Shield, FileText, Link as LinkIcon } from 'lucide-react';
|
import { Phone, Shield, FileText, Link as LinkIcon } from 'lucide-react';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
|
|
||||||
const Links = () => {
|
const Links = () => {
|
||||||
const { t } = useTranslation('links');
|
const { t } = useTranslation('links');
|
||||||
@ -94,8 +93,6 @@ const Links = () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Disclaimer />
|
|
||||||
</Layout>
|
</Layout>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -10,7 +10,6 @@ import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
|||||||
import GeneralNotice from '@/components/GeneralNotice';
|
import GeneralNotice from '@/components/GeneralNotice';
|
||||||
import TwoColumnTab from '@/components/tab-pages/TwoColumnTab';
|
import TwoColumnTab from '@/components/tab-pages/TwoColumnTab';
|
||||||
import RightImageCard from '@/components/tab-pages/RightImageCard';
|
import RightImageCard from '@/components/tab-pages/RightImageCard';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
|
|
||||||
const PrivateKrankenversicherung = () => {
|
const PrivateKrankenversicherung = () => {
|
||||||
const { t } = useTranslation('privateKrankenversicherung');
|
const { t } = useTranslation('privateKrankenversicherung');
|
||||||
|
|||||||
@ -3,7 +3,6 @@ import { Link } from 'react-router-dom';
|
|||||||
import { Shield, Heart, Car, Home, Briefcase, Users } from 'lucide-react';
|
import { Shield, Heart, Car, Home, Briefcase, Users } from 'lucide-react';
|
||||||
import Layout from '@/components/Layout';
|
import Layout from '@/components/Layout';
|
||||||
import { Card } from '@/components/ui/card';
|
import { Card } from '@/components/ui/card';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
|
|
||||||
const Risikoschutz = () => {
|
const Risikoschutz = () => {
|
||||||
const baseUrl = import.meta.env.BASE_URL;
|
const baseUrl = import.meta.env.BASE_URL;
|
||||||
@ -84,8 +83,6 @@ const Risikoschutz = () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Disclaimer />
|
|
||||||
</Layout>
|
</Layout>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -6,7 +6,7 @@ import { Shield, Users, TrendingUp, Clock, DollarSign, MapPin, Phone, Mail } fro
|
|||||||
import Layout from '@/components/Layout';
|
import Layout from '@/components/Layout';
|
||||||
import HeroSlider from '@/components/HeroSlider';
|
import HeroSlider from '@/components/HeroSlider';
|
||||||
|
|
||||||
type FocusTopicId = 'health' | 'risk' | 'retirement' | 'funeral';
|
type FocusTopicId = 'health' | 'risk' | 'retirement';
|
||||||
|
|
||||||
const Senioren = () => {
|
const Senioren = () => {
|
||||||
const { t } = useTranslation('senioren');
|
const { t } = useTranslation('senioren');
|
||||||
@ -20,7 +20,6 @@ const Senioren = () => {
|
|||||||
{ id: 'health' as const, title: t('focus.items.health', 'Gesundheitsvorsorge'), href: '/senioren-gesundheitsvorsorge', image: assetUrl('iStock-957363908.jpg') },
|
{ id: 'health' as const, title: t('focus.items.health', 'Gesundheitsvorsorge'), href: '/senioren-gesundheitsvorsorge', image: assetUrl('iStock-957363908.jpg') },
|
||||||
{ id: 'risk' as const, title: t('focus.items.risk', 'Risikoschutz'), href: '/senioren-risikoschutz', image: assetUrl('iStock-970876204.jpg') },
|
{ id: 'risk' as const, title: t('focus.items.risk', 'Risikoschutz'), href: '/senioren-risikoschutz', image: assetUrl('iStock-970876204.jpg') },
|
||||||
{ id: 'retirement' as const, title: t('focus.items.retirement', 'Altersvorsorge'), href: '/senioren-altersvorsorge', image: assetUrl('Fotolia_67327775_XS.jpg') },
|
{ id: 'retirement' as const, title: t('focus.items.retirement', 'Altersvorsorge'), href: '/senioren-altersvorsorge', image: assetUrl('Fotolia_67327775_XS.jpg') },
|
||||||
{ id: 'funeral' as const, title: t('focus.items.funeral', 'Sterbegeldversicherung'), href: '/senioren-sterbegeldversicherung', image: assetUrl('iStock-939772870.jpg') },
|
|
||||||
];
|
];
|
||||||
|
|
||||||
setFocusTopics(
|
setFocusTopics(
|
||||||
@ -56,15 +55,6 @@ const Senioren = () => {
|
|||||||
{ title: 'Betriebliche Altersvorsorge', href: '/senioren-altersvorsorge' },
|
{ title: 'Betriebliche Altersvorsorge', href: '/senioren-altersvorsorge' },
|
||||||
];
|
];
|
||||||
|
|
||||||
const funeralLinksRaw = t('details.funeral.links', { returnObjects: true }) as unknown;
|
|
||||||
const funeralLinks = Array.isArray(funeralLinksRaw)
|
|
||||||
? (funeralLinksRaw as Array<{ title: string; href: string }>)
|
|
||||||
: [
|
|
||||||
{ title: 'Sterbegeldversicherung', href: '/senioren-sterbegeldversicherung' },
|
|
||||||
{ title: 'Bestattungsvorsorge', href: '/senioren-sterbegeldversicherung' },
|
|
||||||
{ title: 'Risikolebensversicherung', href: '/senioren-sterbegeldversicherung' },
|
|
||||||
];
|
|
||||||
|
|
||||||
const benefitsRaw = t('benefits.items', { returnObjects: true }) as unknown;
|
const benefitsRaw = t('benefits.items', { returnObjects: true }) as unknown;
|
||||||
const benefits = Array.isArray(benefitsRaw) ? (benefitsRaw as Array<{ title: string; desc: string }>) : [];
|
const benefits = Array.isArray(benefitsRaw) ? (benefitsRaw as Array<{ title: string; desc: string }>) : [];
|
||||||
const benefitIcons = [Shield, Users, TrendingUp, Clock, DollarSign, MapPin];
|
const benefitIcons = [Shield, Users, TrendingUp, Clock, DollarSign, MapPin];
|
||||||
@ -188,26 +178,6 @@ const Senioren = () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{/* Zusätzliche Links unter dem Bild für Sterbegeldversicherung */}
|
|
||||||
{item.id === 'funeral' && (
|
|
||||||
<div className="space-y-2">
|
|
||||||
<div className="text-xs uppercase tracking-wide text-gray-500 font-semibold mb-3">{detailsLabel}</div>
|
|
||||||
<div className="grid grid-cols-1 gap-2">
|
|
||||||
{funeralLinks.map((link) => (
|
|
||||||
<Link
|
|
||||||
key={link.href}
|
|
||||||
to={link.href}
|
|
||||||
className="text-blue-600 hover:text-blue-800 hover:underline text-sm font-medium transition-colors duration-200 flex items-center group"
|
|
||||||
onClick={(e) => e.stopPropagation()}
|
|
||||||
>
|
|
||||||
<span className="w-2 h-2 bg-blue-600 rounded-full mr-2 group-hover:bg-blue-800 transition-colors"></span>
|
|
||||||
{link.title}
|
|
||||||
</Link>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
|
|||||||
@ -8,7 +8,6 @@ import { Shield, Heart, Star, CheckCircle, Phone, Mail, FileText, Download, Aler
|
|||||||
import Layout from '@/components/Layout';
|
import Layout from '@/components/Layout';
|
||||||
import HeroSlider from '@/components/HeroSlider';
|
import HeroSlider from '@/components/HeroSlider';
|
||||||
import GeneralNotice from '@/components/GeneralNotice';
|
import GeneralNotice from '@/components/GeneralNotice';
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
|
|
||||||
const SeniorenGesundheitsvorsorge = () => {
|
const SeniorenGesundheitsvorsorge = () => {
|
||||||
const { t } = useTranslation('seniorenGesundheitsvorsorge');
|
const { t } = useTranslation('seniorenGesundheitsvorsorge');
|
||||||
@ -406,6 +405,23 @@ const SeniorenGesundheitsvorsorge = () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{/* Haftungsausschluss */}
|
||||||
|
<div className="bg-amber-50 border border-amber-200">
|
||||||
|
<div className="container mx-auto px-4 py-6">
|
||||||
|
<div className="max-w-4xl mx-auto">
|
||||||
|
<div className="flex items-start gap-3">
|
||||||
|
<AlertTriangle className="w-5 h-5 text-amber-600 mt-0.5 flex-shrink-0" />
|
||||||
|
<div className="text-sm text-amber-800">
|
||||||
|
<h4 className="font-semibold mb-2">Wichtiger Hinweis:</h4>
|
||||||
|
<p>
|
||||||
|
Bei den Tipps und Informationen auf diesen Seiten handelt es sich um allgemeine, unverbindliche Hinweise zu Versicherungen. Trotz meiner beruflichen Erfahrung handelt es sich hierbei um eine private Meinungsäußerung, ohne Anspruch auf Richtigkeit, ohne Haftung und ohne Ersatz für eine Beratung. Die rechtsverbindlichen Bestimmungen entnehmen Sie bitte den Versicherungsbedingungen des jeweiligen Versicherungsunternehmens.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</Layout>
|
</Layout>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -510,8 +510,6 @@ const SeniorenRisikoschutz = () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</TabsContent>
|
</TabsContent>
|
||||||
|
|
||||||
<GeneralNotice />
|
|
||||||
</div>
|
</div>
|
||||||
</Tabs>
|
</Tabs>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -1,489 +0,0 @@
|
|||||||
import React, { useState } from 'react';
|
|
||||||
import { Link, useNavigate } from 'react-router-dom';
|
|
||||||
import { useTranslation } from 'react-i18next';
|
|
||||||
import { Button } from '@/components/ui/button';
|
|
||||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
|
|
||||||
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
|
||||||
import { Shield, Heart, Star, CheckCircle, Phone, Mail, FileText, Download, AlertTriangle, Clock, Users, Activity, Calculator, DollarSign, HandHeart, Home } from 'lucide-react';
|
|
||||||
import Layout from '@/components/Layout';
|
|
||||||
import HeroSlider from '@/components/HeroSlider';
|
|
||||||
import GeneralNotice from '@/components/GeneralNotice';
|
|
||||||
import Disclaimer from '@/components/Disclaimer';
|
|
||||||
import TwoColumnTab from '@/components/tab-pages/TwoColumnTab';
|
|
||||||
|
|
||||||
const SeniorenSterbegeldversicherung = () => {
|
|
||||||
const { t } = useTranslation();
|
|
||||||
const navigate = useNavigate();
|
|
||||||
const baseUrl = import.meta.env.BASE_URL;
|
|
||||||
const assetUrl = (fileName: string) => `${baseUrl}${encodeURI(fileName)}`;
|
|
||||||
const [activeTab, setActiveTab] = useState('overview');
|
|
||||||
|
|
||||||
const benefits = [
|
|
||||||
{
|
|
||||||
icon: HandHeart,
|
|
||||||
title: 'Absicherung im Todesfall',
|
|
||||||
description: 'Finanzielle Unterstützung für Ihre Hinterbliebenen'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: DollarSign,
|
|
||||||
title: 'Beitragsgünstig',
|
|
||||||
description: 'Günstige Beiträge mit hoher Auszahlungssumme'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: Shield,
|
|
||||||
title: 'Sofortauszahlung',
|
|
||||||
description: 'Schnelle Hilfe für Ihre Familie'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: Heart,
|
|
||||||
title: 'Familienabsicherung',
|
|
||||||
description: 'Schutz für Ihre Liebsten'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: Clock,
|
|
||||||
title: 'Lebenslang gültig',
|
|
||||||
description: 'Keine Altersgrenzen oder Laufzeiten'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: Users,
|
|
||||||
title: 'Ohne Gesundheitsprüfung',
|
|
||||||
description: 'Einfacher Abschluss möglich'
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
const processSteps = [
|
|
||||||
{
|
|
||||||
icon: FileText,
|
|
||||||
title: 'Beratung',
|
|
||||||
description: 'Persönliche Beratung zu Ihren Wünschen'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: Calculator,
|
|
||||||
title: 'Berechnung',
|
|
||||||
description: 'Individuelle Tarifauswahl'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: Shield,
|
|
||||||
title: 'Abschluss',
|
|
||||||
description: 'Schneller und unkomplizierter Vertragsschluss'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: CheckCircle,
|
|
||||||
title: 'Schutz',
|
|
||||||
description: 'Sofortiger Versicherungsschutz'
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
const advantages = [
|
|
||||||
{
|
|
||||||
icon: Heart,
|
|
||||||
title: 'Finanzielle Entlastung',
|
|
||||||
description: 'Ihre Angehörigen müssen keine Kosten tragen'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: Shield,
|
|
||||||
title: 'Schnelle Auszahlung',
|
|
||||||
description: 'Geld ist sofort nach dem Todesfall verfügbar'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: Home,
|
|
||||||
title: 'Freie Wahl',
|
|
||||||
description: 'Bestatter und Art der Bestattung frei wählbar'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: DollarSign,
|
|
||||||
title: 'Beitragsgünstig',
|
|
||||||
description: 'Schon ab wenigen Euro im Monat absicherbar'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: Users,
|
|
||||||
title: 'Ohne Gesundheitsprüfung',
|
|
||||||
description: 'Keine Gesundheitsfragen erforderlich'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: Clock,
|
|
||||||
title: 'Lebenslang gültig',
|
|
||||||
description: 'Keine Altersgrenzen oder Laufzeiten'
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Layout>
|
|
||||||
<div className="min-h-screen bg-gray-50">
|
|
||||||
{/* Hero Section */}
|
|
||||||
<HeroSlider
|
|
||||||
slides={[
|
|
||||||
{
|
|
||||||
id: 'senioren-sterbegeld-1',
|
|
||||||
title: 'Die Sterbegeldversicherung',
|
|
||||||
subtitle: 'Für Ihre Liebsten sorgen',
|
|
||||||
imageUrl: assetUrl('iStock-939772870.jpg'),
|
|
||||||
topics: [
|
|
||||||
{ label: 'Sterbegeld', href: '#overview' },
|
|
||||||
{ label: 'Vorsorge', href: '#benefits' }
|
|
||||||
],
|
|
||||||
ctas: [
|
|
||||||
{ label: 'Beratung anfordern', href: '#form', variant: 'default' as const },
|
|
||||||
{ label: 'Mehr erfahren', href: '#overview', variant: 'outline' as const }
|
|
||||||
]
|
|
||||||
}
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
|
|
||||||
{/* Main Content */}
|
|
||||||
<div className="container mx-auto px-4 py-8">
|
|
||||||
<div className="max-w-6xl mx-auto">
|
|
||||||
{/* Header */}
|
|
||||||
<div className="text-center mb-8">
|
|
||||||
<h1 className="text-4xl md:text-5xl font-bold text-gray-900 mb-4">
|
|
||||||
Die Sterbegeldversicherung
|
|
||||||
</h1>
|
|
||||||
<p className="text-xl text-gray-600 mb-6">
|
|
||||||
Für Ihre Liebsten sorgen
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Tabs Navigation */}
|
|
||||||
<div className="bg-white rounded-lg border border-gray-200 shadow-sm mb-8">
|
|
||||||
<Tabs
|
|
||||||
value={activeTab}
|
|
||||||
onValueChange={(next) => {
|
|
||||||
setActiveTab(next);
|
|
||||||
}}
|
|
||||||
className="w-full"
|
|
||||||
id="tab-section"
|
|
||||||
>
|
|
||||||
<div className="border-b border-gray-100 px-4 pt-6 pb-2 bg-gradient-to-r from-blue-50 to-white">
|
|
||||||
<TabsList className="grid grid-cols-6 gap-2 w-full h-auto bg-transparent border-0 shadow-none">
|
|
||||||
<TabsTrigger
|
|
||||||
value="overview"
|
|
||||||
className="relative px-3 py-2.5 text-sm font-medium rounded-lg transition-all duration-200 data-[state=active]:bg-blue-600 data-[state=active]:text-white data-[state=active]:shadow-md data-[state=inactive]:bg-white data-[state=inactive]:text-gray-600 data-[state=inactive]:hover:bg-gray-50 data-[state=inactive]:border border-gray-200 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 !outline-none !ring-0"
|
|
||||||
>
|
|
||||||
<Shield className="w-4 h-4 mr-1.5" />
|
|
||||||
Übersicht
|
|
||||||
</TabsTrigger>
|
|
||||||
<TabsTrigger
|
|
||||||
value="products"
|
|
||||||
className="relative px-3 py-2.5 text-sm font-medium rounded-lg transition-all duration-200 data-[state=active]:bg-blue-600 data-[state=active]:text-white data-[state=active]:shadow-md data-[state=inactive]:bg-white data-[state=inactive]:text-gray-600 data-[state=inactive]:hover:bg-gray-50 data-[state=inactive]:border border-gray-200 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 !outline-none !ring-0"
|
|
||||||
>
|
|
||||||
<FileText className="w-4 h-4 mr-1.5" />
|
|
||||||
Produkte
|
|
||||||
</TabsTrigger>
|
|
||||||
<TabsTrigger
|
|
||||||
value="benefits"
|
|
||||||
className="relative px-3 py-2.5 text-sm font-medium rounded-lg transition-all duration-200 data-[state=active]:bg-blue-600 data-[state=active]:text-white data-[state=active]:shadow-md data-[state=inactive]:bg-white data-[state=inactive]:text-gray-600 data-[state=inactive]:hover:bg-gray-50 data-[state=inactive]:border border-gray-200 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 !outline-none !ring-0"
|
|
||||||
>
|
|
||||||
<Star className="w-4 h-4 mr-1.5" />
|
|
||||||
Vorteile
|
|
||||||
</TabsTrigger>
|
|
||||||
<TabsTrigger
|
|
||||||
value="process"
|
|
||||||
className="relative px-3 py-2.5 text-sm font-medium rounded-lg transition-all duration-200 data-[state=active]:bg-blue-600 data-[state=active]:text-white data-[state=active]:shadow-md data-[state=inactive]:bg-white data-[state=inactive]:text-gray-600 data-[state=inactive]:hover:bg-gray-50 data-[state=inactive]:border border-gray-200 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 !outline-none !ring-0"
|
|
||||||
>
|
|
||||||
<Clock className="w-4 h-4 mr-1.5" />
|
|
||||||
Prozess
|
|
||||||
</TabsTrigger>
|
|
||||||
<TabsTrigger
|
|
||||||
value="costs"
|
|
||||||
className="relative px-3 py-2.5 text-sm font-medium rounded-lg transition-all duration-200 data-[state=active]:bg-blue-600 data-[state=active]:text-white data-[state=active]:shadow-md data-[state=inactive]:bg-white data-[state=inactive]:text-gray-600 data-[state=inactive]:hover:bg-gray-50 data-[state=inactive]:border border-gray-200 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 !outline-none !ring-0"
|
|
||||||
>
|
|
||||||
<Calculator className="w-4 h-4 mr-1.5" />
|
|
||||||
Kosten
|
|
||||||
</TabsTrigger>
|
|
||||||
<TabsTrigger
|
|
||||||
value="form"
|
|
||||||
className="relative px-3 py-2.5 text-sm font-medium rounded-lg transition-all duration-200 data-[state=active]:bg-blue-600 data-[state=active]:text-white data-[state=active]:shadow-md data-[state=inactive]:bg-white data-[state=inactive]:text-gray-600 data-[state=inactive]:hover:bg-gray-50 data-[state=inactive]:border border-gray-200 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 !outline-none !ring-0"
|
|
||||||
>
|
|
||||||
<Mail className="w-4 h-4 mr-1.5" />
|
|
||||||
Anfrage
|
|
||||||
</TabsTrigger>
|
|
||||||
</TabsList>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="p-4 md:p-6">
|
|
||||||
<TabsContent value="overview" className="mt-0">
|
|
||||||
<TwoColumnTab
|
|
||||||
className="gap-8 items-center"
|
|
||||||
left={
|
|
||||||
<>
|
|
||||||
<div className="mb-4">
|
|
||||||
<span className="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
|
|
||||||
<Heart className="w-3 h-3 mr-1" />
|
|
||||||
Sterbegeldversicherung
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<h2 className="text-3xl font-bold text-gray-900 mb-4">
|
|
||||||
Die Sterbegeldversicherung
|
|
||||||
</h2>
|
|
||||||
<p className="text-lg text-gray-600 mb-6">
|
|
||||||
Für Ihre Liebsten sorgen
|
|
||||||
</p>
|
|
||||||
<p className="text-gray-600 mb-8">
|
|
||||||
Eine Sterbegeldversicherung ist eine sinnvolle Vorsorge, die Ihre Angehörigen im Todesfall finanziell entlastet.
|
|
||||||
Mit einer monatlichen Prämie sichern Sie eine Auszahlungssumme, die für die Bestattungskosten verwendet werden kann.
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<div className="flex flex-col sm:flex-row gap-4 mb-8">
|
|
||||||
<Button
|
|
||||||
onClick={() => setActiveTab('form')}
|
|
||||||
className="bg-blue-700 hover:bg-blue-800 px-6 py-3 text-lg font-semibold"
|
|
||||||
>
|
|
||||||
Beratung anfordern
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
onClick={() => setActiveTab('form')}
|
|
||||||
variant="outline"
|
|
||||||
className="border-blue-600 text-blue-600 hover:bg-blue-600 hover:text-white px-6 py-3 text-lg font-semibold"
|
|
||||||
>
|
|
||||||
Kostenlos beraten lassen
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="space-y-4">
|
|
||||||
<div className="flex items-center gap-3 rounded-lg border border-gray-200 bg-white p-4">
|
|
||||||
<Heart className="w-5 h-5 text-blue-700" />
|
|
||||||
<div className="text-sm">
|
|
||||||
<div className="font-semibold text-gray-900">Familienabsicherung</div>
|
|
||||||
<div className="text-gray-600">Schutz für Ihre Liebsten</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="flex items-center gap-3 rounded-lg border border-gray-200 bg-white p-4">
|
|
||||||
<DollarSign className="w-5 h-5 text-blue-700" />
|
|
||||||
<div className="text-sm">
|
|
||||||
<div className="font-semibold text-gray-900">Beitragsgünstig</div>
|
|
||||||
<div className="text-gray-600">Günstige Absicherung</div>
|
|
||||||
<div className="text-xs text-gray-500 mt-1">ab 40,75 €/mtl. für 12.500 €</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
}
|
|
||||||
right={
|
|
||||||
(
|
|
||||||
<div className="relative">
|
|
||||||
<div className="absolute inset-0 bg-gradient-to-tr from-blue-100 to-white rounded-2xl" />
|
|
||||||
<div className="relative rounded-2xl border border-gray-200 bg-white shadow-sm overflow-hidden">
|
|
||||||
<img
|
|
||||||
src={assetUrl('iStock-939772870.jpg')}
|
|
||||||
alt="Sterbegeldversicherung"
|
|
||||||
className="w-full h-[400px] object-cover"
|
|
||||||
/>
|
|
||||||
<div className="p-5 bg-gradient-to-t from-white/90 to-white/60 backdrop-blur-sm">
|
|
||||||
<div className="flex items-center gap-2 text-sm text-gray-700">
|
|
||||||
<Heart className="w-4 h-4 text-blue-700" />
|
|
||||||
<span>Finanzielle Absicherung, letzte Wünsche, Entlastung für Familie</span>
|
|
||||||
</div>
|
|
||||||
<div className="flex items-center gap-2 text-sm text-gray-700 mt-1">
|
|
||||||
<Star className="w-4 h-4 text-blue-700" />
|
|
||||||
<span>Tarifcheck – schnell, fair und passend zu Ihrer Vorsorge.</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
|
|
||||||
{/* Beitragsbeispiel und Versicherungssummen */}
|
|
||||||
<div className="mt-8 grid grid-cols-1 sm:grid-cols-2 gap-4">
|
|
||||||
<div className="bg-gradient-to-br from-blue-50 to-blue-100 rounded-xl p-6 border border-blue-200">
|
|
||||||
<div className="text-center">
|
|
||||||
<p className="text-blue-700 font-medium text-sm uppercase tracking-wide mb-3">Beitragsbeispiel</p>
|
|
||||||
<p className="text-4xl font-light text-blue-900 mb-2">ab 40,75 €</p>
|
|
||||||
<p className="text-blue-600 text-sm">pro Monat für 12.500 € Versicherungssumme</p>
|
|
||||||
<div className="mt-4 text-xs text-blue-700">
|
|
||||||
<p>• Männer/Frauen: ab 53 Jahre</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="bg-gradient-to-br from-slate-700 to-slate-800 rounded-xl p-6 border border-slate-600">
|
|
||||||
<div className="text-center">
|
|
||||||
<p className="text-slate-300 font-medium text-sm uppercase tracking-wide mb-3">Versicherungssummen</p>
|
|
||||||
<p className="text-4xl font-light text-white mb-2">1.500 € - bis 50.000 €</p>
|
|
||||||
<p className="text-slate-400 text-sm">Frei wählbare Absicherung</p>
|
|
||||||
<div className="mt-4 text-xs text-slate-300">
|
|
||||||
<p>• Sofortauszahlung bei Unfalltod</p>
|
|
||||||
<p>• Doppelte Leistung bei Unfalltod</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</TabsContent>
|
|
||||||
|
|
||||||
<TabsContent value="products" className="mt-0">
|
|
||||||
<div className="text-center">
|
|
||||||
<h3 className="text-2xl font-bold text-gray-900 mb-4">Unsere Sterbegeldlösungen</h3>
|
|
||||||
<p className="text-gray-600">Wir bieten verschiedene Tarife an, die auf Ihre individuellen Bedürfnisse zugeschnitten sind.</p>
|
|
||||||
</div>
|
|
||||||
</TabsContent>
|
|
||||||
|
|
||||||
<TabsContent value="benefits" className="mt-0">
|
|
||||||
<div className="text-center mb-12">
|
|
||||||
<h3 className="text-3xl md:text-4xl font-bold text-gray-900 mb-4">
|
|
||||||
Ihre Vorteile
|
|
||||||
</h3>
|
|
||||||
<p className="text-lg text-gray-600 max-w-2xl mx-auto">
|
|
||||||
Entdecken Sie die vielen Vorteile einer Sterbegeldversicherung und wie Sie Ihre Liebsten schützen können.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
|
||||||
{advantages.map((advantage, index) => (
|
|
||||||
<Card key={index} className="border-gray-200 hover:shadow-lg transition-shadow">
|
|
||||||
<CardHeader className="text-center">
|
|
||||||
<div className="w-12 h-12 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-4">
|
|
||||||
<advantage.icon className="w-6 h-6 text-blue-700" />
|
|
||||||
</div>
|
|
||||||
<CardTitle className="text-lg">{advantage.title}</CardTitle>
|
|
||||||
</CardHeader>
|
|
||||||
<CardContent className="text-center">
|
|
||||||
<p className="text-gray-600">{advantage.description}</p>
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</TabsContent>
|
|
||||||
|
|
||||||
<TabsContent value="process" className="mt-0">
|
|
||||||
<div className="text-center mb-12">
|
|
||||||
<h3 className="text-3xl md:text-4xl font-bold text-gray-900 mb-4">
|
|
||||||
So läuft die Beratung ab
|
|
||||||
</h3>
|
|
||||||
<p className="text-lg text-gray-600 max-w-2xl mx-auto">
|
|
||||||
In nur wenigen Schritten zu Ihrer individuellen Sterbegeldversicherung
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
|
|
||||||
{processSteps.map((step, index) => (
|
|
||||||
<div key={index} className="text-center">
|
|
||||||
<div className="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-4">
|
|
||||||
<step.icon className="w-8 h-8 text-blue-700" />
|
|
||||||
</div>
|
|
||||||
<h4 className="text-lg font-semibold text-gray-900 mb-2">{step.title}</h4>
|
|
||||||
<p className="text-gray-600">{step.description}</p>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</TabsContent>
|
|
||||||
|
|
||||||
<TabsContent value="costs" className="mt-0">
|
|
||||||
<div className="text-center mb-8">
|
|
||||||
<h3 className="text-2xl font-bold text-gray-900 mb-4">Bestattungskosten im Überblick</h3>
|
|
||||||
<p className="text-gray-600">
|
|
||||||
Typische Kosten für eine Bestattung in Deutschland
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="bg-white rounded-2xl shadow-xl border border-gray-100 overflow-hidden">
|
|
||||||
{/* Modern Header */}
|
|
||||||
<div className="bg-gradient-to-r from-slate-700 to-slate-900 text-white p-8">
|
|
||||||
<div className="text-center">
|
|
||||||
<h4 className="text-3xl font-light tracking-wide mb-3">Bestattungskosten</h4>
|
|
||||||
<p className="text-slate-300 text-lg">Eine transparente Übersicht aller Kostenpositionen</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Content */}
|
|
||||||
<div className="p-8 bg-gradient-to-b from-white to-gray-50">
|
|
||||||
{/* Kostenübersicht Cards */}
|
|
||||||
<div className="grid md:grid-cols-2 gap-6 mb-8">
|
|
||||||
<div className="bg-gradient-to-br from-blue-50 to-blue-100 rounded-xl p-6 border border-blue-200">
|
|
||||||
<div className="text-center">
|
|
||||||
<p className="text-blue-700 font-medium text-sm uppercase tracking-wide mb-3">Beitragsbeispiel</p>
|
|
||||||
<p className="text-4xl font-light text-blue-900 mb-2">ab 40,75 €</p>
|
|
||||||
<p className="text-blue-600 text-sm">pro Monat für 12.500 € Versicherungssumme</p>
|
|
||||||
<div className="mt-4 text-xs text-blue-700">
|
|
||||||
<p>• Männer/Frauen: ab 53 Jahre</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="bg-gradient-to-br from-slate-700 to-slate-800 rounded-xl p-6 border border-slate-600">
|
|
||||||
<div className="text-center">
|
|
||||||
<p className="text-slate-300 font-medium text-sm uppercase tracking-wide mb-3">Versicherungssummen</p>
|
|
||||||
<p className="text-4xl font-light text-white mb-2">1.500 € - bis 50.000 €</p>
|
|
||||||
<p className="text-slate-400 text-sm">Frei wählbare Absicherung</p>
|
|
||||||
<div className="mt-4 text-xs text-slate-300">
|
|
||||||
<p>• Sofortauszahlung bei Unfalltod</p>
|
|
||||||
<p>• Doppelte Leistung bei Unfalltod</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Detaillierte Kostenliste */}
|
|
||||||
<div className="bg-white rounded-xl border border-gray-200 shadow-sm">
|
|
||||||
<div className="p-3 border-b border-gray-200">
|
|
||||||
<h5 className="text-lg font-medium text-gray-900">Detaillierte Kostenübersicht</h5>
|
|
||||||
</div>
|
|
||||||
<div className="divide-y divide-gray-100">
|
|
||||||
{[
|
|
||||||
{ name: 'Bestatter', desc: 'Organisation, Überführung, Trauerfeier', min: 1500, max: 3500 },
|
|
||||||
{ name: 'Sarg', desc: 'Je nach Material und Ausführung', min: 800, max: 2500 },
|
|
||||||
{ name: 'Grabstelle', desc: 'Erwerb und Aushebung', min: 500, max: 1200 },
|
|
||||||
{ name: 'Grabpflege', desc: 'Je nach Wahl und Friedhof (pro Jahr)', min: 200, max: 400 },
|
|
||||||
{ name: 'Krankenhaus', desc: 'Kosten für Aufbahrung', min: 50, max: 100 },
|
|
||||||
{ name: 'Verwaltung', desc: 'Verwaltungsgebühren', min: 50, max: 150 },
|
|
||||||
{ name: 'Todesanzeige', desc: 'Je nach Zeitung und Auflage', min: 100, max: 500 },
|
|
||||||
{ name: 'Trauerfeier', desc: 'Kaffee und Kuchen, Musik', min: 300, max: 1000 },
|
|
||||||
{ name: 'Blumenschmuck', desc: 'Kranz und Sträuße', min: 200, max: 800 },
|
|
||||||
{ name: 'Danksagungskarten', desc: 'Druck und Versand', min: 50, max: 200 },
|
|
||||||
{ name: 'Steinmetz', desc: 'Grabstein und Inschrift', min: 2350, max: 8000 }
|
|
||||||
].map((item, index) => (
|
|
||||||
<div key={index} className="p-3 hover:bg-gray-50 transition-colors">
|
|
||||||
<div className="flex items-center justify-between">
|
|
||||||
<div className="flex-1 pr-3">
|
|
||||||
<h6 className="font-medium text-gray-900">{item.name}</h6>
|
|
||||||
<p className="text-gray-600 text-sm">{item.desc}</p>
|
|
||||||
</div>
|
|
||||||
<div className="flex items-center gap-16">
|
|
||||||
<div className="text-right min-w-[120px]">
|
|
||||||
<p className="text-xs text-gray-500 uppercase">ab</p>
|
|
||||||
<p className="text-lg font-medium text-gray-900">{item.min.toLocaleString()} €</p>
|
|
||||||
</div>
|
|
||||||
<div className="text-right min-w-[120px]">
|
|
||||||
<p className="text-xs text-gray-500 uppercase">bis</p>
|
|
||||||
<p className="text-lg font-medium text-gray-900">{item.max.toLocaleString()} €</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</TabsContent>
|
|
||||||
|
|
||||||
<TabsContent value="form" className="mt-0">
|
|
||||||
<div className="text-center">
|
|
||||||
<h3 className="text-2xl font-bold text-gray-900 mb-4">Beratungsanfrage</h3>
|
|
||||||
<p className="text-gray-600 mb-6">
|
|
||||||
Lassen Sie sich unverbindlich zu Ihrer Sterbegeldversicherung beraten
|
|
||||||
</p>
|
|
||||||
<div className="flex flex-col sm:flex-row gap-4 justify-center">
|
|
||||||
<Button className="bg-blue-700 hover:bg-blue-800 px-8 py-3 text-lg font-semibold">
|
|
||||||
<Phone className="h-5 w-5 mr-2" />
|
|
||||||
Jetzt anrufen
|
|
||||||
</Button>
|
|
||||||
<Button variant="outline" className="border-blue-600 text-blue-600 hover:bg-blue-600 hover:text-white px-8 py-3 text-lg font-semibold">
|
|
||||||
<Mail className="h-5 w-5 mr-2" />
|
|
||||||
Kontakt aufnehmen
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</TabsContent>
|
|
||||||
</div>
|
|
||||||
</Tabs>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Additional Sections */}
|
|
||||||
<Disclaimer />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</Layout>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default SeniorenSterbegeldversicherung;
|
|
||||||
Loading…
x
Reference in New Issue
Block a user