51 lines
2.5 KiB
PHP
51 lines
2.5 KiB
PHP
@props([
|
|
'headline' => '',
|
|
'sub' => '',
|
|
/** @var array<int, string> shown as a specification plate, not as a feature list */
|
|
'facts' => [],
|
|
])
|
|
|
|
{{--
|
|
The sign-in brand panel, shared by every guest page so they cannot drift
|
|
apart. An ink plate rather than a colour gradient: the public site presents
|
|
the product as a controlled document, and this is the same voice.
|
|
|
|
Hidden below `lg` — on a phone the form is the page, and a decorative half
|
|
would only push it under the fold.
|
|
--}}
|
|
<aside class="relative hidden w-[44%] shrink-0 overflow-hidden bg-plate lg:flex lg:flex-col lg:justify-between lg:p-12 xl:p-14">
|
|
{{-- Survey grid, faded out towards the bottom. --}}
|
|
<div aria-hidden="true" class="pointer-events-none absolute inset-0 opacity-60"
|
|
style="background-image:linear-gradient(var(--plate-rule) 1px,transparent 1px),linear-gradient(90deg,var(--plate-rule) 1px,transparent 1px);
|
|
background-size:76px 76px;
|
|
mask-image:radial-gradient(ellipse 78% 62% at 30% 8%,#000 0%,transparent 72%);
|
|
-webkit-mask-image:radial-gradient(ellipse 78% 62% at 30% 8%,#000 0%,transparent 72%);"></div>
|
|
|
|
<div class="relative flex items-center gap-2.5">
|
|
<x-ui.logo class="size-8" />
|
|
<span class="font-serif text-xl font-semibold tracking-tight text-white">CluPilot</span>
|
|
</div>
|
|
|
|
<div class="relative">
|
|
<p class="mb-6 flex items-center gap-3 font-mono text-[11px] uppercase tracking-[0.16em] text-plate-muted">
|
|
<span class="h-px w-6 bg-accent"></span>{{ __('auth.brand_eyebrow') }}
|
|
</p>
|
|
|
|
<h2 class="max-w-md font-serif text-4xl font-semibold leading-[1.08] tracking-tight text-white xl:text-[2.9rem]">{{ $headline }}</h2>
|
|
<p class="mt-5 max-w-sm leading-relaxed text-plate-text">{{ $sub }}</p>
|
|
|
|
@if ($facts !== [])
|
|
<dl class="mt-10 max-w-sm border-t border-plate-rule">
|
|
@foreach ($facts as $term => $value)
|
|
<div class="flex items-baseline justify-between gap-6 border-b border-plate-rule py-3">
|
|
<dt class="text-sm text-plate-muted">{{ $term }}</dt>
|
|
<dd class="text-right text-sm font-medium text-white">{{ $value }}</dd>
|
|
</div>
|
|
@endforeach
|
|
</dl>
|
|
@endif
|
|
</div>
|
|
|
|
<p class="relative font-mono text-[11px] uppercase tracking-[0.14em] text-plate-muted">{{ __('auth.brand_footer') }}</p>
|
|
</aside>
|