UI: Avatar entfernt, Streaming-Topbar mit Labels
- DK-Avatar aus Header entfernt (kein Zweck) - Streaming-Felder haben jetzt Ueberschriften: Name, Titel, Passwort, Qualitaet - Passwort-Feld von 140px auf 180px verbreitert - Topbar aligned an Feldunterkante (flex-end) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
3127d31355
commit
041557c885
3 changed files with 65 additions and 37 deletions
|
|
@ -719,39 +719,50 @@ export default function StreamingTab({ data, isAdmin: isAdminProp = false }: { d
|
|||
)}
|
||||
|
||||
<div className="stream-topbar">
|
||||
<input
|
||||
className="stream-input stream-input-name"
|
||||
placeholder="Dein Name"
|
||||
value={userName}
|
||||
onChange={e => setUserName(e.target.value)}
|
||||
disabled={isBroadcasting}
|
||||
/>
|
||||
<input
|
||||
className="stream-input stream-input-title"
|
||||
placeholder="Stream-Titel"
|
||||
value={streamTitle}
|
||||
onChange={e => setStreamTitle(e.target.value)}
|
||||
disabled={isBroadcasting}
|
||||
/>
|
||||
<input
|
||||
className="stream-input stream-input-password"
|
||||
type="password"
|
||||
placeholder="Passwort (optional)"
|
||||
value={streamPassword}
|
||||
onChange={e => setStreamPassword(e.target.value)}
|
||||
disabled={isBroadcasting}
|
||||
/>
|
||||
<select
|
||||
className="stream-select-quality"
|
||||
value={qualityIdx}
|
||||
onChange={e => setQualityIdx(Number(e.target.value))}
|
||||
disabled={isBroadcasting}
|
||||
title="Stream-Qualität"
|
||||
>
|
||||
{QUALITY_PRESETS.map((p, i) => (
|
||||
<option key={p.label} value={i}>{p.label}</option>
|
||||
))}
|
||||
</select>
|
||||
<label className="stream-field">
|
||||
<span className="stream-field-label">Name</span>
|
||||
<input
|
||||
className="stream-input stream-input-name"
|
||||
placeholder="Dein Name"
|
||||
value={userName}
|
||||
onChange={e => setUserName(e.target.value)}
|
||||
disabled={isBroadcasting}
|
||||
/>
|
||||
</label>
|
||||
<label className="stream-field stream-field-grow">
|
||||
<span className="stream-field-label">Titel</span>
|
||||
<input
|
||||
className="stream-input stream-input-title"
|
||||
placeholder="Stream-Titel"
|
||||
value={streamTitle}
|
||||
onChange={e => setStreamTitle(e.target.value)}
|
||||
disabled={isBroadcasting}
|
||||
/>
|
||||
</label>
|
||||
<label className="stream-field">
|
||||
<span className="stream-field-label">Passwort</span>
|
||||
<input
|
||||
className="stream-input stream-input-password"
|
||||
type="password"
|
||||
placeholder="optional"
|
||||
value={streamPassword}
|
||||
onChange={e => setStreamPassword(e.target.value)}
|
||||
disabled={isBroadcasting}
|
||||
/>
|
||||
</label>
|
||||
<label className="stream-field">
|
||||
<span className="stream-field-label">Qualit{'\u00E4'}t</span>
|
||||
<select
|
||||
className="stream-select-quality"
|
||||
value={qualityIdx}
|
||||
onChange={e => setQualityIdx(Number(e.target.value))}
|
||||
disabled={isBroadcasting}
|
||||
>
|
||||
{QUALITY_PRESETS.map((p, i) => (
|
||||
<option key={p.label} value={i}>{p.label}</option>
|
||||
))}
|
||||
</select>
|
||||
</label>
|
||||
{isBroadcasting ? (
|
||||
<button className="stream-btn stream-btn-stop" onClick={stopBroadcast}>
|
||||
{'\u23F9'} Stream beenden
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue