Agentur-Events: zwei Karten nebeneinander, Banner in der Mitte

Filipe: "ich will dass die kachel an sich noch viel geiler und krass
aussieht. die soll aber auch garnicht so breit sein. es sollen immer
zwei neben einander stehen können und wenn man auf banner anzeigen
drückt soll das banner schön in der mitte sein."

GEMESSEN VORHER: Karte 1160 px breit, eine je Reihe (#liste stand auf
display: block). --ton: #cace02 an ALLEN drei Zustaenden -- ein seit
drei Tagen vorbeigelaufenes Event leuchtete wie eines, das laeuft. Und
border-left-width: 0px, border-radius: 0px: Die Dringlichkeitskante aus
bereich.css kommt seit dem Baukasten nicht mehr an (module.css setzt
border: 0, gleich stark und spaeter im Ladeweg).

ZWEI NEBENEINANDER -- die Regel SIEBT, statt zu schalten. #liste traegt
das Raster immer; alles, was keine Eventkarte ist, nimmt mit
`grid-column: 1 / -1` die ganze Breite. In den sieben anderen Bereichen
aendert sich damit kein Pixel. Gemessen: Eventkarten 573 px, die
Schulung daneben weiterhin 1160 px; auf 412 px steht wieder eine je
Reihe (379 px, kein seitliches Schieben).

DAS BANNER KOMMT IN DIE MITTE -- und zwar in der BILDSCHAU, die es seit
dem 25.09.2026 gibt und die hier nur nie angeschlossen war. Sie wurde
damals fuer genau diese Beschwerde gebaut ("wenn man bilder aufmacht,
will ich dass die in der mitte sind"). Ihr Stil ist dafuer aus chat.css
in eine eigene bildschau.css gezogen: bereich.html laedt chat.css nicht,
und 5815 Zeilen Chat auf einer Seite ohne Chat waere der falsche Preis.
Gemessen: 1178x662 px, Mitte 640 gegen 640, Escape schliesst, die Seite
springt nicht weg. Der Weg in den Tab bleibt (mittlere Maustaste, Strg).

ZWEI FEHLER, DIE DIE SCHMALERE KARTE ERST SICHTBAR GEMACHT HAT:

 1. `justify-content: flex-end` an der Buehne laesst den Inhalt nach
    OBEN herauslaufen, wenn der Platz nicht reicht -- und die Karte hat
    ein clip-path, also ist er dann weg. Gemessen: Das Etikett
    "Agentur-Events" sass auf einer Karte bei y = -28 px. Die alte
    Messung fragte nach Farbe, Groesse, Sichtbarkeit und Deckkraft und
    bekam auf alles die richtige Antwort -- nach der LAGE hatte sie nie
    gefragt. Jetzt `margin-top: auto`, das kann nicht herauslaufen.

 2. Die Buehnenhoehe kam aus der BREITE (aspect-ratio 2.6/1, bei
    "vorbei" 3.6/1 mit max-height 190px). Bei halber Kartenbreite
    bricht der Titel auf mehr Zeilen um: Inhalt 231 px, Kasten 220 px
    -- der Zeitbalken lag auf dem Satz darunter. Jetzt eine
    Mindesthoehe, der Rest kommt vom Inhalt. Das Banner liegt absolut
    darin und fuellt jede Hoehe; die Rechnung brauchte es nie.

AUSSERDEM: Jeder Zustand traegt seinen Ton (laeuft = Agenturgelb,
kommt = kuehl, vorbei = stumpf) und faerbt damit Eckwinkel, Kantenlicht
und Zeitbalken mit. Die Farbkante der Karte liegt im Hintergrund statt
auf einem Pseudoelement (beide gehoeren dem Baukasten), 6 px, weil das
Kantenlicht 1,6 px verdeckt. Der Aufgabenzaehler ist eine Pille statt
grauer Text, gleich hohe Karten mit dem Fuss unten.

pruef-eventkarte: 77 -> 94 Pruefungen, gruen. Zwei Gegenproben gefahren
(Ueberlaufschutz entfernt -> rot mit "ev-buehne__inhalt oben -28px";
die neue Lagepruefung nennt den Schuldigen selbst). Neu darin: nichts
darf aus einer Karte herausragen (132 Teile), der Inhalt muss in jede
Buehne passen, und auf 412 px steht eine Karte je Reihe.
Dazu gruen: chat-anhaenge (168, die Bildschau nach dem Umzug),
chat-optik, chat, css-klassen, haus-trennung, lesbarkeit, eintrag-bild,
tippziele, fingermass, leerzustand.

Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
2026-10-07 00:52:53 +02:00
co-authored by Claude Opus 5
parent aaee74818f
commit da557b5288
51 changed files with 1406 additions and 845 deletions
+31 -1
View File
@@ -663,7 +663,37 @@
auf.rel = 'noopener';
auf.append(el('span', 'ev-buehne__ganz-zeichen'));
auf.append(el('span', 'ev-buehne__ganz-wort', 'Banner ganz'));
auf.title = 'Zeigt das Banner in voller Größe in einem neuen Fenster';
auf.title = 'Zeigt das Banner groß in der Mitte';
/* ==== DAS BANNER KOMMT IN DIE MITTE (07.10.2026) =============
Filipe: „wenn man auf banner anzeigen drückt soll das banner
schön in der mitte sein."
Bis heute öffnete dieser Knopf die DATEI in einem neuen Tab --
also nicht unsere Seite, sondern die eingebaute Bildanzeige des
Browsers: Bild oben links, Dateiname in der Titelleiste, der
Rest schwarz. Genau darüber hat Filipe sich am 25.09.2026 schon
einmal beschwert, damals bei den Fotos im Chat, und genau dafür
wurde die BILDSCHAU gebaut: mittig, mit Hintergrund, Husky und
Hase daneben, Escape schließt.
Sie war nur nie hier angeschlossen. Also wird sie angeschlossen
und keine zweite gebaut -- ihr Stil ist dafür am 07.10.2026 aus
chat.css in eine eigene Datei gezogen.
DER WEG IN DEN TAB BLEIBT. Das hier ist weiterhin ein echter
Verweis: mittlere Maustaste, „In neuem Tab öffnen" und
Herunterladen gehen wie vorher. Abgefangen wird nur der
GEWÖHNLICHE Klick -- und auch der nur, wenn die Schau geladen
ist. Fällt die Datei aus, ist man beim alten Verhalten statt
bei gar keinem. */
auf.addEventListener('click', (ev) => {
if (ev.button !== 0 || ev.metaKey || ev.ctrlKey || ev.shiftKey || ev.altKey) return;
if (!window.Bildschau) return;
ev.preventDefault();
window.Bildschau.zeigen(
{ weg: auf.href, name: (e.titel || 'Banner') }, auf);
});
b.append(auf);
}
b.append(el('div', 'ev-buehne__schleier'));