diff --git a/app/static/v3/v3.css b/app/static/v3/v3.css index 9e720c0..d060e13 100644 --- a/app/static/v3/v3.css +++ b/app/static/v3/v3.css @@ -1,23 +1,615 @@ /* - * v3.css — Bürgerinnen-Modus-Erweiterung über v2.css + * v3.css — Bürger:innen-Modus, single-column. * - * v3 = Sandbox für Issues #184 (CD-Konformität) und #185 (Bürgerinnen- - * Perspektive). Lädt nach v2.css und überschreibt selektiv. v2-Endpoints - * bleiben unverändert. - * - * Konvention: - * - Klassen mit Präfix `v3-` sind v3-spezifisch. - * - Inline-Styles in v3-Templates möglichst vermeiden (Lint-Hook folgt in #184). + * CD-Linie: ECOnGOOD (Manual Juni 2024). Subtile Rundungen 2-4 px, + * keine Kreise (außer dort, wo es semantisch unvermeidbar ist), keine + * 8px-Pill-Optik. Farben durchgängig aus tokens.css. Inline-Styles in + * den Templates auf Mindestmaß; alle Formatierungen über Klassen. */ -/* ── Topbar: Beta-Pill + Modus-Toggle ──────────────────────────────── */ +/* ── Page-Container: max-width zentriert, single column ────────────── */ +.v3-page { + max-width: 880px; + margin: 0 auto; + padding: 0 4px; +} + +.v3-back { + font-family: var(--font-mono); + font-size: 11px; + margin: 0 0 16px; +} + +/* ── Sections: vertikale Reihung ───────────────────────────────────── */ +.v3-section { + margin: 0 0 24px; + padding: 0 0 20px; + border-bottom: 1px solid var(--hairline); +} +.v3-section:last-of-type { + border-bottom: none; +} + +.v3-h3 { + font-family: var(--font-sans); + font-weight: 900; + font-size: 13px; + letter-spacing: 0.04em; + text-transform: uppercase; + color: var(--ecg-dark); + margin: 0 0 10px; +} + +.v3-prose { + font-size: 14.5px; + line-height: 1.55; + color: var(--ecg-dark); + margin: 0; +} + +/* ── 1. Metadaten / Titel ──────────────────────────────────────────── */ +.v3-meta { + border-bottom: 1px solid var(--hairline); + padding-bottom: 14px; + margin-bottom: 18px; +} +.v3-antrag-id { + font-family: var(--font-mono); + font-size: 11px; + letter-spacing: 0.04em; + text-transform: uppercase; + color: var(--ecg-dark); + opacity: 0.75; + margin-bottom: 6px; +} +.v3-title { + font-family: var(--font-sans); + font-weight: 900; + font-size: 30px; + line-height: 1.18; + color: var(--ecg-dark); + margin: 0 0 8px; +} +.v3-byline { + font-family: var(--font-mono); + font-size: 11px; + color: var(--ecg-dark); + opacity: 0.7; +} + +/* ── 3. Bewertung: Score xl + Empfehlung daneben + Body voll breit ─── */ +.v3-bewertung-head { + display: flex; + align-items: baseline; + gap: 18px; + flex-wrap: wrap; + margin-bottom: 14px; +} +.v3-score-num { + font-family: var(--font-sans); + font-weight: 900; + font-size: 56px; + line-height: 1; + color: var(--ecg-dark); +} +.v3-score-slash { + font-size: 30px; + font-weight: 700; + color: var(--ecg-dark); + opacity: 0.4; + margin-left: 2px; +} +.v3-empfehlung { + font-family: var(--font-sans); + font-weight: 900; + font-size: 22px; + line-height: 1.15; + color: var(--ecg-dark); + letter-spacing: -0.01em; + flex: 1 1 auto; +} +.v3-empfehlung.good { color: var(--score-chip-green-fg); } +.v3-empfehlung.mid { color: var(--ecg-dark); } +.v3-empfehlung.low { color: var(--score-chip-red-fg); } + +.v3-bewertung-body { + font-size: 14.5px; + line-height: 1.6; + color: var(--ecg-dark); + margin: 0; + width: 100%; +} + +/* ── 4. User-Aktionen-Zeile (Merken + Vote-treffend) ───────────────── */ +.v3-userrow { + display: flex; + align-items: center; + justify-content: space-between; + gap: 16px; + flex-wrap: wrap; +} +.v3-userrow-vote { + display: flex; + align-items: center; + gap: 10px; +} +.v3-userrow-label { + font-family: var(--font-mono); + font-size: 10px; + text-transform: uppercase; + letter-spacing: 0.07em; + color: var(--ecg-dark); + opacity: 0.6; +} +.v3-vote-buttons { + display: flex; + gap: 6px; +} + +.v3-action-btn { + display: inline-flex; + align-items: center; + gap: 6px; + padding: 5px 12px; + border: 1px solid var(--hairline); + border-radius: 3px; + background: var(--paper); + color: var(--ecg-dark); + font-family: var(--font-mono); + font-size: 11px; + cursor: pointer; + text-decoration: none; +} +.v3-action-btn:hover { border-color: var(--ecg-blue); color: var(--ecg-blue); } +.v3-action-btn.primary { + background: var(--ecg-blue); + color: #fff; + border-color: var(--ecg-blue); + font-weight: 700; +} +.v3-action-btn.primary:hover { background: var(--ecg-dark); border-color: var(--ecg-dark); color: #fff; } +.v3-action-btn.v3-action-muted { opacity: 0.8; } + +/* ── 6. Programm-Treue ─────────────────────────────────────────────── */ +.v3-fraktionen { + display: flex; + flex-direction: column; + gap: 12px; +} +.v3-fraktion { + background: var(--surface); + border: 1px solid var(--hairline); + border-radius: 4px; + padding: 12px 14px; +} +.v3-fraktion-head { + display: flex; + align-items: baseline; + gap: 8px; + flex-wrap: wrap; + margin-bottom: 6px; +} +.v3-fraktion-name { + font-family: var(--font-sans); + font-weight: 900; + font-size: 14px; + letter-spacing: 0.02em; + color: var(--ecg-dark); +} +.v3-pill { + font-family: var(--font-mono); + font-size: 10px; + text-transform: uppercase; + letter-spacing: 0.05em; + padding: 1px 6px; + border-radius: 2px; +} +.v3-pill-antrag { color: #bf6c10; background: rgba(247, 148, 29, 0.15); } +.v3-pill-reg { color: #1e6a90; background: rgba(0, 157, 165, 0.15); } + +.v3-prog { + border-top: 1px solid var(--hairline); +} +.v3-prog:first-of-type { border-top: 1px dashed var(--hairline); margin-top: 4px; } +.v3-prog > summary { + list-style: none; + cursor: pointer; + user-select: none; + outline-offset: 2px; +} +.v3-prog > summary::-webkit-details-marker { display: none; } + +.v3-prog-row { + display: flex; + align-items: baseline; + gap: 8px; + padding: 10px 0 8px; +} +.v3-prog-label { + font-family: var(--font-mono); + font-size: 12px; + text-transform: uppercase; + letter-spacing: 0.07em; + color: var(--ecg-dark); + font-weight: 600; + transition: color 0.12s ease; +} +.v3-prog-label::before { + content: "▸"; + display: inline-block; + margin-right: 6px; + font-size: 10px; + opacity: 0.55; + transition: transform 0.15s ease; +} +.v3-prog[open] > summary .v3-prog-label::before { + transform: rotate(90deg); +} +.v3-prog > summary:hover .v3-prog-label { color: var(--ecg-blue); } +.v3-prog-spacer { flex: 1 1 auto; } +.v3-prog-score { + font-family: var(--font-mono); + font-size: 12px; + font-weight: 700; + padding: 2px 8px; + border-radius: 3px; +} +.v3-prog-score.good { background: var(--score-chip-green-bg); color: var(--score-chip-green-fg); } +.v3-prog-score.mid { background: var(--score-chip-mid-bg); color: var(--score-chip-mid-fg); } +.v3-prog-score.low { background: var(--score-chip-red-bg); color: var(--score-chip-red-fg); } + +.v3-prog-body { + padding: 0 0 12px 16px; +} +.v3-prog-text { + font-size: 13.5px; + line-height: 1.55; + color: var(--ecg-dark); + margin: 0 0 8px; +} +.v3-prog-zitate { margin-top: 6px; } + +/* ── 7. Verbesserungsvorschläge: volle Breite, kein max-width ──────── */ +.v3-verbesserungen p, +.v3-verbesserungen .v3-verbesserung-begr { + max-width: none; +} +.v3-verbesserung { + margin-bottom: 18px; +} +.v3-verbesserung:last-child { margin-bottom: 0; } +.v3-verbesserung-num { + font-family: var(--font-mono); + font-size: 11px; + color: var(--ecg-dark); + opacity: 0.65; + margin-bottom: 4px; +} +.v3-verbesserung-begr { + font-family: var(--font-mono); + font-size: 12px; + color: var(--ecg-dark); + opacity: 0.78; + line-height: 1.55; + margin: 6px 0 0; +} + +/* ── 8. Abstimmungsergebnis ────────────────────────────────────────── */ +.v3-vote-card { + border: 1px solid var(--hairline); + border-radius: 4px; + padding: 12px 14px; + background: var(--paper); + margin-bottom: 10px; +} +.v3-vote-card:last-child { margin-bottom: 4px; } +.v3-vote-card-head { + display: flex; + justify-content: space-between; + align-items: baseline; + gap: 12px; + flex-wrap: wrap; + margin-bottom: 6px; +} +.v3-vote-ergebnis { + font-family: var(--font-sans); + font-weight: 700; + font-size: 14px; +} +.v3-vote-quelle { + font-family: var(--font-mono); + font-size: 10px; + color: var(--ecg-blue); + text-decoration: none; + border-bottom: 1px solid rgba(0, 157, 165, 0.35); +} +.v3-vote-quelle:hover { background: rgba(0, 157, 165, 0.08); } + +.v3-vote-bar { + display: flex; + height: 10px; + border-radius: 3px; + overflow: hidden; + border: 1px solid var(--hairline); + margin: 6px 0 2px; +} +.v3-vote-bar-ja { background: #2da44e; } +.v3-vote-bar-enth { background: #6e7781; } +.v3-vote-bar-nein { background: #cf222e; } +.v3-vote-bar-caption { + font-family: var(--font-mono); + font-size: 9px; + color: var(--ecg-dark); + opacity: 0.55; + margin-bottom: 8px; +} + +.v3-vote-pills { + display: flex; + flex-wrap: wrap; + gap: 12px; + font-family: var(--font-mono); + font-size: 11px; +} +.v3-vote-side { font-weight: 700; } +.v3-vote-side.ja { color: #2da44e; } +.v3-vote-side.nein { color: #cf222e; } +.v3-vote-side.enth { color: #6e7781; } +.v3-vote-pill { + display: inline-block; + padding: 1px 6px; + border-radius: 2px; + margin-right: 3px; +} +.v3-vote-pill.ja { background: color-mix(in srgb, #2da44e 15%, transparent); color: #1a7f37; } +.v3-vote-pill.nein { background: color-mix(in srgb, #cf222e 15%, transparent); color: #a40e26; } +.v3-vote-pill.enth { background: color-mix(in srgb, #6e7781 15%, transparent); color: #57606a; } + +/* ⚠/!-Marker — kein 8px-Pill mehr, einfache Badge-Form ohne Rundung */ +.v3-marker { + display: inline-block; + margin-left: 4px; + padding: 0 4px; + border-radius: 2px; + cursor: help; + font-weight: 700; + border: 1px solid transparent; +} +.v3-marker:hover, .v3-marker:focus-visible { + outline: none; + border-color: currentColor; +} +.v3-marker.heuchelei { color: #a40e26; background: rgba(207, 34, 46, 0.10); } +.v3-marker.opp { color: #bf8700; background: rgba(191, 135, 0, 0.10); font-style: italic; } + +.v3-vote-source { + font-family: var(--font-mono); + font-size: 10px; + opacity: 0.5; + margin-top: 4px; +} + +.v3-namentlich { + font-family: var(--font-mono); + font-size: 11px; + color: var(--ecg-dark); + opacity: 0.78; + display: flex; + flex-direction: column; + gap: 4px; +} + +/* ── 9. Rest-Block ─────────────────────────────────────────────────── */ +.v3-rest { + margin-top: 28px; + padding-top: 20px; + border-top: 1px solid var(--hairline); + display: flex; + flex-direction: column; + gap: 22px; +} +.v3-rest-block { + font-size: 13px; +} +.v3-rest-block h3 { + margin-bottom: 10px; +} + +.v3-rest-aktions { + display: flex; + gap: 16px; + flex-wrap: wrap; + font-family: var(--font-mono); + font-size: 11px; +} +.v3-rest-aktions a { + color: var(--ecg-blue); + border-bottom: 1px solid rgba(0, 157, 165, 0.35); +} + +.v3-share-buttons { + display: flex; + flex-wrap: wrap; + gap: 6px; +} + +.v3-loading { + font-family: var(--font-mono); + font-size: 12px; + color: var(--ecg-dark); + opacity: 0.5; +} + +.v3-konsistenz { + padding: 8px 12px; + border-radius: 4px; + font-size: 12px; + line-height: 1.5; + border-left: 3px solid; +} +.v3-konsistenz.conflict { + background: color-mix(in srgb, #cf222e 8%, transparent); + border-left-color: #cf222e; +} +.v3-konsistenz.match { + background: color-mix(in srgb, #2da44e 8%, transparent); + border-left-color: #2da44e; +} + +.v3-marker-legend { + font-family: var(--font-mono); + font-size: 11px; + color: var(--ecg-dark); + opacity: 0.85; + display: flex; + flex-direction: column; + gap: 6px; +} + +.v3-news-box { + background: var(--surface); + border: 1px solid var(--hairline); + border-radius: 4px; + padding: 14px 16px; +} +.v3-news-meta { + font-size: 11px; + font-family: var(--font-mono); + opacity: 0.65; + margin: 0 0 10px; +} + +.v3-comments .v3-comment-label { + font-family: var(--font-mono); + font-size: 10px; + text-transform: uppercase; + letter-spacing: 0.07em; + color: var(--ecg-dark); + opacity: 0.6; + margin-bottom: 6px; +} +.v3-comment-textarea { + width: 100%; + box-sizing: border-box; + padding: 8px 10px; + border: 1px solid var(--hairline); + border-radius: 3px; + font-family: var(--font-sans); + font-size: 13px; + background: var(--surface); + color: var(--ecg-dark); + resize: vertical; + margin-bottom: 8px; + outline: none; +} +.v3-comment-controls { + display: flex; + gap: 8px; + align-items: center; + flex-wrap: wrap; +} +.v3-comment-vis { + padding: 5px 8px; + border: 1px solid var(--hairline); + border-radius: 3px; + font-family: var(--font-mono); + font-size: 11px; + background: var(--surface); + color: var(--ecg-dark); +} + +/* ── Modals (Matrix-Feld-Info) ─────────────────────────────────────── */ +.v3-modal { + display: none; + position: fixed; + inset: 0; + background: rgba(0,0,0,0.45); + z-index: 9100; + align-items: center; + justify-content: center; +} +.v3-modal-card { + background: var(--ecg-card-bg); + border: 1px solid var(--ecg-border); + border-radius: 4px; + padding: 24px 28px; + min-width: 300px; + max-width: 540px; + font-family: var(--font-sans); + font-size: 14px; + color: var(--ecg-dark); + line-height: 1.55; + box-shadow: 0 8px 32px rgba(0,0,0,0.18); +} +.v3-modal-head { + display: flex; + justify-content: space-between; + align-items: baseline; + gap: 12px; + margin-bottom: 6px; +} +.v3-modal-title { + font-family: var(--font-sans); + font-size: 16px; + font-weight: 900; + color: var(--ecg-teal); + letter-spacing: 0.03em; +} +.v3-modal-rating { + font-family: var(--font-mono); + font-size: 12px; + font-weight: 700; + padding: 2px 8px; + border-radius: 2px; + white-space: nowrap; +} +.v3-modal-close { + background: none; + border: none; + font-size: 18px; + cursor: pointer; + color: var(--ecg-dark); + opacity: 0.55; + padding: 0; + line-height: 1; + margin-left: auto; +} +.v3-modal-section { + margin: 14px 0 0; +} +.v3-modal-section--bordered { + margin-top: 16px; + padding-top: 12px; + border-top: 1px solid var(--hairline); +} +.v3-modal-sublabel { + font-family: var(--font-mono); + font-size: 10px; + text-transform: uppercase; + letter-spacing: 0.07em; + color: var(--ecg-dark); + opacity: 0.6; + margin-bottom: 4px; +} +.v3-modal-itemlabel { + font-weight: 700; + font-size: 14px; + margin-bottom: 4px; +} +.v3-modal-itemtext { + font-size: 13.5px; + line-height: 1.55; + margin: 0; +} + +/* ── Topbar Beta-Badge + Modus-Toggle (von v3-base) ────────────────── */ .v3-beta-badge { font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.12em; text-transform: uppercase; - padding: 2px 7px; - border-radius: 9px; + padding: 1px 7px; + border-radius: 2px; background: var(--ecg-green); color: #fff; font-weight: 700; @@ -25,7 +617,6 @@ .v3-modus-toggle { display: inline-flex; align-items: center; - gap: 6px; font-family: var(--font-mono); font-size: 10px; text-transform: uppercase; @@ -38,257 +629,11 @@ } .v3-modus-toggle:hover { opacity: 1; color: var(--ecg-blue); } -/* ── 1. Drucksache-ID: ruhiger Untertitel ──────────────────────────── */ -.v3-antrag-id { - /* erbt v2-antrag-id; nichts zu ändern auf der Ebene */ -} - -/* ── 2. Score-Hero: Wort-Etikett vor Zahl ──────────────────────────── */ -.v3-score-hero { - background: var(--surface); - border: 1px solid var(--hairline); - border-left: 6px solid var(--ecg-blue); - border-radius: 6px; - padding: 18px 20px; - margin: 8px 0 18px; -} -.v3-score-hero.good { border-left-color: var(--ecg-green); } -.v3-score-hero.mid { border-left-color: var(--ecg-blue); } -.v3-score-hero.low { border-left-color: var(--redline-contra, #cf222e); } - -.v3-score-label { - font-family: var(--font-sans); - font-size: 22px; - font-weight: 900; - line-height: 1.1; - color: var(--ecg-dark); - margin-bottom: 4px; -} -.v3-score-hero.good .v3-score-label { color: #1a7f37; } -.v3-score-hero.low .v3-score-label { color: #a40e26; } - -.v3-score-body { - font-size: 14px; - line-height: 1.5; - color: var(--ecg-dark); - margin: 6px 0 10px; -} -.v3-score-meta { - font-family: var(--font-mono); - font-size: 11px; - color: var(--ecg-dark); - opacity: 0.75; - border-top: 1px dashed var(--hairline); - padding-top: 8px; -} -.v3-score-meta strong { font-weight: 700; } - -/* ── 3. 5-Werte-Bars (Matrix-Vereinfachung) ────────────────────────── */ -.v3-werte-list { - display: flex; - flex-direction: column; - gap: 6px; - margin: 10px 0 16px; -} -.v3-wert-row { - display: grid; - grid-template-columns: minmax(140px, 1fr) 2.5fr auto; - align-items: center; - gap: 10px; - font-size: 13px; -} -.v3-wert-label { - color: var(--ecg-dark); - font-weight: 600; - line-height: 1.3; -} -.v3-wert-bar { - position: relative; - height: 10px; -} -.v3-wert-track { - position: absolute; - inset: 0; - background: var(--surface); - border: 1px solid var(--hairline); - border-radius: 5px; - overflow: hidden; -} -.v3-wert-mid { - position: absolute; - top: 0; - bottom: 0; - left: 50%; - width: 1px; - background: var(--hairline); -} -.v3-wert-fill { - position: absolute; - top: 0; - bottom: 0; - border-radius: 3px; - min-width: 2px; -} -.v3-wert-fill.pos { background: var(--ecg-green); } -.v3-wert-fill.neu { background: var(--ecg-dark); opacity: 0.3; } -.v3-wert-fill.neg { background: var(--redline-contra, #cf222e); } - -.v3-wert-num { - font-family: var(--font-mono); - font-size: 12px; - font-weight: 700; - color: var(--ecg-dark); - min-width: 36px; - text-align: right; -} - -.v3-matrix-details { - margin-top: 10px; - padding: 8px 12px; - background: var(--surface); - border: 1px solid var(--hairline); - border-radius: 5px; -} -.v3-matrix-details > summary { - cursor: pointer; - font-family: var(--font-mono); - font-size: 11px; - letter-spacing: 0.03em; - color: var(--ecg-dark); - user-select: none; - list-style: none; -} -.v3-matrix-details > summary::-webkit-details-marker { display: none; } -.v3-matrix-details > summary::before { - content: "▸ "; - display: inline-block; - margin-right: 4px; - transition: transform 0.15s ease; -} -.v3-matrix-details[open] > summary::before { - transform: rotate(90deg); -} - -/* ── 4. Glossar-Tooltips ───────────────────────────────────────────── */ -.v3-glossar { - display: inline; - border-bottom: 1px dotted var(--ecg-blue); - cursor: help; - color: var(--ecg-blue); -} -.v3-glossar:hover, -.v3-glossar:focus-visible { - outline: none; - background: rgba(0, 157, 165, 0.12); - border-bottom-style: solid; -} - -.v3-glossar-modal { - display: none; - position: fixed; - inset: 0; - background: rgba(0,0,0,0.45); - z-index: 9100; - align-items: center; - justify-content: center; -} -.v3-glossar-card { - background: var(--ecg-card-bg, #fff); - border: 1px solid var(--ecg-border, #ddd); - border-radius: 8px; - padding: 22px 26px; - min-width: 280px; - max-width: 480px; - font-family: var(--font-sans); - color: var(--ecg-dark); - box-shadow: 0 8px 32px rgba(0,0,0,0.18); -} -.v3-glossar-head { - display: flex; - justify-content: space-between; - align-items: baseline; - margin-bottom: 10px; -} -.v3-glossar-head strong { - font-family: var(--font-display, inherit); - font-size: 16px; - font-weight: 900; - color: var(--ecg-teal, #009da5); - letter-spacing: 0.03em; -} -.v3-glossar-close { - background: none; - border: none; - font-size: 18px; - cursor: pointer; - color: var(--ecg-dark); - opacity: 0.55; - padding: 0; - line-height: 1; -} -.v3-glossar-card p { - margin: 0; - font-size: 14px; - line-height: 1.55; -} - -/* ── 5. Collapsible-Sections (Verbesserungen, Kommentare default zu) ─ */ -.v3-collapsible { - margin-top: 24px; - padding: 8px 0; - border-top: 1px solid var(--hairline); -} -.v3-collapsible > summary { - cursor: pointer; - list-style: none; - user-select: none; - display: flex; - align-items: baseline; - gap: 12px; - padding: 4px 0; -} -.v3-collapsible > summary::-webkit-details-marker { display: none; } -.v3-collapsible > summary > h3 { - margin: 0; - display: inline-flex; - align-items: baseline; - gap: 8px; -} -.v3-collapsible > summary > h3::before { - content: "▸"; - display: inline-block; - font-family: var(--font-mono); - font-size: 12px; - color: var(--ecg-dark); - opacity: 0.55; - transition: transform 0.15s ease; -} -.v3-collapsible[open] > summary > h3::before { - transform: rotate(90deg); -} -.v3-collapsible-hint { - font-family: var(--font-mono); - font-size: 10px; - text-transform: uppercase; - letter-spacing: 0.07em; - color: var(--ecg-dark); - opacity: 0.5; -} -.v3-comments { - margin-top: 40px; - padding-top: 20px; -} - -/* ── 6. Aktions-Links ──────────────────────────────────────────────── */ -.v3-aktions { - margin-top: 24px; - font-family: var(--font-mono); - font-size: 11px; - display: flex; - gap: 16px; - flex-wrap: wrap; -} -.v3-aktions a { - color: var(--ecg-blue); - border-bottom: 1px solid rgba(0, 157, 165, 0.35); +/* ── Responsive: kleinere Schrift & engerer Padding ab schmaler ───── */ +@media (max-width: 640px) { + .v3-page { padding: 0 12px; } + .v3-title { font-size: 24px; } + .v3-score-num { font-size: 44px; } + .v3-empfehlung { font-size: 18px; } + .v3-userrow { flex-direction: column; align-items: flex-start; } } diff --git a/app/templates/v3/screens/antrag_detail.html b/app/templates/v3/screens/antrag_detail.html index 8e65997..e0872db 100644 --- a/app/templates/v3/screens/antrag_detail.html +++ b/app/templates/v3/screens/antrag_detail.html @@ -1,302 +1,457 @@ {# ───────────────────────────────────────────────────────────────────── - v3/screens/antrag_detail.html — Bürger:innen-Modus + v3/screens/antrag_detail.html — Bürger:innen-Modus, single column - Override-Strategie: extendet v2-Screen, ersetzt nur die Sub-Blocks, - die in v3 vereinfacht werden. Block-Liste: - - antrag_id_section — entschärfte Drucksache-Sprache mit Glossar - - score_hero_section — Wort-Etikett groß, Zahl klein darunter - - matrix_section — 5 Werte default +
für 5×5 - - verbesserungen_section — default kollabiert - - aktions_section — JSON-Export raus, nur PDF + Permalink - - comments_section — default kollabiert + Override-Strategie: extendet v2/screens/antrag_detail.html und + ersetzt nur `block main` komplett. body_scripts erbt via super(), so + dass alle v2-JS-Handler (vote, merkliste, share, comments, history, + matrix-modal) ohne Code-Duplikation weiterlaufen — sie hängen sich an + DOM-IDs (v2-vote-up, v2-merkliste-btn, v2-comments-list, …), die wir + in der neuen Layout-Reihenfolge wiederverwenden. + + Reihenfolge (single column): + 1. Metadaten/Titel + 2. Zusammenfassung + 3. Bewertung (Score xl + Empfehlung daneben + Begründung darunter) + 4. Merken / Bewertung treffend + 5. Matrix 5×5 + 6. Programm-Treue (default-closed Klappmechanismus pro Programm) + 7. Verbesserungsvorschläge (volle Breite, nicht kollabiert) + 8. Abstimmungsergebnis + 9. Rest: PDF/Teilen/Neu/Historie + Stärken/Schwächen + Konsistenz + + Marker-Legende + News + Kommentare ───────────────────────────────────────────────────────────────────── #} {% extends "v2/screens/antrag_detail.html" %} +{% from "v2/components/score_hero.html" import score_hero %} +{% from "v2/components/matrix_mini.html" import matrix_mini %} +{% from "v2/components/quote_card.html" import quote_card %} +{% from "v2/components/redline.html" import redline %} + {% block head_extra %} {{ super() }} {% endblock %} -{# ─── 1. Drucksache-ID: weniger Behörden-Sprache, Glossar-Hinweise ─── #} -{% block antrag_id_section %} -
- Antrag im - {% if antrag.bundesland == "BU" %}Bundestag - {% elif antrag.bundesland %}Landtag {{ antrag.bundesland }} - {% else %}Parlament{% endif %} - {% if antrag.drucksache %} - · Drucksache - {{ antrag.drucksache }} - {% endif %} - {% if antrag.datum %} · eingebracht {{ antrag.datum }}{% endif %} +{% block main %} +{% if error is defined and error %} +
+

Antrag nicht gefunden

+

{{ error }}

+

← Zurück zur Übersicht

-{% endblock %} +{% elif antrag is defined and antrag %} -{# ─── 2. Score-Hero: Wort-Etikett groß, Zahl klein ──────────────────── #} -{% block score_hero_section %} -{% set s = (antrag.score | default(0)) | float %} -{% if s >= 7 %} - {% set v3_label = antrag.verdict_title or "Stark gemeinwohlfördernd" %} - {% set v3_class = "good" %} -{% elif s >= 4 %} - {% set v3_label = antrag.verdict_title or "Gemischt" %} - {% set v3_class = "mid" %} -{% else %} - {% set v3_label = antrag.verdict_title or "Widerspricht dem Gemeinwohl" %} - {% set v3_class = "low" %} -{% endif %} +
-
-
{{ v3_label }}
- {% if antrag.verdict_body %} -
{{ antrag.verdict_body }}
- {% endif %} -
- Gemeinwohl-Score: - {{ "%.1f"|format(s) }} von 10 -
-
-{% endblock %} +

+ ← Zurück zur Übersicht +

-{# ─── 3. Matrix: 5 Werte default, volle 5×5 in
─────────────── #} -{% block matrix_section %} -{% if antrag.matrix %} -

Beitrag zu den 5 Gemeinwohl-Werten

- -{# Pro Wert (Spalte 1..5) Durchschnitt aus den 5 Berührungsgruppen-Zellen. - Skala bleibt -5..+5 wie in der DB. #} -{% set v3_werte = [ - ("1", "Menschenwürde"), - ("2", "Solidarität"), - ("3", "Ökologische Nachhaltigkeit"), - ("4", "Soziale Gerechtigkeit"), - ("5", "Transparenz & Demokratie"), -] %} -
- {% for col, label in v3_werte %} - {% set ns = namespace(sum=0, cnt=0) %} - {% for row in ["A","B","C","D","E"] %} - {% set cell = antrag.matrix[row ~ col] | default(none) %} - {% if cell %} - {% set ns.sum = ns.sum + (cell.rating | int) %} - {% set ns.cnt = ns.cnt + 1 %} + {# 1 ── Metadaten + Titel ─────────────────────────────────────────── #} +
+
+ {{ antrag.bundesland | default("") }} + {% if antrag.drucksache %} · Drs. {{ antrag.drucksache }}{% endif %} + {% if antrag.typ %} · {{ antrag.typ }}{% endif %} + {% if antrag.datum %} · eingebracht {{ antrag.datum }}{% endif %} +
+

{{ antrag.title | default("Antrag") }}

+ {% if antrag.parteien or antrag.analysiert %} +
+ {% if antrag.parteien %}Eingebracht von {{ antrag.parteien | join(", ") }}{% endif %} + {% if antrag.analysiert %} — Analyse {{ antrag.analysiert }}{% endif %} + {% if antrag.modell %}, {{ antrag.modell }}{% endif %} + {% if antrag.zitate_count %} · {{ antrag.zitate_count }} Zitat{{ "e" if antrag.zitate_count != 1 else "" }} verifiziert{% endif %} +
{% endif %} - {% endfor %} - {% set avg = (ns.sum / ns.cnt) if ns.cnt else 0 %} - {% set pct = ((avg + 5) / 10 * 100) %} -
-
{{ label }}
-
+ + {# 2 ── Zusammenfassung ───────────────────────────────────────────── #} + {% if antrag.zusammenfassung %} +
+

Zusammenfassung

+

{{ antrag.zusammenfassung }}

+
+ {% endif %} + + {# 3 ── Bewertung ─────────────────────────────────────────────────── #} +
+ {% set s = (antrag.score | default(0)) | float %} +
+
+ {{ "%.1f"|format(s) }}/10
-
-
- {% if avg > 0 %}+{% endif %}{{ "%.1f"|format(avg) }} -
-
- {% endfor %} -
- -
- - Volle GWÖ-Matrix 2.0 - · 25 Felder (5 Werte × 5 Berührungsgruppen) - -
- {% from "v2/components/matrix_mini.html" import matrix_mini %} - {{ matrix_mini(antrag.matrix) }} -
-
-{% endif %} -{% endblock %} - -{# ─── 4. Verbesserungsvorschläge: default kollabiert ──────────────────── #} -{% block verbesserungen_section %} -{% if antrag.verbesserungen %} -
- -

Verbesserungsvorschläge

- {{ antrag.verbesserungen | length }} Vorschlag{{ "" if antrag.verbesserungen | length == 1 else "e" }} · klicken zum Aufklappen - -
- {% for v in antrag.verbesserungen %} -
- {% if antrag.verbesserungen | length > 1 %} -
- Vorschlag {{ loop.index }} von {{ antrag.verbesserungen | length }} + {% if antrag.verdict_title %} +
+ {{ antrag.verdict_title }}
{% endif %} - {% from "v2/components/redline.html" import redline %} +
+ {% if antrag.verdict_body %} +

{{ antrag.verdict_body }}

+ {% endif %} + + + {# 4 ── Merken + Bewertung treffend (User-Aktionen) ──────────────── #} +
+ +
+ Bewertung treffend? +
+ + +
+
+
+ + {# 5 ── Matrix 5×5 (volle Profi-Variante, mit Klick-Modal) ────────── #} + {% if antrag.matrix %} +
+

Matrix 2.0 · 25 Felder

+ {{ matrix_mini(antrag.matrix) }} +
+ {% endif %} + + {# 6 ── Programm-Treue ─────────────────────────────────────────────── #} + {% if antrag.fraktions_scores %} +
+

Programm-Treue pro Fraktion

+
+ {% for fs in antrag.fraktions_scores %} +
+
+ {{ fs.fraktion }} + {% if fs.ist_antragsteller %}Antragsteller:in{% endif %} + {% if fs.ist_regierung %}Regierungsfraktion{% endif %} +
+ + {% for prog_key, prog_label in [("wahlprogramm","Wahlprogramm"),("parteiprogramm","Parteiprogramm")] %} + {% set p = fs[prog_key] %} + {% set p_score = p.score | float %} +
+ + {{ prog_label }} + + {{ "%.0f"|format(p_score) }}/10 + +
+ {% if p.begruendung %}

{{ p.begruendung }}

{% endif %} + {% if p.zitate %} +
+ {% for z in p.zitate %} + {{ quote_card(z.text, z.source, True, False, z.pdf_href) }} + {% endfor %} +
+ {% endif %} +
+
+ {% endfor %} +
+ {% endfor %} +
+
+ {% endif %} + + {# 7 ── Verbesserungsvorschläge — volle Breite, nicht kollabiert ───── #} + {% if antrag.verbesserungen %} +
+

Verbesserungsvorschläge

+ {% for v in antrag.verbesserungen %} +
+ {% if antrag.verbesserungen | length > 1 %} +
Vorschlag {{ loop.index }} von {{ antrag.verbesserungen | length }}
+ {% endif %} {% if v.segments %} {{ redline(original=v.original | default(""), segments=v.segments) }} {% else %} {{ redline(original=v.original | default(""), vorschlag=v.vorschlag | default("")) }} {% endif %} {% if v.begruendung %} -

- {{ v.begruendung }} -

+

{{ v.begruendung }}

{% endif %}
{% endfor %} -
-
-{% endif %} -{% endblock %} + + {% elif antrag.redline and antrag.redline.segments %} +
+

Verbesserungsvorschlag

+ {{ redline(segments=antrag.redline.segments) }} +
+ {% endif %} -{# ─── 5. Aktions-Links: nur PDF + Permalink ──────────────────────────── #} -{% block aktions_section %} -
- - PDF-Bericht - - - Permalink - -
-{% endblock %} + {# 8 ── Abstimmungsergebnis (Plenum + namentlich) ──────────────────── #} + {% if antrag.plenum_votes %} +
+

Abstimmungsergebnis

+ {% set ergebnis_color = { + "angenommen":"#2da44e","abgelehnt":"#cf222e","überwiesen":"#0969da", + "zurückgezogen":"#8250df","bestätigt":"#2da44e","sammel":"#0969da", + } %} + {% for v in antrag.plenum_votes %} +
+
+ + {{ v.ergebnis | capitalize }}{% if v.einstimmig %} · einstimmig{% endif %} + + {% if v.quelle_url %} + + {{ v.quelle_protokoll }} ↗ + + {% else %} + {{ v.quelle_protokoll }} + {% endif %} +
+ {% if v.fraktionen_ja or v.fraktionen_nein or v.fraktionen_enthaltung %} + {% set _n_ja = v.fraktionen_ja | length %} + {% set _n_nein = v.fraktionen_nein | length %} + {% set _n_enth = v.fraktionen_enthaltung | length %} + {% set _n_total = _n_ja + _n_nein + _n_enth %} + {% if _n_total > 0 %} +
+ {% if _n_ja %}
{% endif %} + {% if _n_enth %}
{% endif %} + {% if _n_nein %}
{% endif %} +
+
+ {{ _n_ja }}/{{ _n_total }} Fraktionen Ja · {{ _n_nein }} Nein · {{ _n_enth }} Enth. +
+ {% endif %} +
+ {% if v.fraktionen_ja %} +
Ja: + {% for f in v.fraktionen_ja %} + {% set _opp = opportunismus_score(f, antrag.fraktions_scores) %} + {{ f }}{% if _opp is not none %}!{% endif %} + {% endfor %} +
+ {% endif %} + {% if v.fraktionen_nein %} +
Nein: + {% for f in v.fraktionen_nein %} + {% set _wp = heuchelei_score(f, antrag.fraktions_scores) %} + {{ f }}{% if _wp is not none %}⚠{% endif %} + {% endfor %} +
+ {% endif %} + {% if v.fraktionen_enthaltung %} +
Enth.: + {% for f in v.fraktionen_enthaltung %}{{ f }}{% endfor %} +
+ {% endif %} +
+ {% endif %} +
+ {% endfor %} +
Quelle: Plenarprotokoll · automatisch extrahiert
+
+ {% endif %} -{# ─── 6. Kommentare: default kollabiert ──────────────────────────────── #} -{% block comments_section %} -
- -

Kommentare

- klicken zum Aufklappen · Anmeldung erforderlich - -
-
- Lade… + {% if antrag.abstimmungsverhalten %} + {% set aw = antrag.abstimmungsverhalten %} +
+

Namentliche Abstimmung

+
+
{{ aw.protokoll | default("") }}{% if aw.datum %} · {{ aw.datum }}{% endif %}
+ {% if aw.abstimmung %} +
{{ aw.abstimmung.ja | default(0) }} Ja · {{ aw.abstimmung.nein | default(0) }} Nein · {{ aw.abstimmung.enthaltung | default(0) }} Enthaltung
+ {% endif %} +
+
+ {% endif %} + + {# ════════════════ 9 ── REST-Block ════════════════════════════════════ #} +
+ + {# 9a Aktions-Links #} +
+ PDF-Bericht + JSON-Export + Permalink
-
{# v3-rest #} + + {# ════════════════ Modals ═════════════════════════════════════════════ #} + + {# Matrix-Feld-Info-Modal — gleiche IDs wie v2, JS aus super() greift #} + -
+ +
{# .v3-page #} +{% endif %}{# antrag #} {% endblock %} -{# ─── Topbar-Pill + Toggle + Glossar-Tooltips (JS) ───────────────────── #} {% block body_scripts %} {{ super() }} - -{# Glossar-Modal #} - {% endblock %}