- Brand/Theming: Marketing-Farb- und Typographievariablen in `resources/css/app.css` eingeführt, AdminLayout, Dashboardkarten und Onboarding-Komponenten entsprechend angepasst; Dokumentation (`docs/todo/tenant-admin-onboarding-fusion.md`, `docs/changes/...`) aktualisiert. - Checkout & Payments: Checkout-, PayPal-Controller und Tests für integrierte Stripe/PayPal-Flows sowie Paket-Billing-Abläufe überarbeitet; neue PayPal SDK-Factory und Admin-API-Helper (`resources/js/admin/api.ts`) schaffen Grundlage für Billing/Members/Tasks-Seiten. - DX & Tests: Neue Playwright/E2E-Struktur (docs/testing/e2e.md, `tests/e2e/tenant-onboarding-flow.test.ts`, Utilities), E2E-Tenant-Seeder und zusätzliche Übersetzungen/Factories zur Unterstützung der neuen Flows. - Marketing-Kommunikation: Automatische Kontakt-Bestätigungsmail (`ContactConfirmation` + Blade-Template) implementiert; Guest-PWA unter `/event` erreichbar. - Nebensitzung: Blogsystem gefixt und umfassenden BlogPostSeeder für Beispielinhalte angelegt.
67 lines
2.2 KiB
TypeScript
67 lines
2.2 KiB
TypeScript
import React from 'react';
|
|
import { cn } from '@/lib/utils';
|
|
|
|
export interface TenantWelcomeLayoutProps {
|
|
eyebrow?: string;
|
|
title?: string;
|
|
subtitle?: string;
|
|
headerAction?: React.ReactNode;
|
|
footer?: React.ReactNode;
|
|
children: React.ReactNode;
|
|
}
|
|
|
|
export function TenantWelcomeLayout({
|
|
eyebrow,
|
|
title,
|
|
subtitle,
|
|
headerAction,
|
|
footer,
|
|
children,
|
|
}: TenantWelcomeLayoutProps) {
|
|
React.useEffect(() => {
|
|
document.body.classList.add('tenant-admin-theme', 'tenant-admin-welcome-theme');
|
|
|
|
return () => {
|
|
document.body.classList.remove('tenant-admin-theme', 'tenant-admin-welcome-theme');
|
|
};
|
|
}, []);
|
|
|
|
return (
|
|
<div className="min-h-screen w-full bg-brand-gradient text-brand-slate transition-colors duration-500 ease-out">
|
|
<div className="mx-auto flex min-h-screen w-full max-w-5xl px-6 py-12 md:py-16 lg:px-10">
|
|
<div className="flex w-full flex-col gap-10 rounded-[40px] border border-brand-rose-soft bg-brand-card p-8 shadow-brand-primary backdrop-blur-xl md:gap-14 md:p-14">
|
|
<header className="flex flex-col gap-6 md:flex-row md:items-start md:justify-between">
|
|
<div className="max-w-xl">
|
|
{eyebrow && (
|
|
<p className="text-xs uppercase tracking-[0.35em] text-brand-rose">{eyebrow}</p>
|
|
)}
|
|
{title && (
|
|
<h1 className="mt-2 font-display text-4xl font-semibold tracking-tight text-brand-slate md:text-5xl">
|
|
{title}
|
|
</h1>
|
|
)}
|
|
{subtitle && (
|
|
<p className="mt-4 text-base font-sans-marketing text-brand-navy/80 md:text-lg">
|
|
{subtitle}
|
|
</p>
|
|
)}
|
|
</div>
|
|
{headerAction && <div className="flex shrink-0 items-center">{headerAction}</div>}
|
|
</header>
|
|
|
|
<main className="flex flex-1 flex-col gap-8">
|
|
{children}
|
|
</main>
|
|
|
|
{footer && (
|
|
<footer className="flex flex-col items-center gap-4 text-sm text-brand-navy/70 md:flex-row md:justify-between">
|
|
{footer}
|
|
</footer>
|
|
)}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
TenantWelcomeLayout.displayName = 'TenantWelcomeLayout'; |