diff --git a/app/static/v3/v3.css b/app/static/v3/v3.css index 1f42079..1067b1a 100644 --- a/app/static/v3/v3.css +++ b/app/static/v3/v3.css @@ -181,20 +181,19 @@ .v3-fraktionen { display: flex; flex-direction: column; - gap: 12px; + gap: 6px; } .v3-fraktion { background: var(--surface); border: 1px solid var(--hairline); border-radius: 4px; - padding: 12px 14px; + padding: 6px 12px; } -.v3-fraktion-head { +.v3-fraktion-row { display: flex; - align-items: baseline; + align-items: center; gap: 8px; flex-wrap: wrap; - margin-bottom: 6px; } .v3-fraktion-name { font-family: var(--font-sans); @@ -203,6 +202,7 @@ letter-spacing: 0.02em; color: var(--ecg-dark); } +.v3-fraktion-spacer { flex: 1 1 auto; } .v3-pill { font-family: var(--font-mono); font-size: 10px; @@ -214,10 +214,13 @@ .v3-pill-antrag { color: #bf6c10; background: rgba(247, 148, 29, 0.15); } .v3-pill-reg { color: #1e6a90; background: rgba(0, 157, 165, 0.15); } +/* Kompakte Programm-Pillen rechts in der Fraktion-Zeile. + Aufklappbar via
; aufgeklappt fließt der Body unter + die Zeile in voller Breite. */ .v3-prog { - border-top: 1px solid var(--hairline); + /* details als grid-item: in der flex-row, body wandert beim Aufklappen + dank flex-basis:100% auf eigene Zeile. */ } -.v3-prog:first-of-type { border-top: 1px dashed var(--hairline); margin-top: 4px; } .v3-prog > summary { list-style: none; cursor: pointer; @@ -226,53 +229,65 @@ } .v3-prog > summary::-webkit-details-marker { display: none; } -.v3-prog-row { - display: flex; - align-items: baseline; - gap: 8px; - padding: 10px 0 8px; +.v3-prog-pill { + display: inline-flex; + align-items: center; + gap: 6px; + padding: 2px 8px; + border: 1px solid var(--hairline); + border-radius: 3px; + background: rgba(0, 0, 0, 0.015); + transition: background 0.12s ease, border-color 0.12s ease; } -.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-pill:hover { + background: rgba(0, 0, 0, 0.04); + border-color: var(--ecg-blue); } -.v3-prog-label::before { +.v3-prog-pill::before { content: "▸"; display: inline-block; - margin-right: 6px; - font-size: 10px; + font-size: 9px; opacity: 0.55; transition: transform 0.15s ease; + margin-right: 1px; } -.v3-prog[open] > summary .v3-prog-label::before { +.v3-prog[open] > .v3-prog-pill::before { transform: rotate(90deg); } -.v3-prog > summary:hover .v3-prog-label { color: var(--ecg-blue); } -.v3-prog-spacer { flex: 1 1 auto; } +.v3-prog-pill-label { + font-family: var(--font-mono); + font-size: 10px; + text-transform: uppercase; + letter-spacing: 0.05em; + color: var(--ecg-dark); + font-weight: 700; +} + .v3-prog-score { font-family: var(--font-mono); - font-size: 12px; + font-size: 11px; font-weight: 700; - padding: 2px 8px; + padding: 1px 6px; 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); } +/* Body bricht aus der flex-row aus und nimmt die volle Breite, + sobald details aufgeklappt ist. */ .v3-prog-body { - padding: 0 0 12px 16px; + flex-basis: 100%; + width: 100%; + margin-top: 8px; + padding: 8px 4px 4px; + border-top: 1px dashed var(--hairline); } .v3-prog-text { font-size: 13.5px; line-height: 1.55; color: var(--ecg-dark); - margin: 0 0 8px; + margin: 0 0 6px; } .v3-prog-zitate { margin-top: 6px; } diff --git a/app/templates/v3/screens/antrag_detail.html b/app/templates/v3/screens/antrag_detail.html index d117e8a..86f4c32 100644 --- a/app/templates/v3/screens/antrag_detail.html +++ b/app/templates/v3/screens/antrag_detail.html @@ -263,41 +263,40 @@ {% for fs in antrag.fraktions_scores %} {% if fs.fraktion | lower not in _missing_set %}
-
+
{{ 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 %} + + {% for prog_key, prog_label, prog_short in [("wahlprogramm","Wahlprogramm","WP"),("parteiprogramm","Parteiprogramm","PP")] %} + {% set p = fs[prog_key] %} + {% set p_score = p.score | float %} +
+ + {{ prog_short }} + {{ "%.0f"|format(p_score) }}/10 + +
+ {% if p.begruendung %}

{{ prog_label }}: {{ p.begruendung }}

{% endif %} + {% if p.zitate %} +
+ {% for z in p.zitate %} + {{ quote_card(z.text, z.source, True, False, z.pdf_href) }} + {% endfor %} +
+ {% else %} +

+ Keine wörtlich passenden Stellen im {{ prog_label }} gefunden. + Die Bewertung beruht auf inhaltlicher Auslegung — entweder benennt das Programm + das konkrete Thema nicht explizit, oder es bleibt zu allgemein, um wörtlich + zugeordnet zu werden. +

+ {% endif %}
- {% else %} -

- Keine wörtlich passenden Stellen im {{ prog_label }} gefunden. - Die Bewertung beruht auf inhaltlicher Auslegung — entweder benennt das Programm - das konkrete Thema nicht explizit, oder es bleibt zu allgemein, um wörtlich - zugeordnet zu werden. -

- {% endif %} -
-
- {% endfor %} +
+ {% endfor %} + {% endif %}{# fraktion nicht in fehlende_programme #} {% endfor %}