Rebrand Hub+Flux
Some checks are pending
linter / quality (push) Waiting to run
tests / ci (push) Waiting to run

This commit is contained in:
Kevin Adametz 2026-05-20 15:44:15 +02:00
parent 0a3e52d603
commit 9b47296cea
130 changed files with 9357 additions and 3345 deletions

View file

@ -8,45 +8,64 @@ new #[Layout('components.layouts.app'), Title('Buchungen & Add-ons')] class exte
{
}; ?>
<div class="space-y-6">
<flux:card>
<div class="flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between">
<div>
<flux:heading size="lg">{{ __('Buchungen & Add-ons') }}</flux:heading>
<flux:subheading>
{{ __('Hier werden künftig gebuchte Leistungen, Add-ons und Erweiterungen für Ihre Firmen gebündelt.') }}
</flux:subheading>
<div class="space-y-8">
{{-- ============== PAGE HEADER ============== --}}
<header class="grid items-end gap-8" style="grid-template-columns:1fr auto;">
<div class="min-w-0">
<div class="flex items-center gap-3 mb-3 flex-wrap">
<span class="badge hub dot">{{ __('User Backend') }}</span>
<span class="eyebrow muted">{{ __('Mein Bereich · Finanzen') }}</span>
<span class="badge warn">{{ __('In Vorbereitung') }}</span>
</div>
<flux:badge color="zinc" icon="shopping-bag" size="lg">
{{ __('In Vorbereitung') }}
</flux:badge>
<h1 class="text-[30px] font-bold tracking-[-0.6px] leading-[1.15] m-0 text-[color:var(--color-ink)]">
{{ __('Buchungen & Add-ons') }}
</h1>
<p class="text-[13px] leading-[1.55] mt-2 m-0 max-w-[640px] text-[color:var(--color-ink-2)]">
{{ __('Hier werden künftig gebuchte Leistungen, Add-ons und Erweiterungen für Ihre Firmen gebündelt.') }}
</p>
</div>
</flux:card>
</header>
<flux:callout color="blue" icon="information-circle">
{{ __('Der Bereich ist bereits in der Navigation vorbereitet. Buchbare Add-ons werden aktiviert, sobald das Preismodell und die Zahlungslogik final sind.') }}
</flux:callout>
<div class="grid gap-4 md:grid-cols-2 xl:grid-cols-3">
<flux:card>
<flux:heading size="sm">{{ __('Firmenbezogene Add-ons') }}</flux:heading>
<flux:text class="mt-2 text-sm text-zinc-500">
{{ __('Zum Beispiel zusätzliche Sichtbarkeit, Verifizierung oder besondere Platzierungen.') }}
</flux:text>
</flux:card>
<flux:card>
<flux:heading size="sm">{{ __('Credits & Tarif') }}</flux:heading>
<flux:text class="mt-2 text-sm text-zinc-500">
{{ __('Tarif- und Credit-Informationen folgen, sobald das neue Preismodell live ist.') }}
</flux:text>
</flux:card>
<flux:card>
<flux:heading size="sm">{{ __('Zahlungsarten') }}</flux:heading>
<flux:text class="mt-2 text-sm text-zinc-500">
{{ __('Zahlungsarten werden später unter Finanzen eingebunden.') }}
</flux:text>
</flux:card>
<div class="px-4 py-3 rounded-[5px] border text-[12.5px] flex items-start gap-3
bg-[color:var(--color-hub-soft)] border-[color:var(--color-hub-soft-2)] text-[color:var(--color-ink-2)]">
<flux:icon.information-circle class="size-[16px] flex-shrink-0 mt-0.5 text-[color:var(--color-hub)]" />
<div class="flex-1">
{{ __('Der Bereich ist bereits in der Navigation vorbereitet. Buchbare Add-ons werden aktiviert, sobald das Preismodell und die Zahlungslogik final sind.') }}
</div>
</div>
<section class="grid gap-4 md:grid-cols-2 xl:grid-cols-3">
<article class="panel">
<div class="panel-head">
<span class="section-eyebrow">{{ __('Firmenbezogene Add-ons') }}</span>
</div>
<div class="p-5">
<p class="text-[12.5px] text-[color:var(--color-ink-3)] m-0">
{{ __('Zum Beispiel zusätzliche Sichtbarkeit, Verifizierung oder besondere Platzierungen.') }}
</p>
</div>
</article>
<article class="panel">
<div class="panel-head">
<span class="section-eyebrow">{{ __('Credits & Tarif') }}</span>
</div>
<div class="p-5">
<p class="text-[12.5px] text-[color:var(--color-ink-3)] m-0">
{{ __('Tarif- und Credit-Informationen folgen, sobald das neue Preismodell live ist.') }}
</p>
</div>
</article>
<article class="panel">
<div class="panel-head">
<span class="section-eyebrow">{{ __('Zahlungsarten') }}</span>
</div>
<div class="p-5">
<p class="text-[12.5px] text-[color:var(--color-ink-3)] m-0">
{{ __('Zahlungsarten werden später unter Finanzen eingebunden.') }}
</p>
</div>
</article>
</section>
</div>