photobooth funktionen im event admin verlinkt, gäste pwa zeigt photobooth nur noch an, wenn diese aktiviert ist. kontaktformular optimiert. teilen-link mit iMessage und whatsapp erweitert.
This commit is contained in:
@@ -167,12 +167,12 @@ const MarketingLayout: React.FC<MarketingLayoutProps> = ({ children, title }) =>
|
||||
))}
|
||||
</Head>
|
||||
<MatomoTracker config={analytics?.matomo} />
|
||||
<div className="min-h-screen bg-white">
|
||||
<header className="sticky top-0 z-40 border-b border-gray-200/60 bg-white/95 backdrop-blur">
|
||||
<div className="min-h-screen bg-white text-gray-900 dark:bg-gray-950 dark:text-gray-50 transition-colors">
|
||||
<header className="sticky top-0 z-40 border-b border-gray-200/60 bg-white/95 backdrop-blur dark:border-gray-800/60 dark:bg-gray-900/80">
|
||||
<div className="container mx-auto flex items-center justify-between px-4 py-4">
|
||||
<Link
|
||||
href={localizedPath('/')}
|
||||
className="flex items-center gap-3 text-gray-900"
|
||||
className="flex items-center gap-3 text-gray-900 dark:text-gray-50"
|
||||
onClick={() => setMobileMenuOpen(false)}
|
||||
>
|
||||
<img src="/logo-transparent-md.png" alt="Fotospiel App Logo" className="h-10 w-auto" />
|
||||
@@ -184,10 +184,10 @@ const MarketingLayout: React.FC<MarketingLayoutProps> = ({ children, title }) =>
|
||||
{navLinks.map((item) => (
|
||||
item.children ? (
|
||||
<div key={item.key} className="relative group">
|
||||
<span className="inline-flex cursor-default items-center gap-1 text-md font-md text-gray-700 transition-colors group-hover:text-pink-600 font-sans-marketing">
|
||||
<span className="inline-flex cursor-default items-center gap-1 text-md font-md text-gray-700 transition-colors group-hover:text-pink-600 dark:text-gray-200 dark:group-hover:text-pink-300 font-sans-marketing">
|
||||
{item.label}
|
||||
<svg
|
||||
className="h-4 w-4 text-gray-400 transition group-hover:text-pink-500"
|
||||
className="h-4 w-4 text-gray-400 transition group-hover:text-pink-500 dark:text-gray-500"
|
||||
viewBox="0 0 20 20"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
@@ -196,12 +196,12 @@ const MarketingLayout: React.FC<MarketingLayoutProps> = ({ children, title }) =>
|
||||
<path d="M6 8L10 12L14 8" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" />
|
||||
</svg>
|
||||
</span>
|
||||
<div className="absolute left-0 top-full hidden min-w-[220px] flex-col gap-1 rounded-xl border border-gray-100 bg-white p-3 text-sm shadow-xl shadow-rose-200/50 transition group-hover:flex group-focus-within:flex">
|
||||
<div className="absolute left-0 top-full hidden min-w-[220px] flex-col gap-1 rounded-xl border border-gray-100 bg-white p-3 text-sm shadow-xl shadow-rose-200/50 transition group-hover:flex group-focus-within:flex dark:border-gray-800 dark:bg-gray-900">
|
||||
{item.children.map((child) => (
|
||||
<Link
|
||||
key={child.key}
|
||||
href={child.href}
|
||||
className="rounded-lg px-3 py-2 font-medium text-gray-600 transition hover:bg-rose-50 hover:text-pink-600 font-sans-marketing"
|
||||
className="rounded-lg px-3 py-2 font-medium text-gray-600 transition hover:bg-rose-50 hover:text-pink-600 dark:text-gray-100 dark:hover:bg-gray-800 dark:hover:text-pink-300 font-sans-marketing"
|
||||
onClick={() => setMobileMenuOpen(false)}
|
||||
>
|
||||
{child.label}
|
||||
@@ -213,7 +213,7 @@ const MarketingLayout: React.FC<MarketingLayoutProps> = ({ children, title }) =>
|
||||
<Link
|
||||
key={item.key}
|
||||
href={item.href}
|
||||
className="text-md font-md text-gray-700 transition hover:text-pink-600 font-sans-marketing"
|
||||
className="text-md font-md text-gray-700 transition hover:text-pink-600 dark:text-gray-100 dark:hover:text-pink-300 font-sans-marketing"
|
||||
onClick={() => setMobileMenuOpen(false)}
|
||||
>
|
||||
{item.label}
|
||||
@@ -235,14 +235,14 @@ const MarketingLayout: React.FC<MarketingLayoutProps> = ({ children, title }) =>
|
||||
<Button
|
||||
variant="outline"
|
||||
size="icon"
|
||||
className="rounded-full border-gray-200 text-gray-600 transition hover:border-pink-200 hover:text-pink-500"
|
||||
className="rounded-full border-gray-200 text-gray-600 transition hover:border-pink-200 hover:text-pink-500 dark:border-gray-700 dark:text-gray-200 dark:hover:border-pink-400 dark:hover:text-pink-300"
|
||||
>
|
||||
<MoreHorizontal className="h-4 w-4" />
|
||||
<span className="sr-only">{t('nav.preferences', 'Einstellungen')}</span>
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent align="end" className="w-56 space-y-1 p-2">
|
||||
<DropdownMenuLabel className="font-sans-marketing text-xs uppercase tracking-wide text-gray-400">
|
||||
<DropdownMenuContent align="end" className="w-56 space-y-1 p-2 dark:border-gray-800 dark:bg-gray-900">
|
||||
<DropdownMenuLabel className="font-sans-marketing text-xs uppercase tracking-wide text-gray-400 dark:text-gray-500">
|
||||
{t('nav.preferences', 'Einstellungen')}
|
||||
</DropdownMenuLabel>
|
||||
<DropdownMenuItem
|
||||
@@ -250,13 +250,13 @@ const MarketingLayout: React.FC<MarketingLayoutProps> = ({ children, title }) =>
|
||||
event.preventDefault();
|
||||
toggleTheme();
|
||||
}}
|
||||
className="flex items-center gap-2 font-sans-marketing"
|
||||
className="flex items-center gap-2 font-sans-marketing dark:text-gray-100"
|
||||
>
|
||||
{themeIsDark ? <Sun className="h-4 w-4" /> : <Moon className="h-4 w-4" />}
|
||||
<span>{themeLabel}</span>
|
||||
</DropdownMenuItem>
|
||||
<DropdownMenuSeparator />
|
||||
<DropdownMenuLabel className="font-sans-marketing text-xs uppercase tracking-wide text-gray-400">
|
||||
<DropdownMenuLabel className="font-sans-marketing text-xs uppercase tracking-wide text-gray-400 dark:text-gray-500">
|
||||
{t('nav.language', 'Sprache')}
|
||||
</DropdownMenuLabel>
|
||||
<DropdownMenuRadioGroup value={activeLocale} onValueChange={handleLocaleChange}>
|
||||
@@ -264,7 +264,7 @@ const MarketingLayout: React.FC<MarketingLayoutProps> = ({ children, title }) =>
|
||||
<DropdownMenuRadioItem
|
||||
key={code}
|
||||
value={code}
|
||||
className="flex items-center gap-2 font-sans-marketing"
|
||||
className="flex items-center gap-2 font-sans-marketing dark:text-gray-100"
|
||||
>
|
||||
<Languages className="h-4 w-4" />
|
||||
<span>{code.toUpperCase()}</span>
|
||||
@@ -274,7 +274,7 @@ const MarketingLayout: React.FC<MarketingLayoutProps> = ({ children, title }) =>
|
||||
<DropdownMenuSeparator />
|
||||
{user ? (
|
||||
<>
|
||||
<DropdownMenuLabel className="font-sans-marketing text-xs uppercase tracking-wide text-gray-400">
|
||||
<DropdownMenuLabel className="font-sans-marketing text-xs uppercase tracking-wide text-gray-400 dark:text-gray-500">
|
||||
{user.name ?? user.email}
|
||||
</DropdownMenuLabel>
|
||||
<DropdownMenuItem
|
||||
@@ -282,7 +282,7 @@ const MarketingLayout: React.FC<MarketingLayoutProps> = ({ children, title }) =>
|
||||
event.preventDefault();
|
||||
router.visit('/event-admin');
|
||||
}}
|
||||
className="flex items-center gap-2 font-sans-marketing"
|
||||
className="flex items-center gap-2 font-sans-marketing dark:text-gray-100"
|
||||
>
|
||||
<LayoutDashboard className="h-4 w-4" />
|
||||
<span>{t('nav.dashboard', 'Zum Admin-Bereich')}</span>
|
||||
@@ -292,7 +292,7 @@ const MarketingLayout: React.FC<MarketingLayoutProps> = ({ children, title }) =>
|
||||
event.preventDefault();
|
||||
handleLogout();
|
||||
}}
|
||||
className="flex items-center gap-2 font-sans-marketing"
|
||||
className="flex items-center gap-2 font-sans-marketing dark:text-gray-100"
|
||||
>
|
||||
<LogOut className="h-4 w-4" />
|
||||
<span>{t('nav.logout', 'Abmelden')}</span>
|
||||
@@ -305,7 +305,7 @@ const MarketingLayout: React.FC<MarketingLayoutProps> = ({ children, title }) =>
|
||||
event.preventDefault();
|
||||
router.visit(localizedPath('/login'));
|
||||
}}
|
||||
className="flex items-center gap-2 font-sans-marketing"
|
||||
className="flex items-center gap-2 font-sans-marketing dark:text-gray-100"
|
||||
>
|
||||
<LogIn className="h-4 w-4" />
|
||||
<span>{t('nav.login', 'Anmelden')}</span>
|
||||
@@ -316,7 +316,7 @@ const MarketingLayout: React.FC<MarketingLayoutProps> = ({ children, title }) =>
|
||||
</DropdownMenu>
|
||||
<button
|
||||
type="button"
|
||||
className="inline-flex h-10 w-10 items-center justify-center rounded-full border border-gray-200 bg-white text-gray-700 shadow-sm md:hidden"
|
||||
className="inline-flex h-10 w-10 items-center justify-center rounded-full border border-gray-200 bg-white text-gray-700 shadow-sm transition md:hidden dark:border-gray-700 dark:bg-gray-900 dark:text-gray-100"
|
||||
onClick={() => setMobileMenuOpen((open) => !open)}
|
||||
aria-label={mobileMenuOpen ? t('nav.close_menu', 'Menü schließen') : t('nav.open_menu', 'Menü öffnen')}
|
||||
>
|
||||
@@ -333,18 +333,18 @@ const MarketingLayout: React.FC<MarketingLayoutProps> = ({ children, title }) =>
|
||||
</div>
|
||||
</div>
|
||||
{mobileMenuOpen && (
|
||||
<div className="border-t border-gray-200 bg-white md:hidden">
|
||||
<div className="border-t border-gray-200 bg-white md:hidden dark:border-gray-800 dark:bg-gray-900">
|
||||
<div className="container mx-auto space-y-4 px-4 py-4">
|
||||
{navLinks.map((item) => (
|
||||
item.children ? (
|
||||
<div key={item.key} className="space-y-2">
|
||||
<p className="text-sm font-semibold text-gray-500">{item.label}</p>
|
||||
<p className="text-sm font-semibold text-gray-500 dark:text-gray-300">{item.label}</p>
|
||||
<div className="flex flex-col gap-2">
|
||||
{item.children.map((child) => (
|
||||
<Link
|
||||
key={child.key}
|
||||
href={child.href}
|
||||
className="rounded-lg border border-gray-100 px-3 py-2 text-sm font-medium text-gray-700 transition hover:border-pink-200 hover:bg-rose-50 hover:text-pink-600"
|
||||
className="rounded-lg border border-gray-100 px-3 py-2 text-sm font-medium text-gray-700 transition hover:border-pink-200 hover:bg-rose-50 hover:text-pink-600 dark:border-gray-800 dark:bg-gray-900 dark:text-gray-100 dark:hover:border-pink-400 dark:hover:bg-gray-800 dark:hover:text-pink-300"
|
||||
onClick={() => setMobileMenuOpen(false)}
|
||||
>
|
||||
{child.label}
|
||||
@@ -356,7 +356,7 @@ const MarketingLayout: React.FC<MarketingLayoutProps> = ({ children, title }) =>
|
||||
<Link
|
||||
key={item.key}
|
||||
href={item.href}
|
||||
className="block rounded-lg border border-gray-100 px-3 py-2 text-sm font-semibold text-gray-700 transition hover:border-pink-200 hover:bg-rose-50 hover:text-pink-600 font-sans-marketing"
|
||||
className="block rounded-lg border border-gray-100 px-3 py-2 text-sm font-semibold text-gray-700 transition hover:border-pink-200 hover:bg-rose-50 hover:text-pink-600 dark:border-gray-800 dark:bg-gray-900 dark:text-gray-100 dark:hover:border-pink-400 dark:hover:bg-gray-800 dark:hover:text-pink-300 font-sans-marketing"
|
||||
onClick={() => setMobileMenuOpen(false)}
|
||||
>
|
||||
{item.label}
|
||||
@@ -381,7 +381,7 @@ const MarketingLayout: React.FC<MarketingLayoutProps> = ({ children, title }) =>
|
||||
id="marketing-language-select-mobile"
|
||||
value={activeLocale}
|
||||
onChange={(event) => handleLocaleChange(event.target.value)}
|
||||
className="w-full rounded-lg border border-gray-200 bg-white px-3 py-2 text-sm font-medium text-gray-700 shadow-sm focus:border-pink-400 focus:outline-none focus:ring focus:ring-pink-200"
|
||||
className="w-full rounded-lg border border-gray-200 bg-white px-3 py-2 text-sm font-medium text-gray-700 shadow-sm focus:border-pink-400 focus:outline-none focus:ring focus:ring-pink-200 dark:border-gray-800 dark:bg-gray-900 dark:text-gray-100 dark:focus:border-pink-400 dark:focus:ring-pink-300"
|
||||
>
|
||||
{supportedLocales.map((code) => (
|
||||
<option key={code} value={code}>
|
||||
|
||||
Reference in New Issue
Block a user