Filipe: "wieso sieht das so scheisse aus?" -- zum aufgeklappten Auswahlmenue der Kategorie. Er hat recht, und die Ursache ist dieselbe wie bei der Rollenwahl: Ein AUFGEKLAPPTES <select> laesst sich nicht gestalten. Es kommt vom Betriebssystem, in Windows-Weiss, mitten in einer dunklen Oberflaeche. Bei zwanzig Eintraegen kam dazu, dass man in so einer Liste nichts findet. KATEGORIEWAHL: jetzt dieselben sechs Welten, dieselben Farben und dieselben Symbole wie die Kacheln auf der Seite. Man waehlt aus demselben Regal, in dem man sonst stoebert. Unter der Wahl steht die Beschreibung der gewaehlten Kategorie -- die Zeile, die beim Einsortieren die eigentliche Frage beantwortet. Nichts ist vorausgewaehlt (ausser man laedt aus einer Kategorie heraus hoch). Die stille Vorbelegung war der Grund, warum eine PDF ueber TikTok LIVE Studio unter "TikTok - Grundlagen" landete. FILTER Stufe und Geraet: ebenfalls Schalter statt Menue. Zwei bis vier Werte, die sich nie aendern -- dafuer ein Menue zu oeffnen ist ein Klick zu viel. Der Tag-Filter bleibt bewusst ein Auswahlfeld: Tags wachsen mit dem Bestand, eine Schalterreihe waere irgendwann zwei Zeilen lang. Geprueft: 20 Kategorien in 6 Welten, nichts vorausgewaehlt, Filter setzen die Adresse (?stufe=einsteiger), Handy ohne Ueberlauf, 0 Konsolenfehler. Testeintrag landete unter der gewaehlten Kategorie.
105 lines
3.8 KiB
HTML
105 lines
3.8 KiB
HTML
<!doctype html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
|
||
<title>Bereich · Creator Workspace</title>
|
||
<meta name="robots" content="noindex, nofollow" />
|
||
<meta name="theme-color" content="#05070d" />
|
||
<link rel="icon" href="assets/img/favicon.png" />
|
||
<link rel="stylesheet" href="assets/css/gate.css?v=202608311213" />
|
||
<link rel="stylesheet" href="assets/css/start.css?v=202608311213" />
|
||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202608311213" />
|
||
<link rel="stylesheet" href="assets/css/bereich.css?v=202608311213" />
|
||
</head>
|
||
|
||
<body class="start">
|
||
|
||
<header class="kopfleiste">
|
||
<button type="button" class="zurueck-knopf" id="zurueck" hidden>
|
||
<svg class="zurueck-knopf__pfeil" viewBox="0 0 24 24" aria-hidden="true">
|
||
<path d="M14.5 5.5 8 12l6.5 6.5" />
|
||
</svg>
|
||
<span class="zurueck-knopf__text">Zurück</span>
|
||
</button>
|
||
<p class="marke"><a class="zurueck" href="start.html">Creator Workspace</a> ·
|
||
<span id="marke-bereich">…</span></p>
|
||
<div class="kopfleiste__rechts">
|
||
<span class="wer" id="wer">…</span>
|
||
<button type="button" class="abmelden" id="abmelden">Abmelden</button>
|
||
</div>
|
||
</header>
|
||
|
||
<main class="inhalt inhalt--breit">
|
||
|
||
<section class="kopf-zeile">
|
||
<div>
|
||
<p class="marke" id="ober">Betreuung</p>
|
||
<h1 class="titel" id="titel">…</h1>
|
||
<p class="unterzeile" id="unterzeile"></p>
|
||
</div>
|
||
<button type="button" class="knopf knopf--klein" id="neu-oeffnen">Neuer Eintrag</button>
|
||
</section>
|
||
|
||
<form class="neu" id="neu" hidden>
|
||
<div class="neu__raster">
|
||
<div>
|
||
<label class="feld-schild" for="f-art">Art</label>
|
||
<select id="f-art"></select>
|
||
</div>
|
||
<div>
|
||
<label class="feld-schild" for="f-datum">Datum</label>
|
||
<input id="f-datum" type="date" />
|
||
</div>
|
||
<div id="feld-dringlich" hidden>
|
||
<label class="feld-schild" for="f-dringlich">Dringlichkeit</label>
|
||
<select id="f-dringlich">
|
||
<option value="hoch">hoch</option>
|
||
<option value="mittel" selected>mittel</option>
|
||
<option value="niedrig">niedrig</option>
|
||
</select>
|
||
</div>
|
||
<div id="feld-bewertung" hidden>
|
||
<label class="feld-schild" for="f-bewertung">Bewertung (1–5)</label>
|
||
<select id="f-bewertung">
|
||
<option value="">—</option>
|
||
<option value="1">1 – schwach</option>
|
||
<option value="2">2</option>
|
||
<option value="3">3 – solide</option>
|
||
<option value="4">4</option>
|
||
<option value="5">5 – stark</option>
|
||
</select>
|
||
</div>
|
||
<div id="feld-creator" hidden>
|
||
<label class="feld-schild" for="f-creator">Creator</label>
|
||
<select id="f-creator"><option value="">—</option></select>
|
||
</div>
|
||
</div>
|
||
<div class="neu__zeile">
|
||
<label class="feld-schild" for="f-titel">Überschrift</label>
|
||
<input id="f-titel" maxlength="160" required />
|
||
</div>
|
||
<div class="neu__zeile">
|
||
<label class="feld-schild" for="f-text">Text <span class="leise">(optional)</span></label>
|
||
<textarea id="f-text" rows="4" maxlength="6000"></textarea>
|
||
</div>
|
||
<p class="fehler" id="neu-fehler" role="alert" aria-live="polite"></p>
|
||
<div class="neu__knoepfe">
|
||
<button type="submit" class="knopf knopf--klein" id="neu-speichern">Eintragen</button>
|
||
<button type="button" class="abmelden" id="neu-abbrechen">Abbrechen</button>
|
||
</div>
|
||
</form>
|
||
|
||
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
|
||
|
||
<div class="filter" id="filter"></div>
|
||
|
||
<div id="liste" aria-busy="true"><p class="leise">Einträge werden geladen …</p></div>
|
||
|
||
</main>
|
||
|
||
<script src="assets/js/kopf.js?v=202608311213" defer></script>
|
||
<script src="assets/js/bereich.js?v=202608311213" defer></script>
|
||
</body>
|
||
</html>
|