45 lines
1.4 KiB
TypeScript
45 lines
1.4 KiB
TypeScript
import React, { ReactNode } from 'react';
|
|
import { Head } from '@inertiajs/react';
|
|
import MarketingHeader from '@/components/marketing/MarketingHeader';
|
|
import MarketingFooter from '@/components/marketing/MarketingFooter';
|
|
|
|
interface MarketingLayoutProps {
|
|
children: ReactNode;
|
|
title?: string;
|
|
description?: string;
|
|
}
|
|
|
|
const MarketingLayout: React.FC<MarketingLayoutProps> = ({
|
|
children,
|
|
title = 'Fotospiel - Event-Fotos einfach und sicher mit QR-Codes',
|
|
description = 'Sammle Gastfotos für Events mit QR-Codes und unserer PWA-Plattform. Für Hochzeiten, Firmenevents und mehr. Kostenloser Einstieg.'
|
|
}) => {
|
|
return (
|
|
<>
|
|
<Head>
|
|
<title>{title}</title>
|
|
<meta name="description" content={description} />
|
|
<style>{`
|
|
@keyframes aurora {
|
|
0%, 100% { background-position: 0% 50%; }
|
|
50% { background-position: 100% 50%; }
|
|
}
|
|
.bg-aurora {
|
|
background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
|
|
background-size: 400% 400%;
|
|
animation: aurora 15s ease infinite;
|
|
}
|
|
`}</style>
|
|
</Head>
|
|
<div className="bg-gray-50 text-gray-900 min-h-screen flex flex-col font-sans antialiased">
|
|
<MarketingHeader />
|
|
<main className="flex-grow">
|
|
{children}
|
|
</main>
|
|
<MarketingFooter />
|
|
</div>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default MarketingLayout; |