Render FAQ topics as cards, drop dead scoped CSS

Elternbeirat.Web/Features/Faqs/FaqTopicDetail.razor.cs

@@ -0,0 +1,63 @@
+using Elternbeirat.Contracts;
+using Elternbeirat.PocketBase;
+using Elternbeirat.Web.Shared;
+using Microsoft.AspNetCore.Components;
+
+namespace Elternbeirat.Web.Features.Faqs;
+
+public partial class FaqTopicDetail
+{
+    [LoggerMessage(
+        Level = LogLevel.Error,
+        Message = "Could not load FAQ topic '{Slug}' from PocketBase; content source is unavailable.")]
+    private static partial void LogSourceUnavailable(
+        ILogger logger,
+        string slug,
+        Exception exception);
+
+    [Parameter]
+    public string Slug { get; set; } = string.Empty;
+
+    [Inject]
+    private PocketBaseClient PocketBase { get; set; } = null!;
+
+    [Inject]
+    private ILogger<FaqTopicDetail> Logger { get; set; } = null!;
+
+    [Inject]
+    private NavigationManager Navigation { get; set; } = null!;
+
+    [CascadingParameter]
+    private HttpContext? HttpContext { get; set; }
+
+    private FaqTopic? _topic;
+
+    // Set when the content source could not be reached or read. The markup then
+    // shows a "temporarily unavailable" note instead of a not-found page, matching
+    // the 503 this sets on the response.
+    private bool _unavailable;
+
+    protected override async Task OnParametersSetAsync()
+    {
+        try
+        {
+            _topic = await PocketBase.GetFaqTopicBySlugAsync(
+                Slug,
+                HttpContext?.RequestAborted ?? CancellationToken.None);
+        }
+        catch (PocketBaseUnavailableException exception)
+        {
+            // The site works, its data store is down: 503, not 404.
+            LogSourceUnavailable(Logger, Slug, exception);
+            _unavailable = true;
+            SourceUnavailable.SetStatus(HttpContext);
+            return;
+        }
+
+        if (_topic is null)
+        {
+            // The source answered, but there is no topic with this slug: a genuine 404.
+            Navigation.NotFound();
+        }
+    }
+}