updated gallery
This commit is contained in:
@@ -1,31 +1,37 @@
|
||||
{{-- Reusable article card partial --}}
|
||||
<div class="card h-100 border-0 shadow-sm news-card">
|
||||
@if($article->cover_url)
|
||||
<a href="{{ route('news.show', $article->slug) }}">
|
||||
<img src="{{ $article->cover_url }}" class="card-img-top"
|
||||
alt="{{ $article->title }}"
|
||||
style="height:180px;object-fit:cover;">
|
||||
</a>
|
||||
@endif
|
||||
<div class="card-body d-flex flex-column">
|
||||
@if($article->category)
|
||||
<a href="{{ route('news.category', $article->category->slug) }}"
|
||||
class="badge badge-primary mb-2 align-self-start">{{ $article->category->name }}</a>
|
||||
@endif
|
||||
<article class="group overflow-hidden rounded-[28px] border border-white/[0.06] bg-[linear-gradient(180deg,rgba(11,16,26,0.94),rgba(7,11,19,0.92))] shadow-[0_18px_45px_rgba(0,0,0,0.22)] transition hover:-translate-y-0.5 hover:border-white/[0.12]">
|
||||
<a href="{{ route('news.show', $article->slug) }}" class="block">
|
||||
<div class="relative aspect-[16/9] overflow-hidden bg-black/20">
|
||||
@if($article->cover_url)
|
||||
<img src="{{ $article->cover_url }}" alt="{{ $article->title }}" class="h-full w-full object-cover transition duration-300 group-hover:scale-[1.04]">
|
||||
@else
|
||||
<div class="absolute inset-0 bg-[radial-gradient(circle_at_top_left,rgba(56,189,248,0.14),transparent_45%),linear-gradient(180deg,rgba(15,23,42,0.92),rgba(2,6,23,0.98))]"></div>
|
||||
@endif
|
||||
<div class="absolute inset-0 bg-gradient-to-t from-[#020611cc] via-transparent to-transparent"></div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<h6 class="card-title mb-1">
|
||||
<a href="{{ route('news.show', $article->slug) }}" class="text-dark text-decoration-none">
|
||||
{{ $article->title }}
|
||||
</a>
|
||||
</h6>
|
||||
<div class="flex h-full flex-col p-5">
|
||||
<div class="flex flex-wrap items-center gap-2">
|
||||
@if($article->category)
|
||||
<a href="{{ route('news.category', $article->category->slug) }}" class="inline-flex items-center rounded-full border border-sky-400/20 bg-sky-500/10 px-2.5 py-1 text-[11px] font-semibold uppercase tracking-[0.14em] text-sky-200">{{ $article->category->name }}</a>
|
||||
@endif
|
||||
<span class="text-[11px] uppercase tracking-[0.16em] text-white/30">{{ $article->published_at?->format('d M Y') }}</span>
|
||||
</div>
|
||||
|
||||
<h3 class="mt-3 text-xl font-semibold leading-tight text-white/95">
|
||||
<a href="{{ route('news.show', $article->slug) }}" class="transition hover:text-sky-200">{{ $article->title }}</a>
|
||||
</h3>
|
||||
|
||||
@if($article->excerpt)
|
||||
<p class="card-text text-muted small flex-grow-1">{{ Str::limit($article->excerpt, 100) }}</p>
|
||||
<p class="mt-3 flex-1 text-sm leading-7 text-white/55">{{ Str::limit(strip_tags((string) $article->excerpt), 135) }}</p>
|
||||
@endif
|
||||
|
||||
<div class="text-muted small mt-2 d-flex justify-content-between">
|
||||
<span>{{ $article->published_at?->format('d M Y') }}</span>
|
||||
<span><i class="fas fa-eye mr-1"></i>{{ number_format($article->views) }}</span>
|
||||
<div class="mt-4 flex items-center justify-between gap-3 text-sm text-white/40">
|
||||
<span class="truncate">{{ $article->author?->name ?? 'Skinbase' }}</span>
|
||||
<span class="shrink-0 inline-flex items-center gap-1.5">
|
||||
<i class="fa-regular fa-eye text-[11px]"></i>
|
||||
{{ number_format((int) $article->views) }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
Reference in New Issue
Block a user