updated gallery

resources/views/news/category.blade.php

@@ -1,30 +1,44 @@
 @extends('news.layout', [
     'metaTitle' => $category->name . ' — News',
+    'metaDescription' => $category->description ?: ('Announcements in the ' . $category->name . ' category.'),
+    'metaCanonical' => route('news.category', $category->slug),
 ])
 
 @section('news_content')
-<div class="container py-5">
-    <h1 class="mb-1">{{ $category->name }}</h1>
-    @if($category->description)
-        <p class="text-muted mb-4">{{ $category->description }}</p>
-    @endif
+@php
+    $headerBreadcrumbs = collect([
+        (object) ['name' => 'Community', 'url' => route('community.activity')],
+        (object) ['name' => 'Announcements', 'url' => route('news.index')],
+        (object) ['name' => $category->name, 'url' => route('news.category', $category->slug)],
+    ]);
+@endphp
 
-    <div class="row">
-        <div class="col-lg-8">
-            <div class="row">
-            @forelse($articles as $article)
-                <div class="col-sm-6 mb-4">
-                    @include('news._article_card', ['article' => $article])
+<x-nova-page-header
+    section="Community"
+    :title="$category->name"
+    icon="fa-folder-open"
+    :breadcrumbs="$headerBreadcrumbs"
+    :description="$category->description ?: ('Announcements filed under ' . $category->name . '.')"
+    headerClass="pb-6"
+/>
+
+<div class="mx-auto max-w-7xl px-6 pt-8 pb-16 md:px-10">
+    <div class="grid gap-8 xl:grid-cols-[minmax(0,1fr)_320px]">
+        <section>
+            @if($articles->isEmpty())
+                <div class="rounded-[28px] border border-white/[0.06] bg-white/[0.025] px-8 py-14 text-center text-white/45">No articles in this category yet.</div>
+            @else
+                <div class="grid gap-5 md:grid-cols-2">
+                    @foreach($articles as $article)
+                        @include('news._article_card', ['article' => $article])
+                    @endforeach
                 </div>
-            @empty
-                <div class="col-12 text-center text-muted py-5">No articles in this category.</div>
-            @endforelse
-            </div>
-            <div class="mt-3">{{ $articles->links() }}</div>
-        </div>
-        <div class="col-lg-4">
-            @include('news._sidebar', ['categories' => $categories])
-        </div>
+                <div class="mt-8 flex justify-center">{{ $articles->links() }}</div>
+            @endif
+        </section>
+        <aside class="space-y-4">
+            @include('news._sidebar', ['categories' => $categories, 'trending' => $trending, 'tags' => $tags])
+        </aside>
     </div>
 </div>
 @endsection