Kopf, Fuß und verknüpfte Sektionen als Blockdokumente (Paket G, Teil 1)
Migration 20260912001000 legt die Tabelle partial an: Blockdokumente, die keine Seiten sind. Kopf- und Fußbereich je einmal, wiederverwendbare Sektionen beliebig viele - im selben Editor gestaltbar wie eine Seite, weil der Editor seine Schnittstelle aus einem Datenattribut nimmt statt sie fest zu kennen. Im Template steht keine Marke und keine Navigation mehr. Ein neuer Block menu zeigt einen Menüplatz; die Einträge bleiben in der Menüverwaltung. Eine Seite braucht genau eine Hauptüberschrift, ein geteilter Bereich keine - sonst hätte jede Seite, die ihn trägt, zwei. Geteilte Bereiche haben keinen Entwurf und keine Veröffentlichung: sie sind überall sichtbar, gespeichert heißt live. Verknüpft statt kopiert: partialref speichert nur die Adresse, die Blöcke bleiben im Bereich, und eine Änderung erreicht jede Seite, die sie einbindet. Zyklen abgewiesen, Verschachtelung auf drei Ebenen begrenzt, eine entfernte Sektion hinterlässt keine Lücke und der Verweis bleibt erhalten. Die Abschnittsvorlagen kopieren weiterhin. Ein echter Fehler kam dabei heraus, der jede dunkle Sektion mit Spalten betraf: .block-column>.block-text:first-child setzt eine Farbe für helle Hintergründe und gewinnt auf Spezifität gegen .tone-ink - gemessen 1,87:1. Geprüft: 165 PHP-Tests / 660 Assertions unter PHP 8.2.12 und 8.4.22, 15 JavaScript-Modelltests, Editortest mit axe ohne Verstöße, öffentliche Browserprüfung, Migration nach Backup angewendet. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
1 parent
33e4ac0c54
commit
d0938eec69
26 files changed
+955
-56
No files matched your search
@@ -7,7 +7,10 @@ const ICONS = ['app', 'web', 'design', 'network', 'hardware', 'shop', 'support',
|
||||
|
||||
const root = document.querySelector('#editor');
|
||||
const $ = selector => document.querySelector(selector);
|
||||
const api = `/admin/api/pages/${encodeURIComponent(root.dataset.pageId)}`;
|
||||
// Pages live under /admin/api/pages/{id}, shared areas under /admin/partials/{id}. Both offer the
|
||||
// same document, draft and preview endpoints, so this file does not care which one it drives.
|
||||
const api = root.dataset.api;
|
||||
const editingArea = 'page' !== root.dataset.kind;
|
||||
let history, selected = null, version, revisionId, publishedRevisionId, csrfToken;
|
||||
let busy = false, conflict = false, previewTimer, previewController, previewSequence = 0;
|
||||
let device = 'desktop', propertyPanel = 'content', designTokens, designSchema, designPanel, pendingPreset = null;
|
||||
@@ -213,6 +216,8 @@ function renderProperties() {
|
||||
field('Anschrift', 'address', block.props.address || '', { multiline: true, maxLength: 200 });
|
||||
}
|
||||
if (block.type === 'spacer') field('Höhe', 'size', block.props.size, { choices: { small: 'Klein', medium: 'Mittel', large: 'Groß', huge: 'Sehr groß' } });
|
||||
if (block.type === 'menu') field('Menüplatz', 'slot', block.props.slot, { choices: { header: 'Hauptnavigation', footer: 'Fußzeile' }, help: 'Die Einträge werden unter Menüs gepflegt.' });
|
||||
if (block.type === 'partialref') field('Adresse der Sektion', 'partial', block.props.partial, { help: 'Die Adresse aus der Bereichsverwaltung. Die Sektion wird verknüpft, nicht kopiert: eine Änderung dort wirkt auf allen Seiten, die sie einbinden.' });
|
||||
if (block.type === 'form') field('Adresse des Formulars', 'form', block.props.form, { help: 'Die Adresse aus der Formularverwaltung, zum Beispiel kontakt. Felder, Empfänger und Einwilligungstext werden dort gepflegt, nicht hier.' });
|
||||
if (block.type === 'tabitem') field('Titel', 'title', block.props.title, { maxLength: 160, help: 'Beschriftung des Tabs. In der Vorschau sind alle Tabs untereinander sichtbar, weil die Vorschau kein JavaScript ausführt.' });
|
||||
if (block.type === 'accordionitem') {
|
||||
@@ -502,7 +507,7 @@ async function loadDesignSchema() {
|
||||
async function load() {
|
||||
busy = true; controls();
|
||||
try {
|
||||
const data = await request('');
|
||||
const data = await request(editingArea ? '/document' : '');
|
||||
if (!designTokens) {
|
||||
const response = await fetch('/assets/design-tokens.json');
|
||||
if (!response.ok) throw new Error('Designwerkzeuge konnten nicht geladen werden. Bitte erneut versuchen.');
|
||||
|
||||
Reference in new issue
Block a user