Workspace: Casper und HasiDog als Buehne im Hintergrund
Filipe: "der hintergrund soll genau so krass und speziell sein, benutz
den hasen und husky."
Gefunden in assets/img: hero-husky.png (Casper, neonblau auf dunkel --
farblich genau die Oberflaeche) und char-hasidog.jpg (HasiDog). Der
Sticker "HasiDog & Casper" hat bestaetigt, dass die beiden zusammen
gehoeren.
Beide sitzen FEST an der Scheibe in den unteren Ecken -- sie scrollen
nicht mit, sondern stehen da wie ein Buehnenbild, vor dem gearbeitet
wird. Die Mitte bleibt frei, dort steht der Inhalt. HasiDog ist weiter
nach aussen geschoben und schwaecher als Casper: Er ist heller, sein
Gesicht zieht den Blick staerker, und direkt neben einer Kachel wuerde
man ihn ansehen statt der Kachel.
AUFBEREITET STATT EINGEBUNDEN (tools/buehne-bauen.mjs):
* stark abgedunkelt und leicht entsaettigt -- Stimmung, kein Motiv
* weiche Raender ins Bild EINGERECHNET. Ein hartes Rechteck saehe nach
aufgeklebtem Foto aus; und eine Maske ueber ein 900-Pixel-Bild kostet
bei jedem Bildaufbau Rechenzeit.
* 290 KB PNG -> 41 KB WebP, 110 KB -> 32 KB
Gerechnet mit dem Browser, der ohnehin fuer die Pruefungen da ist -- kein
Bildprogramm, keine neue Abhaengigkeit, 0 EUR.
GEPRUEFT WIRD NICHT, OB ES HUEBSCH IST, sondern ob der Text noch lesbar
ist -- an echten BILDPUNKTEN aus dem fertigen Bildschirmfoto, nicht an
der Farbangabe im Stil. Die weiss naemlich nichts davon, was
dahinterliegt. Gemessen wird der Untergrund direkt NEBEN jedem sichtbaren
Text, auf fuenf Seiten, auf Computer und Handy: bis zu 34 Stellen je
Seite gegen den WCAG-Massstab (4,5:1, bei grosser Schrift 3:1).
UND DAS HAT SOFORT EINEN ALTEN FEHLER GEFUNDEN: Der leiseste Grauton
(--text-still) lag bei 4,43:1 -- knapp UNTER der Norm. Das war schon
lange so, nur hatte es nie jemand nachgerechnet, weil bisher niemand an
echten Bildpunkten gemessen hat. Von #6d7d92 auf #75859a angehoben; jetzt
4,95:1 auf dem hellsten Untergrund. Das gilt fuer JEDE Seite, nicht nur
fuer die mit dem Hintergrundbild.
Schlechtester Wert jetzt: 4,97:1. Alle 30 Messungen bestanden.
Nebenbei eine Falle in den Pruefungen selbst: Ein haengengebliebener
Testserver auf demselben Port fing die Anfragen ab -- der Test sprach mit
einem ALTEN Prozess und dessen anderer Datenbank, und meldete "no such
table". Der Port ist jetzt ein anderer; die Lehre steht hier, weil das
Bild "Server laeuft" trotzdem erscheint und alles richtig aussieht.
Co-Authored-By: Claude Opus 5 <[email protected]>
|
After Width: | Height: | Size: 820 KiB |
|
Before Width: | Height: | Size: 801 KiB After Width: | Height: | Size: 1.1 MiB |
|
Before Width: | Height: | Size: 705 KiB After Width: | Height: | Size: 1007 KiB |
|
Before Width: | Height: | Size: 650 KiB After Width: | Height: | Size: 713 KiB |
@@ -0,0 +1,161 @@
|
||||
/* ===================================================================
|
||||
Pruefung der Buehne (Casper und HasiDog im Hintergrund).
|
||||
|
||||
Ein Bild hinter einem Arbeitswerkzeug ist der schnellste Weg zu einer
|
||||
Oberflaeche, die gut aussieht und unbenutzbar ist. Deshalb wird hier
|
||||
NICHT geprueft, ob es huebsch ist, sondern ob der Text noch lesbar
|
||||
ist -- und zwar an echten BILDPUNKTEN aus dem fertigen Bild, nicht an
|
||||
der Farbangabe im Stil. Die sagt naemlich nichts darueber, was
|
||||
dahinterliegt.
|
||||
|
||||
Massstab WCAG: 4,5:1 fuer normalen Text, 3:1 fuer grossen.
|
||||
=================================================================== */
|
||||
import { mkdtempSync, rmSync } from "node:fs";
|
||||
import { tmpdir } from "node:os";
|
||||
import { join } from "node:path";
|
||||
|
||||
const ordner = mkdtempSync(join(tmpdir(), "ws-buehne-"));
|
||||
process.env.WORKSPACE_DB = join(ordner, "workspace.db");
|
||||
process.env.PORT = "4193";
|
||||
process.env.SITE_ACCESS_SECRET = "lokaler-test";
|
||||
process.env.SITE_ACCESS_CODE_DOGI = "DOGI-TEST-1";
|
||||
process.env.SITE_ACCESS_CODE_VANVAN = "VANVAN-TEST-1";
|
||||
process.env.SITE_PUBLIC_LAUNCH_AT = "2020-01-01T00:00:00+01:00";
|
||||
|
||||
const express = (await import("express")).default;
|
||||
const ec = express.response.cookie;
|
||||
express.response.cookie = function (n, w, o) { return ec.call(this, n, w, { ...(o || {}), secure: false }); };
|
||||
await import("./index.js");
|
||||
await new Promise((r) => setTimeout(r, 700));
|
||||
const BASIS = "http://127.0.0.1:4193";
|
||||
setTimeout(() => { console.log("ABBRUCH"); process.exit(1); }, 220_000).unref?.();
|
||||
|
||||
let fehler = 0;
|
||||
const ok = (b, t) => { console.log((b ? " ok " : " FEHL ") + t); if (!b) fehler++; };
|
||||
|
||||
await fetch(BASIS + "/workspace/api/anmelden", {
|
||||
method: "POST", headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({ rolle: "admin", code: "x" }) }).catch(() => {});
|
||||
|
||||
const { DatabaseSync } = await import("node:sqlite");
|
||||
const { scryptSync, randomBytes } = await import("node:crypto");
|
||||
|
||||
/* Warten, bis der Server die Datenbank wirklich angelegt hat. Der
|
||||
Anmeldeversuch oben STOESST das nur an -- Schema und Umstellungen
|
||||
laufen danach. Wer sofort weiterschreibt, trifft auf "no such table". */
|
||||
for (let i = 0; i < 60; i++) {
|
||||
try {
|
||||
const p = new DatabaseSync(process.env.WORKSPACE_DB);
|
||||
try { p.prepare("SELECT 1 FROM personen LIMIT 1").get(); break; } finally { p.close(); }
|
||||
} catch (f) {
|
||||
if (i === 0 || i === 5) console.log(" warte auf die Datenbank:", f.message);
|
||||
await new Promise((r) => setTimeout(r, 250));
|
||||
}
|
||||
}
|
||||
|
||||
const d = new DatabaseSync(process.env.WORKSPACE_DB);
|
||||
const jetzt = new Date().toISOString();
|
||||
const salt = randomBytes(16).toString("hex");
|
||||
const hash = scryptSync("CODE-DOGI-0001", salt, 64, { N: 32768, r: 8, p: 1, maxmem: 96 * 1024 * 1024 }).toString("hex");
|
||||
d.prepare("INSERT INTO personen (name, rolle, code_hash, code_salt, code_n, aktiv, erstellt) VALUES (?,?,?,?,?,1,?)")
|
||||
.run("Filipe", "admin", hash, salt, 32768, jetzt);
|
||||
d.close();
|
||||
|
||||
const { chromium } = await import(
|
||||
"file:///C:/Users/qciga/Documents/Obelix/Analyse/node_modules/playwright/index.mjs");
|
||||
const browser = await chromium.launch();
|
||||
|
||||
const SEITEN = ["start.html", "uebersicht.html", "personen.html", "content.html", "aufgaben.html"];
|
||||
|
||||
for (const [breite, hoehe, wie] of [[1440, 950, "Computer"], [390, 780, "Handy"]]) {
|
||||
console.log(`\n=== ${wie} (${breite}x${hoehe})`);
|
||||
const kontext = await browser.newContext({ viewport: { width: breite, height: hoehe } });
|
||||
const seite = await kontext.newPage();
|
||||
await seite.goto(BASIS + "/workspace/", { waitUntil: "domcontentloaded" });
|
||||
await seite.click('.rolle[data-rolle="admin"]');
|
||||
await seite.fill("#code", "CODE-DOGI-0001");
|
||||
await seite.click("button[type=submit]");
|
||||
await seite.waitForURL("**/start.html", { timeout: 15000 });
|
||||
|
||||
for (const s of SEITEN) {
|
||||
await seite.goto(BASIS + "/workspace/" + s, { waitUntil: "networkidle" });
|
||||
await seite.waitForTimeout(800);
|
||||
|
||||
const da = await seite.evaluate(() => ({
|
||||
husky: /buehne-husky/.test(getComputedStyle(document.body, "::before").backgroundImage),
|
||||
hasi: /buehne-hasi/.test(getComputedStyle(document.body, "::after").backgroundImage),
|
||||
schleier: !!document.querySelector(".schleier"),
|
||||
durchlaessig: getComputedStyle(document.querySelector(".schleier") || document.body).pointerEvents,
|
||||
}));
|
||||
if (s === "start.html") {
|
||||
ok(da.husky, "Casper liegt im Hintergrund");
|
||||
ok(da.hasi, "HasiDog liegt im Hintergrund");
|
||||
}
|
||||
ok(da.schleier && da.durchlaessig === "none",
|
||||
`${s}: Schleier da und durchlässig für Klicks (${da.durchlaessig})`);
|
||||
|
||||
/* Der eigentliche Punkt: Kontrast an ECHTEN Bildpunkten aus dem
|
||||
fertigen Bild. Gemessen wird der Untergrund direkt NEBEN jedem
|
||||
sichtbaren Text -- nicht die Farbangabe im Stil, die weiß nichts
|
||||
davon, was dahinterliegt. */
|
||||
const bild = await seite.screenshot({ type: "png" });
|
||||
const schlimmster = await seite.evaluate(async (b64) => {
|
||||
const kanal = (v) => { v /= 255; return v <= 0.03928 ? v / 12.92 : ((v + 0.055) / 1.055) ** 2.4; };
|
||||
const hell = (c) => 0.2126 * kanal(c[0]) + 0.7152 * kanal(c[1]) + 0.0722 * kanal(c[2]);
|
||||
const kontrast = (a, b) => {
|
||||
const w = [hell(a), hell(b)].sort((x, y) => y - x);
|
||||
return (w[0] + 0.05) / (w[1] + 0.05);
|
||||
};
|
||||
|
||||
const bild = new Image();
|
||||
bild.src = "data:image/png;base64," + b64;
|
||||
await bild.decode();
|
||||
const c = document.createElement("canvas");
|
||||
c.width = bild.width; c.height = bild.height;
|
||||
const g = c.getContext("2d");
|
||||
g.drawImage(bild, 0, 0);
|
||||
const skala = bild.width / window.innerWidth;
|
||||
|
||||
let schlecht = null, anzahl = 0;
|
||||
const alle = [...document.querySelectorAll("p, h1, h2, h3, span, a, li")]
|
||||
.filter((e) => e.children.length === 0 && e.textContent.trim().length > 2);
|
||||
for (const e of alle) {
|
||||
const r = e.getBoundingClientRect();
|
||||
if (r.width < 8 || r.height < 8) continue;
|
||||
if (r.top < 0 || r.bottom > window.innerHeight) continue;
|
||||
const x = Math.round((r.left + r.width + 4) * skala);
|
||||
const y = Math.round((r.top + r.height / 2) * skala);
|
||||
if (x < 0 || x >= c.width || y < 0 || y >= c.height) continue;
|
||||
const p = g.getImageData(x, y, 1, 1).data;
|
||||
const st = getComputedStyle(e);
|
||||
const farbe = st.color.match(/\d+/g).slice(0, 3).map(Number);
|
||||
const gr = parseFloat(st.fontSize);
|
||||
const fett = Number(st.fontWeight) >= 700;
|
||||
const grenze = (gr >= 24 || (gr >= 18.66 && fett)) ? 3 : 4.5;
|
||||
const v = kontrast(farbe, [p[0], p[1], p[2]]);
|
||||
anzahl++;
|
||||
if (!schlecht || v / grenze < schlecht.v / schlecht.grenze) {
|
||||
schlecht = { v, grenze, text: e.textContent.trim().slice(0, 26), grund: [p[0], p[1], p[2]] };
|
||||
}
|
||||
}
|
||||
return { ...schlecht, anzahl };
|
||||
}, bild.toString("base64"));
|
||||
|
||||
ok(schlimmster.v >= schlimmster.grenze,
|
||||
`${s}: schlechtester Kontrast ${schlimmster.v.toFixed(2)}:1 (nötig ${schlimmster.grenze}:1) `
|
||||
+ `bei "${schlimmster.text}" auf rgb(${schlimmster.grund.join(",")}) · `
|
||||
+ `${schlimmster.anzahl} Stellen gemessen`);
|
||||
}
|
||||
|
||||
if (breite === 1440) {
|
||||
await seite.goto(BASIS + "/workspace/start.html", { waitUntil: "networkidle" });
|
||||
await seite.waitForTimeout(800);
|
||||
await seite.screenshot({ path: "pruef-buehne.png" });
|
||||
}
|
||||
await kontext.close();
|
||||
}
|
||||
|
||||
await browser.close();
|
||||
console.log(`\n${fehler === 0 ? "Alles in Ordnung." : fehler + " Prüfung(en) fehlgeschlagen."}`);
|
||||
try { rmSync(ordner, { recursive: true, force: true }); } catch { /* egal */ }
|
||||
process.exit(fehler === 0 ? 0 : 1);
|
||||
@@ -0,0 +1,126 @@
|
||||
/* ===================================================================
|
||||
Baut die beiden Hintergrundbilder für den Workspace.
|
||||
|
||||
Filipe: "der hintergrund soll genau so krass und speziell sein,
|
||||
benutz den hasen und husky."
|
||||
|
||||
Warum die Bilder AUFBEREITET werden, statt sie einfach einzubinden:
|
||||
|
||||
1. Ein Foto hinter einem Arbeitswerkzeug macht Text unlesbar. Die
|
||||
Bilder werden deshalb stark abgedunkelt und leicht entsättigt --
|
||||
sie sollen eine Stimmung sein, kein Motiv.
|
||||
|
||||
2. Sie bekommen einen weichen Rand. Ein hartes Rechteck sieht nach
|
||||
aufgeklebtem Bild aus; ein auslaufender Rand sieht nach Bühne aus.
|
||||
Der Verlauf wird HIER eingerechnet und nicht im Browser: Eine
|
||||
Maske über ein 900-Pixel-Bild kostet bei jedem Bildaufbau Rechenzeit.
|
||||
|
||||
3. Aus 290 KB PNG werden rund 40 KB WebP. Die Seite laedt auf jedem
|
||||
Aufruf schneller, und das Bild liegt im Zwischenspeicher.
|
||||
|
||||
Gerechnet wird mit dem Browser, der ohnehin fuer die Pruefungen da ist
|
||||
-- kein zusaetzliches Bildprogramm, keine neue Abhaengigkeit, 0 EUR.
|
||||
|
||||
Aufrufen mit: node tools/buehne-bauen.mjs
|
||||
=================================================================== */
|
||||
|
||||
import { readFileSync, writeFileSync, existsSync, mkdirSync } from "node:fs";
|
||||
import { join, dirname } from "node:path";
|
||||
import { fileURLToPath } from "node:url";
|
||||
|
||||
const WURZEL = join(dirname(fileURLToPath(import.meta.url)), "..");
|
||||
const QUELLE = join(WURZEL, "assets", "img");
|
||||
const ZIEL = join(WURZEL, "workspace", "assets", "img");
|
||||
if (!existsSync(ZIEL)) mkdirSync(ZIEL, { recursive: true });
|
||||
|
||||
const AUFTRAEGE = [
|
||||
{
|
||||
/* Casper, der Husky. Neonblau auf Dunkel -- er passt farblich genau
|
||||
zur Oberfläche, anders als die warmen Fotomontagen. Sitzt unten
|
||||
links und schaut nach rechts in die Seite hinein. */
|
||||
quelle: "hero-husky.png",
|
||||
ziel: "buehne-husky.webp",
|
||||
breite: 900, hoehe: 900,
|
||||
ausschnitt: [0, 0, 1, 1],
|
||||
spiegeln: false,
|
||||
/* Weich ausblenden nach rechts und nach oben -- dorthin, wo der
|
||||
Inhalt steht. */
|
||||
verlauf: [
|
||||
{ art: "linear", von: [0.55, 0], nach: [1, 0], stopps: [[0, 0], [1, 1]] },
|
||||
{ art: "linear", von: [0, 0], nach: [0, 0.55], stopps: [[0, 1], [1, 0]] },
|
||||
],
|
||||
helligkeit: 0.62, saettigung: 1.0,
|
||||
},
|
||||
{
|
||||
/* HasiDog. Das Ganzkoerperbild wird auf Kopf und Oberkoerper
|
||||
beschnitten -- die Fuesse traegt am unteren Bildrand niemand. */
|
||||
quelle: "char-hasidog.jpg",
|
||||
ziel: "buehne-hasi.webp",
|
||||
breite: 760, hoehe: 900,
|
||||
ausschnitt: [0.02, 0.02, 0.96, 0.78],
|
||||
spiegeln: true,
|
||||
verlauf: [
|
||||
{ art: "linear", von: [0.45, 0], nach: [0, 0], stopps: [[0, 0], [1, 1]] },
|
||||
{ art: "linear", von: [0, 0], nach: [0, 0.5], stopps: [[0, 1], [1, 0]] },
|
||||
],
|
||||
helligkeit: 0.5, saettigung: 0.9,
|
||||
},
|
||||
];
|
||||
|
||||
const { chromium } = await import(
|
||||
"file:///C:/Users/qciga/Documents/Obelix/Analyse/node_modules/playwright/index.mjs");
|
||||
const browser = await chromium.launch();
|
||||
const seite = await browser.newPage();
|
||||
await seite.setContent("<html><body></body></html>");
|
||||
|
||||
for (const a of AUFTRAEGE) {
|
||||
const roh = readFileSync(join(QUELLE, a.quelle));
|
||||
const art = a.quelle.endsWith(".png") ? "image/png" : "image/jpeg";
|
||||
const daten = `data:${art};base64,${roh.toString("base64")}`;
|
||||
|
||||
const webp = await seite.evaluate(async ({ daten, a }) => {
|
||||
const bild = new Image();
|
||||
bild.src = daten;
|
||||
await bild.decode();
|
||||
|
||||
const c = document.createElement("canvas");
|
||||
c.width = a.breite; c.height = a.hoehe;
|
||||
const g = c.getContext("2d");
|
||||
|
||||
const [ax, ay, aw, ah] = a.ausschnitt;
|
||||
g.filter = `brightness(${a.helligkeit}) saturate(${a.saettigung}) contrast(1.04)`;
|
||||
if (a.spiegeln) { g.translate(a.breite, 0); g.scale(-1, 1); }
|
||||
g.drawImage(bild,
|
||||
bild.naturalWidth * ax, bild.naturalHeight * ay,
|
||||
bild.naturalWidth * aw, bild.naturalHeight * ah,
|
||||
0, 0, a.breite, a.hoehe);
|
||||
g.setTransform(1, 0, 0, 1, 0, 0);
|
||||
g.filter = "none";
|
||||
|
||||
/* Die weichen Raender. destination-out radiert dort, wo der Verlauf
|
||||
deckend ist -- so bleibt das Bild in der Ecke stehen und loest
|
||||
sich zur Seite hin auf. */
|
||||
g.globalCompositeOperation = "destination-out";
|
||||
for (const v of a.verlauf) {
|
||||
const gr = g.createLinearGradient(
|
||||
v.von[0] * a.breite, v.von[1] * a.hoehe,
|
||||
v.nach[0] * a.breite, v.nach[1] * a.hoehe);
|
||||
for (const [pos, deckung] of v.stopps) {
|
||||
gr.addColorStop(pos, `rgba(0,0,0,${deckung})`);
|
||||
}
|
||||
g.fillStyle = gr;
|
||||
g.fillRect(0, 0, a.breite, a.hoehe);
|
||||
}
|
||||
g.globalCompositeOperation = "source-over";
|
||||
|
||||
return c.toDataURL("image/webp", 0.74);
|
||||
}, { daten, a });
|
||||
|
||||
const puffer = Buffer.from(webp.split(",")[1], "base64");
|
||||
writeFileSync(join(ZIEL, a.ziel), puffer);
|
||||
console.log(`${a.ziel.padEnd(20)} ${String(Math.round(roh.length / 1024)).padStart(4)} KB`
|
||||
+ ` -> ${String(Math.round(puffer.length / 1024)).padStart(3)} KB`);
|
||||
}
|
||||
|
||||
await browser.close();
|
||||
console.log("\nFertig. Die Dateien liegen in workspace/assets/img/.");
|
||||
@@ -15,7 +15,16 @@
|
||||
|
||||
--text: #dbe4ef; /* kein reines Weiss - schont die Augen */
|
||||
--text-leise: #94a5bb;
|
||||
--text-still: #6d7d92;
|
||||
/* Von #6d7d92 auf #75859a angehoben (01.09.2026).
|
||||
Aufgefallen erst, als die Buehne im Hintergrund dazukam und der
|
||||
Kontrast an echten BILDPUNKTEN gemessen wurde statt an der
|
||||
Farbangabe: Der leiseste Grauton lag bei 4,43:1 -- knapp unter den
|
||||
geforderten 4,5:1. Das war schon vorher so, nur hatte es nie jemand
|
||||
nachgerechnet. Jetzt 4,95:1 auf dem hellsten Untergrund, 5,35:1 auf
|
||||
reiner Tinte. Immer noch deutlich leiser als der Haupttext, aber
|
||||
lesbar -- und das gilt jetzt fuer JEDE Seite, nicht nur fuer die
|
||||
mit dem Hintergrundbild. */
|
||||
--text-still: #75859a;
|
||||
|
||||
--akzent: #3fbdf5; /* aus dem Neon des Motivs, entsättigt */
|
||||
--akzent-tief: #1f7fb0;
|
||||
|
||||
@@ -24,6 +24,85 @@ body.start {
|
||||
var(--tinte);
|
||||
}
|
||||
|
||||
/* ---------- Die Bühne ----------------------------------------------------
|
||||
|
||||
Casper unten links, HasiDog unten rechts. Beide FEST an der Scheibe,
|
||||
nicht am Inhalt: Sie scrollen nicht mit, sondern stehen da wie ein
|
||||
Bühnenbild, vor dem gearbeitet wird.
|
||||
|
||||
Drei Regeln, damit daraus kein Poster wird, auf dem man nichts lesen
|
||||
kann:
|
||||
|
||||
1. Sie sitzen in den unteren ECKEN und lassen die Mitte frei -- genau
|
||||
dort steht der Inhalt.
|
||||
2. Die weichen Ränder sind ins Bild eingerechnet (tools/buehne-bauen.mjs),
|
||||
nicht als Maske im Browser. Ein hartes Rechteck sähe nach
|
||||
aufgeklebtem Foto aus; und eine Maske über ein 900-Pixel-Bild
|
||||
kostete bei jedem Bildaufbau Rechenzeit.
|
||||
3. Darüber liegt ein dunkler Schleier. Er ist der Grund, warum der
|
||||
Text unverändert lesbar bleibt -- gemessen, nicht geschätzt.
|
||||
|
||||
Warum überhaupt zwei Bilder statt eines großen: Ein Vollbild hinter
|
||||
einem Arbeitswerkzeug ist immer im Weg. Zwei Ecken lassen den Blick
|
||||
in Ruhe und sind trotzdem sofort da. */
|
||||
|
||||
body.start::before,
|
||||
body.start::after {
|
||||
content: "";
|
||||
position: fixed; bottom: 0; z-index: 0;
|
||||
pointer-events: none;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
background-position: bottom;
|
||||
}
|
||||
|
||||
/* Casper. Links, blickt nach rechts in die Seite hinein. */
|
||||
body.start::before {
|
||||
left: -3vw;
|
||||
width: min(34vw, 480px); height: min(34vw, 480px);
|
||||
background-image: url("../img/buehne-husky.webp");
|
||||
background-position: left bottom;
|
||||
opacity: .46;
|
||||
}
|
||||
|
||||
/* HasiDog. Rechts, gespiegelt, blickt zurück. Etwas schwächer -- er ist
|
||||
heller als Casper und würde sonst mehr ziehen. */
|
||||
/* Weiter nach aussen und nach unten geschoben als Casper: HasiDog ist
|
||||
heller, sein Gesicht zieht den Blick staerker -- direkt neben einer
|
||||
Kachel wuerde man es ansehen statt der Kachel. So schaut er von unten
|
||||
rechts herein, ohne sich dazwischenzustellen. */
|
||||
body.start::after {
|
||||
right: -2vw;
|
||||
width: min(24vw, 330px); height: min(36vw, 480px);
|
||||
background-image: url("../img/buehne-hasi.webp");
|
||||
background-position: right bottom;
|
||||
opacity: .3;
|
||||
}
|
||||
|
||||
/* Der Schleier. Liegt über den beiden und unter dem Inhalt -- er nimmt
|
||||
ihnen genau so viel Kraft, dass Text darüber unverändert lesbar
|
||||
bleibt. Nach unten dichter, weil die Bilder dort stehen. */
|
||||
body.start > .schleier {
|
||||
position: fixed; inset: 0; z-index: 0; pointer-events: none;
|
||||
background:
|
||||
linear-gradient(180deg, transparent 0%, rgba(5, 7, 13, .55) 62%, rgba(5, 7, 13, .8) 100%),
|
||||
radial-gradient(75% 55% at 50% 62%, rgba(5, 7, 13, .82), transparent 78%);
|
||||
}
|
||||
|
||||
/* Alles Bedienbare liegt über der Bühne. Ohne das läge der Inhalt zwar
|
||||
sichtbar darüber, aber Klicks landeten teils am falschen Ort. */
|
||||
body.start > .kopfleiste,
|
||||
body.start > .inhalt,
|
||||
body.start > main { position: relative; z-index: 1; }
|
||||
|
||||
@media (max-width: 760px) {
|
||||
/* Auf dem Handy nimmt der Inhalt die ganze Breite ein -- dort wäre die
|
||||
Bühne nur ein Schatten hinter dem Text. Bleibt, aber deutlich
|
||||
zurückgenommen und kleiner. */
|
||||
body.start::before { left: -8vw; width: 60vw; height: 60vw; opacity: .28; }
|
||||
body.start::after { right: -6vw; width: 42vw; height: 60vw; opacity: .2; }
|
||||
}
|
||||
|
||||
/* ---------- Kopfleiste ------------------------------------------------ */
|
||||
|
||||
.kopfleiste {
|
||||
|
||||
|
After Width: | Height: | Size: 32 KiB |
|
After Width: | Height: | Size: 41 KiB |
@@ -7,13 +7,18 @@
|
||||
<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=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609010009" />
|
||||
</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">
|
||||
@@ -134,8 +139,8 @@
|
||||
</form>
|
||||
</dialog>
|
||||
|
||||
<script src="assets/js/wahl.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/aufgaben.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/aufgaben.js?v=202609010009" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -7,14 +7,19 @@
|
||||
<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=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/automation.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/automation.css?v=202609010009" />
|
||||
</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">
|
||||
@@ -127,8 +132,8 @@
|
||||
|
||||
</main>
|
||||
|
||||
<script src="assets/js/wahl.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/automation.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/automation.js?v=202609010009" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -7,14 +7,19 @@
|
||||
<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=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/bereich.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/bereich.css?v=202609010009" />
|
||||
</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">
|
||||
@@ -98,8 +103,8 @@
|
||||
|
||||
</main>
|
||||
|
||||
<script src="assets/js/wahl.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/bereich.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/bereich.js?v=202609010009" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -7,14 +7,19 @@
|
||||
<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=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/calls.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/calls.css?v=202609010009" />
|
||||
</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">
|
||||
@@ -49,9 +54,9 @@
|
||||
|
||||
</main>
|
||||
|
||||
<script src="assets/js/ki.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/calls.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/ki.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/calls.js?v=202609010009" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -7,14 +7,19 @@
|
||||
<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=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/content.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/content.css?v=202609010009" />
|
||||
</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">
|
||||
@@ -153,8 +158,8 @@
|
||||
|
||||
</main>
|
||||
|
||||
<script src="assets/js/wahl.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/content.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/content.js?v=202609010009" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -7,14 +7,19 @@
|
||||
<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=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/dateien.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/dateien.css?v=202609010009" />
|
||||
</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">
|
||||
@@ -88,8 +93,8 @@
|
||||
|
||||
</main>
|
||||
|
||||
<script src="assets/js/wahl.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/dateien.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/dateien.js?v=202609010009" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -25,7 +25,7 @@
|
||||
type="image/webp" media="(max-width: 899px)" />
|
||||
|
||||
<link rel="icon" href="assets/img/favicon.png" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202609010009" />
|
||||
</head>
|
||||
|
||||
<body class="gate">
|
||||
@@ -143,6 +143,6 @@
|
||||
</p>
|
||||
</main>
|
||||
|
||||
<script src="assets/js/gate.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/gate.js?v=202609010009" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -7,14 +7,19 @@
|
||||
<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=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/kalender.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/kalender.css?v=202609010009" />
|
||||
</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">
|
||||
@@ -94,8 +99,8 @@
|
||||
|
||||
</main>
|
||||
|
||||
<script src="assets/js/wahl.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/kalender.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/kalender.js?v=202609010009" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -7,14 +7,19 @@
|
||||
<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=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/personen.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/personen.css?v=202609010009" />
|
||||
</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">
|
||||
@@ -116,8 +121,8 @@
|
||||
|
||||
</main>
|
||||
|
||||
<script src="assets/js/wahl.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/personen.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/personen.js?v=202609010009" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -7,14 +7,19 @@
|
||||
<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=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/profil.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/profil.css?v=202609010009" />
|
||||
</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">
|
||||
@@ -127,8 +132,8 @@
|
||||
|
||||
</main>
|
||||
|
||||
<script src="assets/js/wahl.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/profil.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/profil.js?v=202609010009" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -7,14 +7,19 @@
|
||||
<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=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/report.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/report.css?v=202609010009" />
|
||||
</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">
|
||||
@@ -86,9 +91,9 @@
|
||||
|
||||
</main>
|
||||
|
||||
<script src="assets/js/ki.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/report.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/ki.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/report.js?v=202609010009" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -7,10 +7,10 @@
|
||||
<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=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/scouting.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/scouting.css?v=202609010009" />
|
||||
</head>
|
||||
|
||||
<body class="start">
|
||||
@@ -124,8 +124,8 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="assets/js/wahl.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/scouting.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/scouting.js?v=202609010009" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -7,12 +7,17 @@
|
||||
<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=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202609010009" />
|
||||
</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">
|
||||
<p class="marke">Dogfather Universe · Creator Workspace</p>
|
||||
<div class="kopfleiste__rechts">
|
||||
@@ -68,8 +73,8 @@
|
||||
</p>
|
||||
</main>
|
||||
|
||||
<script src="assets/js/wahl.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/start.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/start.js?v=202609010009" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -7,14 +7,19 @@
|
||||
<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=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/startcheck.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/startcheck.css?v=202609010009" />
|
||||
</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">
|
||||
@@ -65,9 +70,9 @@
|
||||
|
||||
</main>
|
||||
|
||||
<script src="assets/js/ki.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/startcheck.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/ki.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/startcheck.js?v=202609010009" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -7,13 +7,18 @@
|
||||
<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=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/uebersicht.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/uebersicht.css?v=202609010009" />
|
||||
</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">
|
||||
@@ -52,7 +57,7 @@
|
||||
|
||||
</main>
|
||||
|
||||
<script src="assets/js/kopf.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/uebersicht.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/uebersicht.js?v=202609010009" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -7,14 +7,19 @@
|
||||
<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=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/wissen.css?v=202608312340" />
|
||||
<link rel="stylesheet" href="assets/css/gate.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/start.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/aufgaben.css?v=202609010009" />
|
||||
<link rel="stylesheet" href="assets/css/wissen.css?v=202609010009" />
|
||||
</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">
|
||||
@@ -170,8 +175,8 @@
|
||||
|
||||
</main>
|
||||
|
||||
<script src="assets/js/wahl.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/wissen.js?v=202608312340" defer></script>
|
||||
<script src="assets/js/wahl.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/kopf.js?v=202609010009" defer></script>
|
||||
<script src="assets/js/wissen.js?v=202609010009" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||