5.4 (Teil 3): page-header in users/* + contacts/* umgestellt

Sieben weitere Header auf <x-portal.page-header>:
- users (index), users/create, contacts/index, contacts/create (Standard;
  contacts/create mit bedingtem 'Firma vorausgewaehlt'-Badge via :meta)
- users/show, users/edit (ID + Portal + Aktiv/Inaktiv-Badges via :meta,
  dynamischer Titel/Beschreibung aus User-Daten)
- contacts/edit (ID + Portal-Label via :meta, ohne Beschreibung)

Component: break-words am H1 ergaenzt (fuer lange Namen/E-Mails in show/edit;
bei kurzen Titeln ein No-op). User-/Contact-Tests (129) gruen.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

resources/views/components/portal/page-header.blade.php

@@ -32,7 +32,7 @@
             {{ $meta ?? '' }}
         </div>
 
-        <h1 class="text-[30px] font-bold tracking-[-0.6px] leading-[1.15] m-0 text-[color:var(--color-ink)]">
+        <h1 class="text-[30px] font-bold tracking-[-0.6px] leading-[1.15] m-0 text-[color:var(--color-ink)] break-words">
             {{ $title }}
         </h1>
 

resources/views/livewire/admin/contacts/create.blade.php

@@ -141,29 +141,23 @@ new #[Layout('components.layouts.app'), Title('Kontakt anlegen')] class extends
 
 <form wire:submit="save" class="space-y-8">
     {{-- ============== PAGE HEADER ============== --}}
-    <header class="page-header">
-        <div class="min-w-0">
-            <div class="flex items-center gap-3 mb-3 flex-wrap">
-                <span class="badge hub dot">{{ __('Admin Backend') }}</span>
-                <span class="eyebrow muted">{{ __('Administration · Pressekontakte') }}</span>
-                @if ($isCompanyPrefilled && $companyId)
-                    <span class="badge hub">{{ __('Firma vorausgewählt') }}</span>
-                @endif
-            </div>
-            <h1 class="text-[30px] font-bold tracking-[-0.6px] leading-[1.15] m-0 text-[color:var(--color-ink)]">
-                {{ __('Kontakt anlegen') }}
-            </h1>
-            <p class="text-[13px] leading-[1.55] mt-2 m-0 max-w-[640px] text-[color:var(--color-ink-2)]">
-                {{ __('Kontakt einer Firma zuordnen und Stammdaten erfassen.') }}
-            </p>
-        </div>
-
-        <div class="flex items-center gap-2 flex-shrink-0">
+    <x-portal.page-header
+        :badge="__('Admin Backend')"
+        :eyebrow="__('Administration · Pressekontakte')"
+        :title="__('Kontakt anlegen')"
+        :description="__('Kontakt einer Firma zuordnen und Stammdaten erfassen.')"
+    >
+        @if ($isCompanyPrefilled && $companyId)
+            <x-slot:meta>
+                <span class="badge hub">{{ __('Firma vorausgewählt') }}</span>
+            </x-slot:meta>
+        @endif
+        <x-slot:actions>
             <flux:button variant="filled" icon="arrow-left" href="{{ route('admin.contacts.index') }}" wire:navigate>
                 {{ __('Zurück') }}
             </flux:button>
-        </div>
-    </header>
+        </x-slot:actions>
+    </x-portal.page-header>
 
     <article class="panel">
         <div class="panel-head">

resources/views/livewire/admin/contacts/edit.blade.php

@@ -176,25 +176,20 @@ new #[Layout('components.layouts.app'), Title('Kontakt bearbeiten')] class exten
 <div class="space-y-8">
     <form wire:submit="save" class="space-y-8">
         {{-- ============== PAGE HEADER ============== --}}
-        <header class="page-header">
-            <div class="min-w-0">
-                <div class="flex items-center gap-3 mb-3 flex-wrap">
-                    <span class="badge hub dot">{{ __('Admin Backend') }}</span>
-                    <span class="eyebrow muted">{{ __('Administration · Pressekontakte') }}</span>
-                    <span class="badge hub">ID #{{ $id }}</span>
-                    <span class="badge hub">{{ $this->currentPortalLabel() }}</span>
-                </div>
-                <h1 class="text-[30px] font-bold tracking-[-0.6px] leading-[1.15] m-0 text-[color:var(--color-ink)]">
-                    {{ __('Kontakt bearbeiten') }}
-                </h1>
-            </div>
-
-            <div class="flex items-center gap-2 flex-shrink-0">
+        <x-portal.page-header
+            :eyebrow="__('Administration · Pressekontakte')"
+            :title="__('Kontakt bearbeiten')"
+        >
+            <x-slot:meta>
+                <span class="badge hub">ID #{{ $id }}</span>
+                <span class="badge hub">{{ $this->currentPortalLabel() }}</span>
+            </x-slot:meta>
+            <x-slot:actions>
                 <flux:button variant="filled" icon="arrow-left" href="{{ route('admin.contacts.index') }}" wire:navigate>
                     {{ __('Zurück') }}
                 </flux:button>
-            </div>
-        </header>
+            </x-slot:actions>
+        </x-portal.page-header>
 
         <article class="panel">
             <div class="panel-head">

resources/views/livewire/admin/contacts/index.blade.php

@@ -367,21 +367,13 @@ new #[Layout('components.layouts.app'), Title('Kontakte')] class extends Compone
 
 <div class="space-y-8">
     {{-- ============== PAGE HEADER ============== --}}
-    <header class="page-header">
-        <div class="min-w-0">
-            <div class="flex items-center gap-3 mb-3 flex-nowrap whitespace-nowrap">
-                <span class="badge hub dot">{{ __('Admin Backend') }}</span>
-                <span class="eyebrow muted">{{ __('Administration · Pressekontakte') }}</span>
-            </div>
-            <h1 class="text-[30px] font-bold tracking-[-0.6px] leading-[1.15] m-0 text-[color:var(--color-ink)]">
-                {{ __('Kontakte') }}
-            </h1>
-            <p class="text-[13px] leading-[1.55] mt-2 m-0 max-w-[640px] text-[color:var(--color-ink-2)]">
-                {{ __('Pressekontakte aller Firmen über alle Portale hinweg.') }}
-            </p>
-        </div>
-
-        <div class="flex items-center gap-2 flex-shrink-0">
+    <x-portal.page-header
+        :badge="__('Admin Backend')"
+        :eyebrow="__('Administration · Pressekontakte')"
+        :title="__('Kontakte')"
+        :description="__('Pressekontakte aller Firmen über alle Portale hinweg.')"
+    >
+        <x-slot:actions>
             @if (\Illuminate\Support\Facades\Route::has('admin.contacts.create'))
                 <flux:button variant="primary" icon="plus" href="{{ route('admin.contacts.create') }}" wire:navigate>
                     {{ __('Neuer Kontakt') }}
@@ -391,8 +383,8 @@ new #[Layout('components.layouts.app'), Title('Kontakte')] class extends Compone
                     {{ __('Neuer Kontakt') }}
                 </flux:button>
             @endif
-        </div>
-    </header>
+        </x-slot:actions>
+    </x-portal.page-header>
 
     @if ($notification)
         <div x-data="{ show: true }" x-init="setTimeout(() => show = false, 3000)" x-show="show" x-transition

resources/views/livewire/admin/users.blade.php

@@ -298,26 +298,18 @@ new #[Layout('components.layouts.app'), Title('Benutzer')] class extends Compone
 
 <div class="space-y-8">
     {{-- ============== PAGE HEADER ============== --}}
-    <header class="page-header">
-        <div class="min-w-0">
-            <div class="flex items-center gap-3 mb-3 flex-nowrap whitespace-nowrap">
-                <span class="badge hub dot">{{ __('Admin Backend') }}</span>
-                <span class="eyebrow muted">{{ __('Administration · User-Verwaltung') }}</span>
-            </div>
-            <h1 class="text-[30px] font-bold tracking-[-0.6px] leading-[1.15] m-0 text-[color:var(--color-ink)]">
-                {{ __('Benutzer') }}
-            </h1>
-            <p class="text-[13px] leading-[1.55] mt-2 m-0 max-w-[640px] text-[color:var(--color-ink-2)]">
-                {{ __('Alle Konten der Plattform mit Rollen, Berechtigungen und Migrations-/Pflegefällen.') }}
-            </p>
-        </div>
-
-        <div class="flex items-center gap-2 flex-shrink-0">
+    <x-portal.page-header
+        :badge="__('Admin Backend')"
+        :eyebrow="__('Administration · User-Verwaltung')"
+        :title="__('Benutzer')"
+        :description="__('Alle Konten der Plattform mit Rollen, Berechtigungen und Migrations-/Pflegefällen.')"
+    >
+        <x-slot:actions>
             <flux:button variant="primary" icon="plus" href="{{ route('admin.users.create') }}" wire:navigate>
                 {{ __('Benutzer anlegen') }}
             </flux:button>
-        </div>
-    </header>
+        </x-slot:actions>
+    </x-portal.page-header>
 
     {{-- ============== KPI-Reihe ============== --}}
     <section class="grid grid-cols-1 gap-4 sm:grid-cols-3">

resources/views/livewire/admin/users/create.blade.php

@@ -210,26 +210,18 @@ new #[Layout('components.layouts.app'), Title('Benutzer anlegen')] class extends
 
 <form wire:submit="save" class="space-y-8">
     {{-- ============== PAGE HEADER ============== --}}
-    <header class="page-header">
-        <div class="min-w-0">
-            <div class="flex items-center gap-3 mb-3 flex-nowrap whitespace-nowrap">
-                <span class="badge hub dot">{{ __('Admin Backend') }}</span>
-                <span class="eyebrow muted">{{ __('Administration · Benutzer · Neu') }}</span>
-            </div>
-            <h1 class="text-[30px] font-bold tracking-[-0.6px] leading-[1.15] m-0 text-[color:var(--color-ink)]">
-                {{ __('Benutzer anlegen') }}
-            </h1>
-            <p class="text-[13px] leading-[1.55] mt-2 m-0 max-w-[640px] text-[color:var(--color-ink-2)]">
-                {{ __('Rollen, Firmen und optional Rechnungsadresse direkt mitsetzen.') }}
-            </p>
-        </div>
-
-        <div class="flex items-center gap-2 flex-shrink-0">
+    <x-portal.page-header
+        :badge="__('Admin Backend')"
+        :eyebrow="__('Administration · Benutzer · Neu')"
+        :title="__('Benutzer anlegen')"
+        :description="__('Rollen, Firmen und optional Rechnungsadresse direkt mitsetzen.')"
+    >
+        <x-slot:actions>
             <flux:button variant="filled" icon="arrow-left" href="{{ route('admin.users.index') }}" wire:navigate>
                 {{ __('Zurück') }}
             </flux:button>
-        </div>
-    </header>
+        </x-slot:actions>
+    </x-portal.page-header>
 
     <article class="panel">
         <div class="panel-head">

resources/views/livewire/admin/users/edit.blade.php

@@ -697,33 +697,26 @@ new #[Layout('components.layouts.app'), Title('Benutzer bearbeiten')] class exte
 
 <form wire:submit="save" class="space-y-8">
     {{-- ============== PAGE HEADER ============== --}}
-    <header class="page-header">
-        <div class="min-w-0">
-            <div class="flex items-center gap-3 mb-3 flex-wrap">
-                <span class="badge hub dot">{{ __('Admin Backend') }}</span>
-                <span class="eyebrow muted">{{ __('Administration · Benutzer · Bearbeiten') }}</span>
-                <span class="badge hub">ID #{{ $id }}</span>
-                <span class="badge hub">{{ strtoupper($portal) }}</span>
-                @if ($isActive)
-                    <span class="badge ok dot">{{ __('Aktiv') }}</span>
-                @else
-                    <span class="badge err dot">{{ __('Inaktiv') }}</span>
-                @endif
-            </div>
-            <h1 class="text-[30px] font-bold tracking-[-0.6px] leading-[1.15] m-0 text-[color:var(--color-ink)] break-words">
-                {{ $name ?: __('Benutzer bearbeiten') }}
-            </h1>
-            <p class="text-[13px] leading-[1.55] mt-2 m-0 max-w-[640px] text-[color:var(--color-ink-2)]">
-                {{ $email }}
-            </p>
-        </div>
-
-        <div class="flex items-center gap-2 flex-shrink-0">
+    <x-portal.page-header
+        :eyebrow="__('Administration · Benutzer · Bearbeiten')"
+        :title="$name ?: __('Benutzer bearbeiten')"
+        :description="$email"
+    >
+        <x-slot:meta>
+            <span class="badge hub">ID #{{ $id }}</span>
+            <span class="badge hub">{{ strtoupper($portal) }}</span>
+            @if ($isActive)
+                <span class="badge ok dot">{{ __('Aktiv') }}</span>
+            @else
+                <span class="badge err dot">{{ __('Inaktiv') }}</span>
+            @endif
+        </x-slot:meta>
+        <x-slot:actions>
             <flux:button variant="filled" icon="arrow-left" href="{{ route('admin.users.index') }}" wire:navigate>
                 {{ __('Zurück') }}
             </flux:button>
-        </div>
-    </header>
+        </x-slot:actions>
+    </x-portal.page-header>
 
     @if ($notification)
         <div x-data="{ show: true }" x-init="setTimeout(() => show = false, 4000)" x-show="show" x-transition

resources/views/livewire/admin/users/show.blade.php

@@ -73,33 +73,28 @@ new #[Layout('components.layouts.app'), Title('Benutzer anzeigen')] class extend
         </article>
     @else
         {{-- ============== PAGE HEADER ============== --}}
-        <header class="page-header">
-            <div class="min-w-0">
-                <div class="flex items-center gap-3 mb-3 flex-wrap">
-                    <span class="badge hub dot">{{ __('Admin Backend') }}</span>
-                    <span class="eyebrow muted">{{ __('Administration · Benutzer') }}</span>
-                    <span class="badge hub">ID #{{ $user->id }}</span>
-                    @if ($user->is_active)
-                        <span class="badge ok dot">{{ __('Aktiv') }}</span>
-                    @else
-                        <span class="badge err dot">{{ __('Inaktiv') }}</span>
-                    @endif
-                </div>
-                <h1 class="text-[30px] font-bold tracking-[-0.6px] leading-[1.15] m-0 text-[color:var(--color-ink)] break-words">
-                    {{ $user->name }}
-                </h1>
-                <p class="text-[13px] leading-[1.55] mt-2 m-0 max-w-[640px] text-[color:var(--color-ink-2)]">{{ $user->email }}</p>
-            </div>
-
-            <div class="flex items-center gap-2 flex-shrink-0">
+        <x-portal.page-header
+            :eyebrow="__('Administration · Benutzer')"
+            :title="$user->name"
+            :description="$user->email"
+        >
+            <x-slot:meta>
+                <span class="badge hub">ID #{{ $user->id }}</span>
+                @if ($user->is_active)
+                    <span class="badge ok dot">{{ __('Aktiv') }}</span>
+                @else
+                    <span class="badge err dot">{{ __('Inaktiv') }}</span>
+                @endif
+            </x-slot:meta>
+            <x-slot:actions>
                 <flux:button variant="filled" icon="arrow-left" href="{{ route('admin.users.index') }}" wire:navigate>
                     {{ __('Zurück') }}
                 </flux:button>
                 <flux:button variant="primary" icon="pencil" href="{{ route('admin.users.edit', $user->id) }}" wire:navigate>
                     {{ __('Bearbeiten') }}
                 </flux:button>
-            </div>
-        </header>
+            </x-slot:actions>
+        </x-portal.page-header>
 
         {{-- ============== KPI-Reihe ============== --}}
         <section class="grid grid-cols-1 gap-4 sm:grid-cols-2 xl:grid-cols-4">