From 79cd7f7475cacd26d0b8d0d9083a1c425aba603c Mon Sep 17 00:00:00 2001
From: maro <mail@mgoth.de>
Date: Thu, 17 Sep 2026 17:07:34 +0200
Subject: [PATCH] Verbessere Lesbarkeit und Navigation im CMS

---
 app/(payload)/custom.css                    | 90 +++++++++++++++++++++
 components/admin/AdminAnalyticsView.tsx     |  3 +
 components/admin/AdminCalendarView.tsx      |  2 +
 components/admin/AdminConversationsView.tsx |  4 +-
 components/admin/AdminWelcome.tsx           |  1 -
 5 files changed, 98 insertions(+), 2 deletions(-)

diff --git a/app/(payload)/custom.css b/app/(payload)/custom.css
index 9b15daa..de560aa 100644
--- a/app/(payload)/custom.css
+++ b/app/(payload)/custom.css
@@ -100,6 +100,21 @@ select {
 .step-nav {
   background: var(--anouma-paper);
   border-bottom: 1px solid var(--anouma-line);
+  color: var(--anouma-plum);
+}
+
+.app-header a,
+.app-header button,
+.step-nav a,
+.step-nav span,
+.step-nav label {
+  color: var(--anouma-plum);
+}
+
+.app-header svg,
+.step-nav svg {
+  color: var(--anouma-plum);
+  fill: currentColor;
 }
 
 .template-default__wrap,
@@ -196,6 +211,81 @@ select:focus,
   background: #fbf7f4;
 }
 
+.collections {
+  color: var(--anouma-ink);
+}
+
+.collections__group {
+  margin-bottom: 28px;
+}
+
+.collections__label {
+  color: var(--anouma-ink) !important;
+  font-size: 20px;
+  font-weight: 650;
+  letter-spacing: -0.015em;
+  margin-bottom: 12px;
+}
+
+.collections__card-list {
+  gap: 10px;
+}
+
+.collections .card {
+  background: var(--anouma-paper) !important;
+  border: 1px solid var(--anouma-line);
+  border-radius: 5px;
+  box-shadow: 0 8px 22px rgb(52 44 49 / 5%);
+  color: var(--anouma-ink) !important;
+  min-height: 64px;
+}
+
+.collections .card:hover {
+  border-color: var(--anouma-mauve);
+}
+
+.collections .card__title {
+  color: var(--anouma-ink) !important;
+  font-weight: 600;
+}
+
+.collections .card__actions .btn {
+  color: var(--anouma-mauve);
+}
+
+textarea,
+input,
+select,
+.rs__control {
+  background: var(--anouma-paper) !important;
+  color: var(--anouma-ink) !important;
+}
+
+textarea::placeholder,
+input::placeholder {
+  color: #8b7b81;
+  opacity: 1;
+}
+
+.anouma-admin-back {
+  align-items: center;
+  border: 1px solid var(--anouma-line);
+  border-radius: 4px;
+  color: var(--anouma-plum);
+  display: inline-flex;
+  font-size: 13px;
+  font-weight: 650;
+  padding: 8px 12px;
+  text-decoration: none;
+}
+
+.anouma-admin-back:hover,
+.anouma-admin-back:focus-visible {
+  background: var(--anouma-paper);
+  border-color: var(--anouma-mauve);
+  color: var(--anouma-ink);
+}
+
 .anouma-admin-welcome {
   background: var(--anouma-paper);
   border: 1px solid var(--anouma-line);
diff --git a/components/admin/AdminAnalyticsView.tsx b/components/admin/AdminAnalyticsView.tsx
index e5ab9aa..20d7076 100644
--- a/components/admin/AdminAnalyticsView.tsx
+++ b/components/admin/AdminAnalyticsView.tsx
@@ -1,4 +1,5 @@
 import type { AdminViewServerProps } from "payload";
+import Link from "next/link";
 import { canViewAnalytics } from "@/access";
 import { RANGE_OPTIONS, resolveRange } from "@/lib/analytics/range";
 import { getDashboardComparison, percentDelta, type DashboardStats } from "@/lib/analytics/dashboardQueries";
@@ -73,6 +74,7 @@ export async function AdminAnalyticsView({ initPageResult }: AdminViewServerProp
   if (!canViewAnalytics({ req })) {
     return (
       <div className={styles.page}>
+        <Link href="/admin" className="anouma-admin-back">Zur Übersicht</Link>
         <h1 className={styles.title}>Auswertung</h1>
         <p className={styles.subtitle}>Du hast keine Berechtigung, diesen Bereich zu sehen.</p>
       </div>
@@ -102,6 +104,7 @@ export async function AdminAnalyticsView({ initPageResult }: AdminViewServerProp
 
   return (
     <div className={styles.page}>
+      <Link href="/admin" className="anouma-admin-back">Zur Übersicht</Link>
       <h1 className={styles.title}>Auswertung</h1>
       <p className={styles.subtitle}>Datensparsame Reichweitenmessung ohne personenbezogene Profile. Rohdaten werden {maxDaysBack} Tage aufbewahrt.</p>
 
diff --git a/components/admin/AdminCalendarView.tsx b/components/admin/AdminCalendarView.tsx
index 404231d..0350d99 100644
--- a/components/admin/AdminCalendarView.tsx
+++ b/components/admin/AdminCalendarView.tsx
@@ -1,4 +1,5 @@
 import type { AdminViewServerProps } from "payload";
+import Link from "next/link";
 import { getAdminCalendarItems, type AdminCalendarItem } from "@/lib/booking/adminCalendar";
 import { berlinParts } from "@/lib/calendar/timezone";
 import { CalendarFeedPanel } from "./CalendarFeedPanel";
@@ -98,6 +99,7 @@ export async function AdminCalendarView({ initPageResult }: AdminViewServerProps
 
   return (
     <div className={styles.page}>
+      <Link href="/admin" className="anouma-admin-back">Zur Übersicht</Link>
       <h1 className={styles.title}>Kalender</h1>
       <p className={styles.subtitle}>
         Alle bestätigten und vorgeschlagenen Termine, private Einzelbuchungen und öffentliche Veranstaltungen.
diff --git a/components/admin/AdminConversationsView.tsx b/components/admin/AdminConversationsView.tsx
index 29461d2..7de25c9 100644
--- a/components/admin/AdminConversationsView.tsx
+++ b/components/admin/AdminConversationsView.tsx
@@ -1,5 +1,6 @@
 "use client";
 
+import Link from "next/link";
 import { useEffect, useState } from "react";
 
 type Conversation = { id: string; subject: string; name: string; email: string; status: string; lastMessageAt?: string };
@@ -64,7 +65,8 @@ export function AdminConversationsView() {
 
   return (
     <main style={{ maxWidth: 1200, padding: "32px 24px" }}>
-      <h1 style={{ margin: 0, fontSize: 28 }}>Anfragen & Nachrichten</h1>
+      <Link href="/admin" className="anouma-admin-back">Zur Übersicht</Link>
+      <h1 style={{ margin: "18px 0 0", fontSize: 28 }}>Anfragen und Nachrichten</h1>
       <p style={{ margin: "8px 0 24px", color: "#66505f" }}>Kontakt- und Terminanfragen zentral bearbeiten. Antworten werden automatisch per E-Mail verschickt.</p>
       {error && <p style={{ color: "#a33", marginBottom: 16 }}>{error}</p>}
       <div style={{ display: "grid", gridTemplateColumns: "minmax(260px, .8fr) minmax(0, 1.4fr)", gap: 20, minHeight: 560 }}>
diff --git a/components/admin/AdminWelcome.tsx b/components/admin/AdminWelcome.tsx
index 5a2ebca..4707bf6 100644
--- a/components/admin/AdminWelcome.tsx
+++ b/components/admin/AdminWelcome.tsx
@@ -13,7 +13,6 @@ export function AdminWelcome() {
       <div className="anouma-admin-welcome__intro">
         <p className="anouma-admin-eyebrow">Anouma Verwaltung</p>
         <h1 id="anouma-admin-welcome-title">Was möchtest du heute erledigen?</h1>
-        <p>Hier findest du die wichtigsten Bereiche für Website, Anfragen und Termine an einem Ort.</p>
       </div>
       <div className="anouma-admin-quicklinks">
         {links.map((link, index) => (