@extends('layouts.app')

@php($__title = $category->title.' — блог teeu')
@php($__description = $category->description ?: 'Статьи блога teeu по теме «'.$category->title.'».')

@section('title', $__title)
@section('meta_description', $__description)

@section('seo')
    @include('partials.seo.meta', [
        'canonical' => \App\Support\Seo::listingCanonical(route('blog.category', $category->slug), $posts->currentPage()),
        'ogTitle' => $__title,
        'ogDescription' => $__description,
    ])
    @include('partials.seo.json-ld', ['data' => \App\Support\Seo::breadcrumbJsonLd([
        ['name' => 'Главная', 'url' => route('home')],
        ['name' => 'Блог', 'url' => route('blog.index')],
        ['name' => $category->title, 'url' => route('blog.category', $category->slug)],
    ])])
@endsection

@section('content')
    <div class="mx-auto w-full max-w-6xl">
        @include('partials.blog.crumbs', ['trail' => [
            ['name' => $category->title, 'url' => route('blog.category', $category->slug)],
        ]])

        <h1 class="mt-4 text-3xl font-extrabold tracking-tight text-[var(--color-ink)]">{{ $category->title }}</h1>
        @if ($category->description)
            <p class="mt-2 max-w-2xl text-[17px] leading-relaxed text-[var(--color-slate)]">{{ $category->description }}</p>
        @endif

        @include('partials.blog.topics', ['categories' => $categories, 'active' => $category->id])

        @if ($posts->isEmpty())
            <div class="mt-8 rounded-[var(--radius-lg)] border border-dashed border-[var(--color-line)] bg-white p-10 text-center text-[var(--color-muted)]">
                В этой теме пока нет статей.
            </div>
        @else
            <div class="mt-6 grid gap-5 sm:grid-cols-2 lg:grid-cols-3">
                @foreach ($posts as $post)
                    @include('partials.blog.card', ['post' => $post])
                @endforeach
            </div>
            <div class="mt-8">{{ $posts->links() }}</div>
        @endif
    </div>
@endsection