feat(#177 Phase 21+22): Verdict-Umfluss + Merken bei Bewertung

Phase 21 — Score-Hero auf Float-Layout:
- Score-Zahl floated links, Verdict-Text fließt rechts daneben UND
  unter sie weiter (vorher: flex-baseline, Text bricht nicht um).
- overflow:hidden auf Container fuer clean float-clearing.

Phase 22 — Merken-Button oben rechts auf gleicher Höhe wie 'Bewertung'-Label:
- Visuelle Einheit: 'Bewertung'-Header links, Merken-Button rechts.
- Vorher: Merken-Button stand alleinig zwischen Score und Vote-Block,
  optisch losgeloest.

Refs: #177

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Dotty Dotter 2026-05-07 09:13:37 +02:00
parent 045461492f
commit d80e6e7aad
2 changed files with 23 additions and 10 deletions

View File

@ -486,13 +486,13 @@ body.v2 strong, body.v2 b {
/* ── Score Hero ─────────────────────────────────────────────────── */ /* ── Score Hero ─────────────────────────────────────────────────── */
.v2-score-hero { .v2-score-hero {
display: flex; /* Float-Layout: Score-Zahl links, Verdict-Text fließt rechts daneben
align-items: baseline; UND darunter so nutzt langer Text den Platz unter der Zahl. */
gap: 22px;
padding: 20px 0 22px; padding: 20px 0 22px;
border-top: 2px solid var(--ecg-green); border-top: 2px solid var(--ecg-green);
border-bottom: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline);
margin: 4px 0 22px; margin: 4px 0 22px;
overflow: hidden; /* clear float */
} }
.v2-score-hero.low { .v2-score-hero.low {
@ -506,6 +506,19 @@ body.v2 strong, body.v2 b {
line-height: 0.9; line-height: 0.9;
color: var(--ecg-green); color: var(--ecg-green);
letter-spacing: -0.02em; letter-spacing: -0.02em;
/* Umfluss: Score links, Text fließt rechts/drunter */
float: left;
margin-right: 22px;
margin-bottom: 4px;
}
.v2-score-hero .verdict {
/* kein float — Text läuft rechts vom big-num und unter sie */
font-size: 14px;
line-height: 1.55;
}
.v2-score-hero .verdict b {
display: inline-block;
margin-right: 6px;
} }
.v2-score-hero.low .big-num { .v2-score-hero.low .big-num {

View File

@ -216,15 +216,13 @@
{# ── Rechte Spalte: Bewertungs-Panel ── #} {# ── Rechte Spalte: Bewertungs-Panel ── #}
<div class="right"> <div class="right">
<div class="v2-antrag-id">Bewertung</div> {# Bewertungs-Header mit Merken-Button rechts — visuelle Einheit
(User-Wunsch: „Bewertung passend zu Merken verschieben"). #}
{{ score_hero(antrag.score | default(0), antrag.verdict_title | default(""), antrag.verdict_body | default("")) }} <div style="display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px;">
<div class="v2-antrag-id">Bewertung</div>
{# ── Merkliste-Stern (#140) ── #}
<div style="margin-top:12px;margin-bottom:4px;">
<button id="v2-merkliste-btn" <button id="v2-merkliste-btn"
onclick="v2DetailMerklisteToggle()" onclick="v2DetailMerklisteToggle()"
style="display:inline-flex;align-items:center;gap:6px;padding:5px 12px; style="display:inline-flex;align-items:center;gap:6px;padding:4px 10px;
border:1px solid var(--hairline);border-radius:4px;background:none; border:1px solid var(--hairline);border-radius:4px;background:none;
cursor:pointer;font-family:var(--font-mono);font-size:11px;color:var(--ecg-dark);"> cursor:pointer;font-family:var(--font-mono);font-size:11px;color:var(--ecg-dark);">
<span id="v2-merkliste-star"></span> <span id="v2-merkliste-star"></span>
@ -232,6 +230,8 @@
</button> </button>
</div> </div>
{{ score_hero(antrag.score | default(0), antrag.verdict_title | default(""), antrag.verdict_body | default("")) }}
{# ── Namentliche Abstimmung (#106 Phase 1) ── #} {# ── Namentliche Abstimmung (#106 Phase 1) ── #}
{% if antrag.abstimmungsverhalten %} {% if antrag.abstimmungsverhalten %}
{% set aw = antrag.abstimmungsverhalten %} {% set aw = antrag.abstimmungsverhalten %}