feat(sources): UI fuer Quellen-Klassifikation (Filter, Badges, Edit-Form)
- Quellen-Modal: 4 neue Filter (Politik, Medientyp, Reliability, Alignment). - Edit-Form: Selects fuer political_orientation/media_type/reliability, Multi-Select-Chips fuer alignments, Toggle state_affiliated, Country-Code-Input. - renderSourceGroup: Politik-Badge mit DACH-Farbskala (rot=L, blau=R), Reliability-Punkt (gruen→rot), Alignment-Tags, state-affiliated-Indikator. Tooltip um alle 4 Achsen erweitert. - CSS-Block fuer alle neuen Badge-/Chip-Styles. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Dieser Commit ist enthalten in:
@@ -3503,6 +3503,117 @@ a.dev-source-pill:hover {
|
||||
color: var(--info);
|
||||
}
|
||||
|
||||
/* Klassifikations-Badges (politisch / reliability / alignments / state) */
|
||||
.source-classification-badges {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.source-political-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-width: 22px;
|
||||
padding: 2px 6px;
|
||||
border-radius: var(--radius);
|
||||
font-size: 10px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.4px;
|
||||
color: #fff;
|
||||
background: #9e9e9e;
|
||||
}
|
||||
.source-political-badge.pol-links_extrem { background: #b71c1c; }
|
||||
.source-political-badge.pol-links { background: #e53935; }
|
||||
.source-political-badge.pol-mitte_links { background: #ef9a9a; color: #4a0d0d; }
|
||||
.source-political-badge.pol-liberal { background: #fdd835; color: #4a3700; }
|
||||
.source-political-badge.pol-mitte { background: #9e9e9e; }
|
||||
.source-political-badge.pol-konservativ { background: #90caf9; color: #0d2740; }
|
||||
.source-political-badge.pol-mitte_rechts { background: #5c6bc0; }
|
||||
.source-political-badge.pol-rechts { background: #1976d2; }
|
||||
.source-political-badge.pol-rechts_extrem { background: #0d47a1; }
|
||||
|
||||
.source-reliability-dot {
|
||||
display: inline-block;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 50%;
|
||||
background: #9e9e9e;
|
||||
border: 1px solid rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
.source-reliability-dot.rel-sehr_hoch { background: #2e7d32; }
|
||||
.source-reliability-dot.rel-hoch { background: #66bb6a; }
|
||||
.source-reliability-dot.rel-gemischt { background: #fbc02d; }
|
||||
.source-reliability-dot.rel-niedrig { background: #ef6c00; }
|
||||
.source-reliability-dot.rel-sehr_niedrig { background: #c62828; }
|
||||
|
||||
.source-state-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border-radius: 50%;
|
||||
background: #4a148c;
|
||||
color: #fff;
|
||||
font-size: 11px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.source-alignment-chip-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 1px 6px;
|
||||
border-radius: 999px;
|
||||
font-size: 10px;
|
||||
font-weight: 500;
|
||||
background: var(--cat-sonstige-bg, #eef);
|
||||
color: var(--text-secondary, #555);
|
||||
border: 1px solid rgba(0, 0, 0, 0.08);
|
||||
}
|
||||
|
||||
/* Edit-Form: Klassifikations-Sektion */
|
||||
.sources-classification-section {
|
||||
margin-top: 12px;
|
||||
padding-top: 12px;
|
||||
border-top: 1px solid var(--border-color, rgba(0,0,0,0.08));
|
||||
}
|
||||
.sources-classification-header {
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
color: var(--text-secondary, #555);
|
||||
margin-bottom: 8px;
|
||||
letter-spacing: 0.3px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.alignment-chips {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 6px;
|
||||
}
|
||||
.alignment-chip {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 4px 10px;
|
||||
border-radius: 999px;
|
||||
font-size: 11px;
|
||||
font-weight: 500;
|
||||
background: transparent;
|
||||
color: var(--text-secondary, #555);
|
||||
border: 1px solid var(--border-color, rgba(0,0,0,0.15));
|
||||
cursor: pointer;
|
||||
transition: all 0.12s ease;
|
||||
}
|
||||
.alignment-chip:hover {
|
||||
background: var(--cat-sonstige-bg, #eef);
|
||||
}
|
||||
.alignment-chip.active {
|
||||
background: var(--primary, #2a81cb);
|
||||
color: #fff;
|
||||
border-color: var(--primary, #2a81cb);
|
||||
}
|
||||
|
||||
/* Typ-Badges */
|
||||
.source-type-badge {
|
||||
display: inline-flex;
|
||||
|
||||
In neuem Issue referenzieren
Einen Benutzer sperren