Umsetzung des Entwurfs aus design_handoff_redesign/ -- beide Auftritte
(Produktseite und Community-Hub) plus Dashboard.
Farbe #0a0a0a + Neon-Gelb -> #131316 + Orange-Verlauf aus dem Logo
Schrift Bebas/Barlow/ShareTech -> Chakra Petch + IBM Plex Mono
Form border-radius -> clip-path, oben links + unten rechts
Rauschen, Scanlines, Hintergrundschrift, Kopf-Raster und die Partikel sind
raus; der Schein von oben rechts ersetzt sie. Die Abschraegung ist ein
System und keine sechzig Einzelregeln: eine clip-path-Regel mit --bv, jede
Komponente setzt nur die Tiefe.
Der Farbdurchstich ging durch alle ~55 Abschnitte der style.css, nicht nur
durch die fuenf gezeichneten Seiten -- sonst waeren Galerie, Level,
Composer und Emoji-Auswahl im alten Gelb stehen geblieben. Von --neon ist
nichts uebrig.
Die Schriften kommen weiter self-hosted ueber @fontsource. Der Entwurf
schlaegt einen Google-Fonts-Link vor; das waere eine Fremdanfrage mehr, wo
der Aufbau bisher ohne auskam.
ZWEI FEHLER unterwegs gefunden, beide aelter als dieser Umbau:
1. .btn stand in der Datei NACH .btn-save und .btn-ghost. Bei gleicher
Spezifitaet gewinnt die spaetere Regel, also hat ihr `background: none`
jeden Verlauf ueberschrieben -- der Speichern-Knopf sah aus wie ein
Ghost-Knopf, schon in der gelben Fassung. Die Grundform steht jetzt
vor allen Abwandlungen.
2. .nav-logo ist ein Flex-Container, und `gap` legte sich zwischen die
Textknoten "D4RKST" und <span>3R</span>. In der Leiste stand
"D4RKST 3R". Der Abstand haengt jetzt am Bild statt am Container.
DREI ABWEICHUNGEN vom Entwurf, bewusst:
- Die Statuszeile im Hero zeigt nur "ONLINE", nicht "38 MS · UPTIME
99,2 %". Antwortzeit und Erreichbarkeit des Bots liegen ausschliesslich
hinter /api/settings und damit hinter der Anmeldung; oeffentlich gibt es
sie nirgends. Dafuer braeuchte es einen neuen Endpunkt -- erfunden wird
hier nichts.
- Keine Aura am Hauptknopf: clip-path schneidet den Schatten des eigenen
Elements mit weg. Im Referenz-HTML stehen box-shadow und clip-path am
selben Element, dort ist sie also ebenso wenig zu sehen. Tote
Deklaration weggelassen statt mitgeschleppt.
- Die Config-Bereiche bleiben scharfkantig statt abgeschraegt. In ihnen
klappen Auswahllisten aus dem Panel heraus, die clip-path abschneiden
wuerde. Deckt sich mit der Vorgabe, dass die uebrigen Tabs nur die
Token uebernehmen; die Dashboard-Panels selbst sind abgeschraegt.
Dazu: .content von 860 auf 1160 px, weil die dreispaltigen Raster es
brauchen -- die Devlog-Timeline behaelt 880 px Lesebreite, sonst waeren
die Zeilen zu lang. Der Punkt an den Timeline-Karten ist entfallen: er
sass ausserhalb der Karte und waere von der Abschraegung weggeschnitten
worden.
Welches Wort in einer Ueberschrift den Verlauf bekommt, steht jetzt im
Woerterbuch -- der Teil in eckigen Klammern ("Funk[tionen]", aber
"Fea[tures]"). So entscheidet jede Sprache selbst, wo sich das Wort
teilen laesst.
Mitgezogen: brand.js, das geteilte Design-System fuer die eingebundenen
Dienste. Neue Tokens und Abschraegungen, aber --neon/--neon2 bleiben als
Zweitname stehen -- fremde Apps benutzen sie in ihrem eigenen CSS.
Marken-Dateien nach frontend/public/brand/, verkleinert auf die Groessen,
in denen sie wirklich dargestellt werden: 2,4 MB -> 97 KB.
Geprueft: Build laeuft. Im Browser durchgesehen -- Landing, Funktionen,
Befehle, Hub-Start, Devlogs, Server, Roadmap, Dashboard.
Ungeprueft: das Dashboard mit echter Anmeldung. Eine Sitzung war hier
nicht moeglich, gesehen habe ich es ueber gestubbte API-Antworten. Ebenso
ungeprueft, wie sich die Schriftumstellung auf schmalen Schirmen macht.
NICHT angefasst: die Embed-Farben in runtime-settings.js stehen weiter auf
dem alten Gelb -- die wirken in Discord, nicht auf der Webseite. Und ist
brand_color in der Datenbank gesetzt, behalten die eingebundenen Dienste
ihre bisherige Farbe, unabhaengig von den neuen Vorgabewerten.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Zwei Stellen, an denen die Marke bisher fehlte.
Willkommens-Karte: Das Wasserzeichen war der Markenname als Text mit 5 %
Deckkraft — jetzt der Katzenkopf. Die Datei wird einmal beim Start gelesen
statt bei jedem Beitritt, und fehlt sie, rendert die Karte wie bisher ohne
Wasserzeichen. Der Schalter heisst entsprechend "Logo im Hintergrund".
Link-Vorschau: og:image war nur gesetzt, wenn ein Devlog einen Screenshot
hatte. Startseite, Roadmap, Funktionen und jedes Devlog ohne Bild kamen in
Discord als graue Textzeile. Jetzt faellt alles ohne eigenes Bild auf
og-default.png zurueck (1200x630, Lockup auf Schwarz mit Akzentstreifen),
und twitter:card ist durchgehend summary_large_image.
Die Laufzeit-Datei liegt unter src/bot/assets/, nicht in docs/ — das
Dockerfile kopiert nur src/ und frontend/dist/.
Geprueft: librsvg zeichnet das eingebettete <image> wirklich (42726 Pixel
unterscheiden sich gegen eine Fassung ohne), das OG-Bild landet im dist.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Das Logo lag bisher nirgends im Einsatz — das Favicon war ein handgeschriebenes
Prisma in Gold/Orange, das Wasserzeichen der Willkommens-Karte der blosse
Markenname als Text.
- docs/brand/ mit lockup.png (volles Logo) und mark.png (nur der Wolfskopf)
plus build.py, das beide und alle abgeleiteten Icons erzeugt
- frontend: favicon.svg ersetzt, apple-touch-icon.png dazu und verlinkt
- Zwei Fassungen, weil das Lockup bei 16 px zu einem orangen Balken wird; der
Kopfzuschnitt wurde gegen drei Varianten geprueft
- SVG mit eingebettetem PNG statt Vektorisierung: das Original hat Verlaeufe
und Schattierung, nachgezeichnet wuerde es matschen
- Die Icons auf dunklem Grund sind deckend, sonst legt iOS hinter transparente
Lesezeichen Schwarz oder Weiss und der Wolf ist selbst fast schwarz
Geprueft: beide Dateien werden mit korrektem MIME-Typ ausgeliefert und das SVG
rendert wirklich (128x128), die Link-Tags stehen im gebauten HTML.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
D4rkst3randClaude Opus 5