Kevin Adametz
df6b24518c
Geboostete PMs besetzen Lead- und Top-Slots vor der Chronologie (HomePageData/CategoryPageData ueber boosted()-Scope) und tragen das Badge "Top-Platzierung". Abgelaufene Boosts wirken nicht. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
64 lines
3.4 KiB
PHP
64 lines
3.4 KiB
PHP
@props([
|
|
'release' => null,
|
|
'index' => 1,
|
|
'first' => false,
|
|
'boosted' => false,
|
|
])
|
|
|
|
@php
|
|
$categoryName = $release?->localizedCategoryName();
|
|
$time = $release?->compactPublishedLabel();
|
|
$title = $release->title;
|
|
$company = $release?->company?->name;
|
|
$href = route('release.detail', ['slug' => $release->slug]);
|
|
$imageUrl = $release?->cardImageUrl();
|
|
$placeholderUrl = $imageUrl ? null : $release?->chosenPlaceholderUrl();
|
|
$gradient = 'linear-gradient(135deg,#3A4A5A,#6B7C95)';
|
|
$number = str_pad((string) $index, 2, '0', STR_PAD_LEFT);
|
|
@endphp
|
|
|
|
<article class="px-3.5 py-4 border-b border-bg-rule cursor-pointer transition-colors hover:bg-bg-elev group {{ $first ? 'border-t border-bg-rule-strong' : '' }}">
|
|
<a href="{{ $href }}" class="block cursor-pointer">
|
|
<div class="grid items-baseline gap-3 mb-2.5" style="grid-template-columns: 32px 1fr auto;">
|
|
<div class="font-serif text-[18px] text-brand font-medium leading-none tabular-nums">{{ $number }}</div>
|
|
<span class="bp-cat">{{ $categoryName }}</span>
|
|
<span class="font-mono text-[11px] text-ink-3">{{ $time }}</span>
|
|
</div>
|
|
|
|
<div class="grid items-start gap-3" style="grid-template-columns: 32px 64px 1fr;">
|
|
<div></div>
|
|
|
|
<div class="w-16 h-16 flex-shrink-0 relative overflow-hidden" style="background: {{ $gradient }};">
|
|
@if ($imageUrl)
|
|
<img src="{{ $imageUrl }}" alt="" class="absolute inset-0 h-full w-full object-cover transition-transform group-hover:scale-105" loading="lazy">
|
|
@elseif ($placeholderUrl)
|
|
<img src="{{ $placeholderUrl }}" alt="" aria-hidden="true" class="absolute inset-0 h-full w-full object-cover transition-transform group-hover:scale-105" loading="lazy">
|
|
@else
|
|
<svg width="64" height="64" viewBox="0 0 64 64" class="absolute inset-0" aria-hidden="true">
|
|
<circle cx="48" cy="20" r="18" fill="rgba(255,255,255,0.08)" />
|
|
<rect x="6" y="40" width="36" height="2" fill="rgba(255,255,255,0.18)" />
|
|
<rect x="6" y="46" width="24" height="2" fill="rgba(255,255,255,0.12)" />
|
|
</svg>
|
|
@endif
|
|
</div>
|
|
|
|
<div>
|
|
<h3 class="font-serif text-[15.5px] leading-[1.3] m-0 font-medium tracking-[-0.1px] text-ink group-hover:text-brand transition-colors">
|
|
{{ $title }}
|
|
@if ($boosted)
|
|
<span class="inline-flex items-center whitespace-nowrap align-middle border border-brand/30 bg-brand/[0.04] px-1.5 py-px font-mono text-[9.5px] font-bold uppercase tracking-[0.1em] text-brand">
|
|
{{ __('web.shared.boosted_placement') }}
|
|
</span>
|
|
@endif
|
|
</h3>
|
|
<div class="text-[11.5px] text-ink-3 mt-1.5 flex items-center gap-1.5">
|
|
<svg width="10" height="10" viewBox="0 0 11 11" class="text-ok flex-shrink-0" aria-hidden="true">
|
|
<circle cx="5.5" cy="5.5" r="5" fill="currentColor" />
|
|
<path d="M3 5.5l1.8 1.8L8 4" stroke="white" stroke-width="1.4" fill="none" stroke-linecap="round" />
|
|
</svg>
|
|
<span>{{ $company }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</article>
|