initial commit

templates/claims/category_detail.html

@@ -0,0 +1,54 @@
+{% extends "base.html" %}
+
+{% block title %}{{ category.name }} – Faktenkompass{% endblock %}
+
+{% block content %}
+<nav aria-label="Brotkrumen">
+    <ol class="breadcrumb">
+        <li class="breadcrumb-item"><a href="{% url 'claims:home' %}">Themen</a></li>
+        <li class="breadcrumb-item active">{{ category.name }}</li>
+    </ol>
+</nav>
+
+<div class="d-flex align-items-center gap-2 mb-3">
+    <div class="category-tile-icon flex-shrink-0">
+        <i class="bi {{ category.icon|default:'bi-book' }}"></i>
+    </div>
+    <div class="flex-grow-1 overflow-hidden">
+        <h1 class="h5 mb-0 text-truncate">{{ category.name }}</h1>
+        <span class="small text-muted">{{ claims|length }} Behauptung{% if claims|length != 1 %}en{% endif %}</span>
+    </div>
+</div>
+
+<form method="get" class="row g-2 mb-3">
+    <div class="col-12 col-sm">
+        <input type="search" id="q" name="q" class="form-control form-control-sm" placeholder="Suchen…" value="{{ query }}">
+    </div>
+    <div class="col-7 col-sm-auto">
+        <select id="status" name="status" class="form-select form-select-sm">
+            <option value="">Alle Status</option>
+            {% for value, label in status_choices %}
+            <option value="{{ value }}"{% if status == value %} selected{% endif %}>{{ label }}</option>
+            {% endfor %}
+        </select>
+    </div>
+    <div class="col-5 col-sm-auto">
+        <button type="submit" class="btn btn-primary btn-sm w-100">Filtern</button>
+    </div>
+</form>
+
+<div class="d-flex flex-column gap-2">
+    {% for claim in claims %}
+    <a href="{{ claim.get_absolute_url }}" class="text-decoration-none">
+        <div class="card claim-card">
+            <div class="card-body d-flex align-items-start gap-2">
+                <span class="badge text-bg-{{ claim.get_status_badge_class }} flex-shrink-0 mt-1">{{ claim.get_status_display }}</span>
+                <span class="text-dark">{{ claim.title }}</span>
+            </div>
+        </div>
+    </a>
+    {% empty %}
+    <p class="text-muted text-center py-4 mb-0">Keine Behauptungen gefunden.</p>
+    {% endfor %}
+</div>
+{% endblock %}