Resolve conflicts keeping DESIGN.md type scale, main blade fallbacks, and StableScreenshot visual helper. Regenerate browser baselines.
77 lines
3.8 KiB
PHP
77 lines
3.8 KiB
PHP
@extends('layouts.public')
|
|
|
|
@section('content')
|
|
<article data-motion="page-open">
|
|
<div class="border-b border-amare-border bg-amare-bg">
|
|
<div class="container-amare space-y-8 py-16 md:py-24">
|
|
<header class="max-w-3xl space-y-4">
|
|
@if (filled($case->event_type))
|
|
<p class="text-xs font-semibold uppercase tracking-[0.14em] text-amare-accent">{{ $case->event_type }}</p>
|
|
@endif
|
|
<h1 class="text-headline font-medium tracking-tight text-amare-text">{{ $case->title }}</h1>
|
|
<p class="text-lg text-amare-muted">{{ $case->summary }}</p>
|
|
<p class="text-sm break-words text-amare-muted">
|
|
@if ($case->city){{ $case->city }}@endif
|
|
@if ($case->venue) · {{ $case->venue }}@endif
|
|
@if ($case->event_date) · {{ $case->event_date->format('d/m/Y') }}@endif
|
|
</p>
|
|
</header>
|
|
|
|
@if (filled($case->cover_image_path))
|
|
<x-media.image
|
|
:path="$case->cover_image_path"
|
|
:alt="$case->cover_image_alt ?: $case->title"
|
|
loading="eager"
|
|
sizes="(max-width: 1024px) 100vw, 1120px"
|
|
class="img-editorial aspect-[16/9] w-full object-cover"
|
|
/>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
|
|
<div class="border-b border-amare-border bg-amare-bg-deep">
|
|
<div class="container-amare grid gap-10 py-16 md:grid-cols-3">
|
|
<section class="space-y-3">
|
|
<h2 class="text-xs font-semibold uppercase tracking-[0.14em] text-amare-accent">Desafio</h2>
|
|
<p class="text-amare-muted">{!! nl2br(e($case->challenge)) !!}</p>
|
|
</section>
|
|
<section class="space-y-3">
|
|
<h2 class="text-xs font-semibold uppercase tracking-[0.14em] text-amare-accent">Solução</h2>
|
|
<p class="text-amare-muted">{!! nl2br(e($case->solution)) !!}</p>
|
|
</section>
|
|
@if (filled($case->result))
|
|
<section class="space-y-3">
|
|
<h2 class="text-xs font-semibold uppercase tracking-[0.14em] text-amare-accent">Resultado</h2>
|
|
<p class="text-amare-muted">{!! nl2br(e($case->result)) !!}</p>
|
|
</section>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
|
|
@if ($case->images->isNotEmpty())
|
|
<section aria-labelledby="gallery-heading" class="bg-amare-bg">
|
|
<div class="container-amare space-y-8 py-16">
|
|
<h2 id="gallery-heading" class="text-3xl font-medium text-amare-text">Galeria</h2>
|
|
<div class="grid gap-6 md:grid-cols-2">
|
|
@foreach ($case->images as $image)
|
|
<figure class="space-y-2">
|
|
<x-media.image
|
|
:path="$image->path"
|
|
:alt="$image->alt_text"
|
|
sizes="(max-width: 768px) 100vw, 50vw"
|
|
class="img-editorial aspect-[4/3] w-full object-cover"
|
|
/>
|
|
@if (filled($image->caption))
|
|
<figcaption class="text-sm text-amare-muted">{{ $image->caption }}</figcaption>
|
|
@endif
|
|
</figure>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
</section>
|
|
@endif
|
|
</article>
|
|
|
|
<x-home.final-cta :settings="$siteSettings" />
|
|
@endsection
|