Arbeit der parallelen Session gesichert (Profilbilder für Stimmen, Diene-Zugang)
Wie beim vorherigen Mal lag das nur als Arbeitskopie auf dem Server, nicht in git. Unverändert übernommen, bevor darauf aufgebaut wird: - Profilbild-Auswahl für die Stimmen (data-stimmen-avatare.js neu, stimmen.js, i18n-stimmen.js, stimmen.html, verwaltung.html, main.css) - Dritte Zugangs-Kachel für Diene (gate.html, server/gate.js) Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
@@ -4107,6 +4107,61 @@ body.start-seite .music-toggle:focus-visible {
|
||||
background: linear-gradient(135deg, #ffd0e8, #a8e4f2);
|
||||
box-shadow: 0 0 16px rgba(255, 154, 208, .3);
|
||||
}
|
||||
/* Gewähltes Profilbild statt Anfangsbuchstabe (21.08.2026). Erbt Größe und
|
||||
runde Form von .stimmen-karte-avatar oben, ersetzt nur Füllung/Farbe. */
|
||||
.stimmen-karte-avatar-bild {
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
background: rgba(255, 255, 255, .05);
|
||||
box-shadow: 0 0 14px rgba(212, 175, 55, .25);
|
||||
}
|
||||
.stimmen-karte-avatar-bild img { width: 100%; height: 100%; object-fit: cover; display: block; }
|
||||
|
||||
/* ---------- Profilbild-Auswahl im Einreichen-Formular (21.08.2026) ----------
|
||||
Nutzer-Wunsch: "paar geile bilder zum aussuchen ... das soll denen auch
|
||||
als möglichkeit gegeben sein". Kachelraster, das sich der Breite anpasst;
|
||||
die getroffene Wahl bekommt einen goldenen Ring statt nur einer leichten
|
||||
Aufhellung — sonst ist auf dunklem Grund kaum erkennbar, was gewählt ist. */
|
||||
.stimmen-avatar-titel {
|
||||
display: block;
|
||||
font-size: .82rem; font-weight: 700; letter-spacing: .04em;
|
||||
text-transform: uppercase; color: var(--text-muted);
|
||||
margin-bottom: .25rem;
|
||||
}
|
||||
.stimmen-avatar-hinweis { margin: 0 0 .7rem; }
|
||||
.stimmen-avatar-wahl {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(58px, 1fr));
|
||||
gap: .6rem;
|
||||
}
|
||||
.stimmen-avatar-kachel {
|
||||
position: relative;
|
||||
aspect-ratio: 1;
|
||||
padding: 0;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
background: rgba(255, 255, 255, .04);
|
||||
border: 2px solid rgba(255, 255, 255, .12);
|
||||
transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
|
||||
}
|
||||
.stimmen-avatar-kachel img { width: 100%; height: 100%; object-fit: cover; display: block; }
|
||||
.stimmen-avatar-keins {
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
width: 100%; height: 100%;
|
||||
font-size: 1.15rem; color: var(--text-muted);
|
||||
}
|
||||
.stimmen-avatar-kachel:hover { transform: translateY(-2px); border-color: rgba(255, 233, 168, .6); }
|
||||
.stimmen-avatar-kachel.aktiv {
|
||||
border-color: #ffe9a8;
|
||||
box-shadow: 0 0 0 2px rgba(212, 175, 55, .45), 0 0 18px rgba(212, 175, 55, .4);
|
||||
}
|
||||
.stimmen-avatar-kachel:focus-visible { outline: 2px solid #ffe9a8; outline-offset: 3px; }
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.stimmen-avatar-kachel { transition: none; }
|
||||
.stimmen-avatar-kachel:hover { transform: none; }
|
||||
}
|
||||
|
||||
.stimmen-karte-namen { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
|
||||
.stimmen-karte-name { font-weight: 700; color: var(--text); font-size: .95rem; }
|
||||
.stimmen-karte-tiktok {
|
||||
|
||||
Reference in New Issue
Block a user