DogFatherGitandClaude Opus 5
0ea8b27aca
Filipe: "ich will dass der rand mit den sekunden minuten und stunden
viel krasser und geiler ist ... ultra modern, ultra speziell, ultra
profissionell, ultra phaenomenal."
EIN STRICH IST EINE LINIE. EIN RING IST EIN KOERPER.
Und ein Koerper hat drei Merkmale, die man zeichnen MUSS, sonst bleibt
es ein Strich. Jeder der drei Ringe besteht deshalb jetzt aus drei
Lagen:
SCHATTEN Er liegt ueber dem Zifferblatt, also wirft er einen.
Dieselbe Bahn, schwarz, ein halbes Rastermass nach UNTEN.
KOERPER Der Bogen selbst in seiner Farbe.
OBERKANTE Duenner, hell, ein Drittel nach OBEN. Weil er versetzt
ist, schaut er oben hervor und verschwindet unten -- genau
das tut eine gewoelbte Kante bei Licht von oben.
Kein Weichzeichner, nirgends: Die Tiefe kommt aus dem Versatz, nicht
aus Unschaerfe.
DIE BAHNEN SIND GEFRAESTE RILLEN
Ein Zeiger laeuft bei einem guten Instrument IN einer Vertiefung. Eine
Rille erkennt man an zweierlei: dunkler als ihre Umgebung, und an ihrer
unteren Wand steht eine helle Kante. Beides steht jetzt da, und die
Breite folgt dem Ring, der darin laeuft -- eine Rille, die schmaler ist
als ihr Zeiger, ist keine.
DREI KOEPFE STATT EINEM
Minute und Stunde bekommen dieselbe polierte Kappe wie die Sekunde, auf
ihren eigenen Bahnen und in ihrer eigenen Farbe. Erst dadurch liest man
die drei Ringe als drei ZEIGER und nicht als drei Fortschrittsbalken.
Sie laufen mit ihrem Ring: die Minute nimmt die Sekunden anteilig mit,
die Stunde die Minuten -- sonst staende der Kopf neben dem Ende seines
Bogens.
ALLE LAGEN WERDEN GEMEINSAM GESETZT. Sie tragen `data-ring`; einzeln
gepflegte Verweise waeren drei Stellen, an denen man eine vergessen
kann, und ein Schatten, der stehen bleibt, sieht sofort kaputt aus.
UND EIN FUND, DEN DIE PRUEFUNG SOFORT GEMELDET HAT
Die neue helle Oberkante des Stundenrings laeuft hinter den Ziffern
durch: schlechtester Kontrast 2,98:1 -- knapp unter der Grenze, und
ausgerechnet bei der Uhrzeit selbst. Die Antwort war nicht "Kante
weg", sondern der fehlende Untergrund: Auf einer echten Uhr steht eine
Anzeige, die ueber Zeigern liegt, auf einer eigenen vertieften INSEL im
Zifferblatt. Jetzt 5,42:1, und dabei 29 statt 14 gemessene Stellen.
Merksatz: Wenn eine neue Schicht einen Text unlesbar macht, ist die
Antwort selten "Schicht weg" -- meistens fehlt dem Text sein Grund.
Zehn Pruefungen gelaufen, alle gruen. Rechner und Handy angesehen.
Co-Authored-By: Claude Opus 5 <[email protected]>
147 lines
6.9 KiB
HTML
147 lines
6.9 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>Personen & Zugänge · Creator Workspace</title>
|
||
<meta name="robots" content="noindex, nofollow" />
|
||
<link rel="manifest" href="/workspace/app.webmanifest" />
|
||
<meta name="theme-color" content="#0674b9" />
|
||
<link rel="icon" type="image/png" href="/assets/img/app-symbole/workspace-32.png" />
|
||
<link rel="apple-touch-icon" href="/assets/img/app-symbole/workspace-180.png" />
|
||
<link rel="stylesheet" href="assets/css/gate.css?v=202609071615" />
|
||
<link rel="stylesheet" href="assets/css/start.css?v=202609071615" />
|
||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609071615" />
|
||
<link rel="stylesheet" href="assets/css/personen.css?v=202609071615" />
|
||
<link rel="stylesheet" href="assets/css/module.css?v=202609071615" />
|
||
</head>
|
||
|
||
<body class="start">
|
||
|
||
<!-- Der Schleier ueber der Buehne (Casper und HasiDog in den unteren
|
||
Ecken, siehe start.css). Ein eigenes Element statt eines dritten
|
||
Pseudo-Elements -- body hat nur ::before und ::after. -->
|
||
<div class="schleier" aria-hidden="true"></div>
|
||
|
||
<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"><span class="marke__text"><a class="zurueck" href="start.html">Creator Workspace</a> · Personen</span></p>
|
||
<div class="kopfleiste__rechts">
|
||
<span class="wer" id="wer">…</span>
|
||
<button type="button" class="abmelden" id="abmelden">Abmelden</button>
|
||
</div>
|
||
</header>
|
||
|
||
<svg style="display:none" aria-hidden="true"><defs>
|
||
<!-- Chili fuer Spicy Media -- dasselbe Zeichen wie auf der
|
||
Anmeldeseite. Zwei Rollen mit derselben Krone waeren genau der
|
||
Fehler, den die Kacheln schon einmal hatten: Man klickt zweimal
|
||
falsch, bevor man merkt, dass es zwei verschiedene sind. -->
|
||
<g id="r-chili"><path d="M13.4 4.6c1.5-.6 2.8.1 3 1.4"/><path d="M13.4 4.6c-.6 1.4-.3 2.6.6 3.4 3 .3 5 2.6 5 5.4 0 3.4-3 6-6.8 6-4.6 0-8.2-2.9-9.7-6.7 3.7.9 6.6-.4 8-3.1.6-1.2.4-2.4-.4-3.1"/></g>
|
||
<g id="r-krone"><path d="M4 17.6 5.4 7.4l4 3.4L12 5.2l2.6 5.6 4-3.4L20 17.6z"/><path d="M4.6 20.4h14.8"/></g>
|
||
<g id="r-stern"><path d="m12 3.4 2.6 5.6 6 .8-4.4 4.2 1.1 6-5.3-2.9-5.3 2.9 1.1-6L3.4 9.8l6-.8z"/></g>
|
||
<g id="r-schutz"><path d="M12 3.4 5.8 5.9v5c0 3.5 2.5 6.7 6.2 8 3.7-1.3 6.2-4.5 6.2-8v-5z"/><path d="m9.5 11.8 1.8 1.8 3.3-3.5"/></g>
|
||
<g id="r-person"><circle cx="12" cy="8.4" r="3.6"/><path d="M5 20c0-3.9 3.1-7 7-7s7 3.1 7 7"/></g>
|
||
</defs></svg>
|
||
|
||
<main class="inhalt inhalt--breit">
|
||
|
||
<section class="kopf-zeile">
|
||
<div>
|
||
<p class="marke">Zugänge</p>
|
||
<h1 class="titel">Personen & Zugangscodes</h1>
|
||
<!-- Der Satz gilt nur für Manager und Spicy Media: Sie sehen hier
|
||
allein das Anlegen. personen.js blendet ihn dafür ein.
|
||
Er stand vorher nur im Skript (`$('unterzeile')`), und dieses
|
||
Element gab es nie -- der Aufruf war mit `&&` abgesichert und
|
||
tat deshalb schweigend nichts. Eine abgesicherte Zeile, die
|
||
ins Leere greift, sieht auf Dauer aus wie eine, die
|
||
funktioniert. -->
|
||
<p class="leise" id="unterzeile" hidden></p>
|
||
</div>
|
||
<div class="kopf-knoepfe">
|
||
<!-- Standardmäßig steht hier nur DogFather. Alle anderen kommen auf
|
||
Knopfdruck dazu – und der Knopf sagt immer, wie viele das sind,
|
||
damit niemand vergisst, dass da noch welche sind. -->
|
||
<button type="button" class="knopf-still" id="rest-schalter"
|
||
aria-expanded="false" aria-controls="liste" hidden>
|
||
<span id="rest-schalter-text">weitere zeigen</span>
|
||
<svg class="klapp-pfeil" viewBox="0 0 24 24" aria-hidden="true">
|
||
<path d="m6 9.5 6 6 6-6" />
|
||
</svg>
|
||
</button>
|
||
<button type="button" class="knopf knopf--klein" id="neu-oeffnen">Person anlegen</button>
|
||
</div>
|
||
</section>
|
||
|
||
<form class="neu" id="neu" hidden>
|
||
<div class="neu__raster">
|
||
<div>
|
||
<label class="feld-schild" for="f-name">Name</label>
|
||
<input id="f-name" name="name" maxlength="60" placeholder="z. B. Luna" required />
|
||
</div>
|
||
<div class="rollenwahl-block">
|
||
<span class="feld-schild">Rolle</span>
|
||
<!-- Kein Auswahlmenü: Bei vier Möglichkeiten ist eine sichtbare
|
||
Wahl schneller und zeigt gleich, was die Rolle bedeutet. Das
|
||
Systemmenü ließ sich ausserdem nicht gestalten. -->
|
||
<div class="rollenwahl" id="f-rolle" role="radiogroup" aria-label="Rolle"></div>
|
||
</div>
|
||
</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">Anlegen</button>
|
||
<button type="button" class="abmelden" id="neu-abbrechen">Abbrechen</button>
|
||
</div>
|
||
</form>
|
||
|
||
<!-- Anzeige des frisch erzeugten Codes. Bewusst auffällig und mit klarem
|
||
Hinweis, dass er nur jetzt zu sehen ist. -->
|
||
<div class="code-kasten" id="code-kasten" hidden role="status" aria-live="polite">
|
||
<p class="code-kasten__schild">Zugangscode für <span id="code-name"></span></p>
|
||
<p class="code-kasten__code" id="code-wert"></p>
|
||
<p class="code-kasten__hinweis">
|
||
Dieser Code wird <strong>nur jetzt</strong> angezeigt und ist danach nicht mehr
|
||
abrufbar. Sicher weitergeben und in Bitwarden ablegen.
|
||
</p>
|
||
<div class="neu__knoepfe">
|
||
<button type="button" class="knopf knopf--klein" id="code-kopieren">Kopieren</button>
|
||
<button type="button" class="abmelden" id="code-schliessen">Verstanden, schließen</button>
|
||
</div>
|
||
</div>
|
||
|
||
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
|
||
|
||
<div id="liste" aria-busy="true"><p class="leise">Personen werden geladen …</p></div>
|
||
|
||
<!-- Das Protokoll ist Nachschlagewerk, nicht Startbild: Standardmäßig
|
||
stehen nur die letzten vier Zeilen da, alles Weitere auf Knopfdruck. -->
|
||
<section class="protokoll-block">
|
||
<div class="klapp-kopf">
|
||
<p class="feldschild">Letzte Ereignisse</p>
|
||
<button type="button" class="knopf-still" id="protokoll-schalter"
|
||
aria-expanded="false" aria-controls="protokoll" hidden>
|
||
<span id="protokoll-schalter-text">Alle zeigen</span>
|
||
<svg class="klapp-pfeil" viewBox="0 0 24 24" aria-hidden="true">
|
||
<path d="m6 9.5 6 6 6-6" />
|
||
</svg>
|
||
</button>
|
||
</div>
|
||
<div id="protokoll" data-klapp="zu"><p class="leise">…</p></div>
|
||
</section>
|
||
|
||
</main>
|
||
|
||
<script src="assets/js/wahl.js?v=202609071615" defer></script>
|
||
<script src="assets/js/bereiche.js?v=202609071615" defer></script>
|
||
<script src="assets/js/kopf.js?v=202609071615" defer></script>
|
||
<script src="assets/js/glocke.js?v=202609071615" defer></script>
|
||
<script src="assets/js/personen.js?v=202609071615" defer></script>
|
||
</body>
|
||
</html>
|