up to date

resources/views/games/show.blade.php

@@ -6,9 +6,19 @@
 @section('og_title', $game->title . ' — LoreKeepers')
 @section('og_description', $game->summary ? Str::limit($game->summary, 155) : 'Track ' . $game->title . ' on LoreKeepers.')
 @section('og_image', $game->cover_url ?? asset('images/og-default.jpg'))
-@section('og_type', 'game')
+@section('og_type', 'website')
+@section('canonical', route('games.show', $game))
 
 @section('content')
+<nav class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 pt-6 pb-0" aria-label="Breadcrumb">
+    <ol class="flex items-center gap-1.5 text-sm text-slate-500">
+        <li><a href="{{ route('home') }}" class="hover:text-slate-300 transition-colors">Home</a></li>
+        <li class="text-slate-700">/</li>
+        <li><a href="{{ route('games.index') }}" class="hover:text-slate-300 transition-colors">Games</a></li>
+        <li class="text-slate-700">/</li>
+        <li class="text-slate-400 truncate max-w-xs">{{ $game->title }}</li>
+    </ol>
+</nav>
 <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-10">
 
     {{-- Main Info --}}
@@ -269,7 +279,7 @@
         <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-3">
             @foreach($game->screenshots as $i => $shot)
                 <button @click="openAt({{ $i }})" class="block w-full rounded-lg overflow-hidden bg-[#16161d] hover:ring-1 hover:ring-purple-500 transition-all">
-                    <img src="{{ $shot->thumb_url ?? $shot->url }}" alt="Screenshot" class="w-full aspect-video object-cover">
+                    <img src="{{ $shot->thumb_url ?? $shot->url }}" alt="{{ $game->title }} screenshot {{ $loop->iteration }}" class="w-full aspect-video object-cover">
                 </button>
             @endforeach
         </div>
@@ -304,7 +314,7 @@
             </button>
 
             {{-- Full-size image --}}
-            <img :src="screenshots[current]?.url" alt="Screenshot" class="max-h-[85vh] max-w-[90vw] rounded-lg shadow-2xl object-contain">
+            <img :src="screenshots[current]?.url" :alt="`{{ addslashes($game->title) }} screenshot ` + (current + 1)" class="max-h-[85vh] max-w-[90vw] rounded-lg shadow-2xl object-contain">
 
             {{-- Next --}}
             <button @click="next()" class="absolute right-4 top-1/2 -translate-y-1/2 text-white/70 hover:text-white transition-colors p-2">
@@ -542,10 +552,32 @@
         </div>
     </div>
 
+    @if($similarGames->isNotEmpty())
+    <div class="mt-10 pt-8 border-t border-white/5">
+        <h2 class="text-lg font-semibold text-white mb-4">You Might Also Like</h2>
+        <div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-6 gap-4">
+            @foreach($similarGames as $similar)
+                <x-game-card :game="$similar" />
+            @endforeach
+        </div>
+    </div>
+    @endif
+
 </div>
 
 @push('scripts')
 <script type="application/ld+json">
+{
+  "@@context": "https://schema.org",
+  "@@type": "BreadcrumbList",
+  "itemListElement": [
+    {"@@type": "ListItem", "position": 1, "name": "Home", "item": "{{ url('/') }}"},
+    {"@@type": "ListItem", "position": 2, "name": "Games", "item": "{{ route('games.index') }}"},
+    {"@@type": "ListItem", "position": 3, "name": "{{ addslashes($game->title) }}", "item": "{{ route('games.show', $game) }}"}
+  ]
+}
+</script>
+<script type="application/ld+json">
 {
     "@@context": "https://schema.org",
     "@@type": "VideoGame",
@@ -567,6 +599,21 @@
         "worstRating": 1
     }
     @endif
+    @if($game->reviews->isNotEmpty())
+    ,"review": [
+    @foreach($game->reviews->take(5) as $r)
+    @if($r->rating)
+    {
+      "@@type": "Review",
+      "author": {"@@type": "Person", "name": "{{ addslashes($r->user->name ?? 'Anonymous') }}"},
+      "reviewRating": {"@@type": "Rating", "ratingValue": "{{ $r->rating }}", "bestRating": "10", "worstRating": "1"},
+      "reviewBody": "{{ addslashes(Str::limit(strip_tags($r->body), 200)) }}",
+      "datePublished": "{{ $r->created_at->toDateString() }}"
+    }{{ !$loop->last ? ',' : '' }}
+    @endif
+    @endforeach
+    ]
+    @endif
 }
 </script>
 <script>