@extends('layouts.site')

@section('content')
<section class="on-dark section !pb-16">
    <div class="wrap max-w-4xl">
        <p class="eyebrow">Insights</p>
        <h1 class="display">{{ $category ? $category : 'Notes from the work.' }}</h1>
        <p class="lead mt-6">Articles, guides and reports on software, AI and running a business on better systems.</p>
    </div>
</section>
<section class="on-light section !py-14">
    <div class="wrap">
        <div class="mb-10 flex flex-wrap gap-2" aria-label="Categories">
            <a class="chip {{ !$category && !$type ? 'bg-ink text-ice' : '' }}" href="{{ route('insights.index') }}">All</a>
            @foreach (config('webnedrix.insight_categories') as $c)
                <a class="chip {{ $category === $c ? 'bg-ink text-ice' : '' }}" href="{{ route('insights.category', \Illuminate\Support\Str::slug($c)) }}">{{ $c }}</a>
            @endforeach
        </div>
        @forelse ($posts as $p)
            <a href="{{ route('insights.show', $p->slug) }}" class="rule-row group">
                <span class="w-28 shrink-0 text-sm text-muted">{{ ($p->publish_at ?? $p->created_at)->format('j M Y') }}</span>
                <span class="flex-1"><span class="font-display text-2xl tracking-tight">{{ $p->title }}</span>@if ($p->excerpt)<span class="mt-1 block text-muted">{{ $p->excerpt }}</span>@endif</span>
                <span class="hidden text-sm text-muted sm:block">{{ $p->category }}</span>
            </a>
        @empty
            <p class="max-w-xl text-lg text-muted">The first articles are on the way.</p>
        @endforelse
        <div class="mt-10">{{ $posts->links() }}</div>
    </div>
</section>
<x-cta-band />
@endsection