Compare commits

...
9 Commits
Author SHA1 Message Date
kantarciandClaude Fable 5.1 0aa1ff6d3e Line up the consent notice footer in 1.14.2
CMS quality / php (8.2) (push) Canceled after 0s
CMS quality / php (8.4) (push) Canceled after 0s
CMS quality / browser (push) Canceled after 0s
CMS quality / mysql (push) Canceled after 0s
"Einzeln wählen" sits on the left and the legal links on the right, on one
baseline; opened, the disclosure takes the full width and the links move
below it, right-aligned. `.consent-bar p` outranked `.consent-links` and
took the right margin away, so the links selector now carries the element.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
2026-09-15 07:04:08 +02:00
kantarciandClaude Fable 5.1 65b11563a8 Document verified 1.14.1 release
CMS quality / php (8.2) (push) Canceled after 0s
CMS quality / php (8.4) (push) Canceled after 0s
CMS quality / browser (push) Canceled after 0s
CMS quality / mysql (push) Canceled after 0s
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
2026-09-15 06:59:12 +02:00
kantarciandClaude Fable 5.1 0bdcc7f90e Make the consent notice styleable and keep the back-to-top button reachable in 1.14.1
CMS quality / php (8.2) (push) Canceled after 0s
CMS quality / php (8.4) (push) Canceled after 0s
CMS quality / browser (push) Canceled after 0s
CMS quality / mysql (push) Canceled after 0s
The back-to-top button was hidden as long as the consent question was open,
on every device - and on a phone the question tends to stay open. Instead
of `display:none` it now anchors itself 12px above the bar wherever the bar
covers its corner: below 800px for the centred card, at every width for the
full-width bar and the corner card. Browsers without anchor positioning keep
hiding it there. The bar renders before the button so it can be an anchor,
and the reserved bottom padding grows to 320px below 620px, where the bar
with its default text is up to 299px tall.

The notice itself gets a face. Settings → Einwilligung now carries layout
(card, bar, corner), shape (soft, round, square - one setting for the box and
its buttons), a heading and four colours, each as #hex or @palette key.
`Theme::cssColor()` resolves both, replacing the copy inside the back-to-top
code; `Consent::styles()` writes the values as `--kant-consent-*` into the
hashed style block. The base layout changes with it: an accent stripe and
shield icon, equal-width buttons, a disclosure with a chevron, underlined
legal links, a two-column bar on wide screens. Declining stays an outlined
button of the same size next to accepting. The archive and the consent page
carry the same variables - the archive had no palette at all until now.

In the editor, rows with an own value are labelled in orange rather than
bold with a dot; the device chips sit 6px apart with the focus ring inside
the gap.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
2026-09-15 06:57:38 +02:00
kantarciandClaude Opus 5 860bed9199 Drop the draft notice and give the Moldovan legal pages proper margins
CMS quality / php (8.2) (push) Canceled after 0s
CMS quality / php (8.4) (push) Canceled after 0s
CMS quality / browser (push) Canceled after 0s
CMS quality / mysql (push) Canceled after 0s
The legal pages put their width limit on the section itself, which shrank the
section and its container along with it: the text sat 32 px from the window
edge while the header's brand stands at 100 px. The section now stays full
width and only the content column is limited, so title and text share the
header's edge on every device.

Both pages open with a pale band - label, title, lead - in the colour of the
offers section, followed by one row per point: heading on the left, text on
the right, separated by fine rules, stacked on a phone.

The footer no longer carries "Gestaltungsentwurf · Beispieltexte &
illustratives KI-Bild".

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2026-09-15 06:40:29 +02:00
kantarciandClaude Opus 5 1973bd10ef Document verified 1.14.0 release
CMS quality / php (8.2) (push) Canceled after 0s
CMS quality / php (8.4) (push) Canceled after 0s
CMS quality / browser (push) Canceled after 0s
CMS quality / mysql (push) Canceled after 0s
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2026-09-15 06:08:04 +02:00
kantarciandClaude Opus 5 a434e0cefc Serve every font from this server and surface open tasks in 1.14.0
CMS quality / php (8.2) (push) Canceled after 0s
CMS quality / php (8.4) (push) Canceled after 0s
CMS quality / browser (push) Canceled after 0s
CMS quality / mysql (push) Canceled after 0s
Fonts were still reachable from Google in two places. The editor and area
previews were handed `googleFonts` and no `localFonts`, so the screen used
most of the day fetched Lato from fonts.googleapis.com on every open; the
public page fell back to the same link whenever the files were missing.
Neither path remains: the template has no Google branch, `googleFontsUrl()`
is gone, and the policies name no foreign font host - `font-src 'self'`
publicly, `style-src 'self'; font-src 'self'` in administration. Without
local files a site now shows the theme's fallback and says so.

Preloading took the first two weights per family. The Kant-IT theme names
Lato 400, 700 and 900 and sets its headings on 800/900, so the one weight
that carried them loaded after the stylesheet and `font-display:swap`
swapped the heading in plain sight. Every weight of the theme is preloaded
now, latin subset, and the links sit before the stylesheet: measured cold,
all three files finish at 168 ms against a first paint at 292 ms.

Open tasks no longer hide on the screen that owns them. A strip above every
management screen names what needs a button and carries it: a new version
leads to System, missing fonts to Design. Neither asks the network - the
version comes from the daily update-check task, the fonts from a look in
the folder.

System and update was unusable on a phone: `.stack` is a grid whose
automatic column grows to its widest content, and one long database path
pushed the page sideways. It gets `minmax(0, 1fr)`, the backup table stacks
below 620px, and the prose is 45% shorter with the fine print folded away.

The device chips drew the current device with an outline, which lies outside
the box, ran under its neighbour and was clipped by the sidebar - it read as
a cut-off red frame. Used devices are filled in `#9d4e0d` now (5.6:1), the
current one carries a border inside the chip.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2026-09-15 00:16:16 +02:00
kantarciandClaude Opus 5 858b8c6de4 Give Tagespflege Moldovan legal pages and entrance effects
The template carried neither an imprint nor privacy notes, which a German site
with a contact form cannot go live without. Both pages are built from the same
blocks as the rest of the site; what only the Tagespflege itself can answer -
legal form, register, supervisory authority, hosting provider - stands as
"NOCH ZU PRÜFEN" in the text instead of being invented. The footer carries the
legal line, the contact form a consent field, and its note links the privacy
page.

Entrance effects come from a list of block IDs rather than being scattered
through the document: the hero plays on load, everything else as it scrolls
into view, staggered so a row appears one item after another. Without
JavaScript every block simply stands on the page.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2026-09-15 00:15:55 +02:00
kantarciandClaude Fable 5.1 5f7ea63b76 Put opening hours, service area and FAQ into the structured data
CMS quality / php (8.2) (push) Canceled after 0s
CMS quality / php (8.4) (push) Canceled after 0s
CMS quality / browser (push) Canceled after 0s
CMS quality / mysql (push) Canceled after 0s
Settings gain opening hours per weekday and a list of places served;
LocalBusiness emits openingHoursSpecification (equal times grouped) and
areaServed. An accordion can be marked as FAQ (schema v23 property
`faq`), which turns its entries into a FAQPage built from the visible
title and text blocks. Elektro Bernhard gets the real office hours
(Mo–Fr 07:30–17:00), the service area from Karlsruhe to Offenburg and
two more questions. ADR 094.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
2026-09-14 22:26:47 +02:00
kantarciandClaude Opus 5 3cb5b03dd9 Document verified 1.13.0 release
CMS quality / php (8.2) (push) Canceled after 0s
CMS quality / php (8.4) (push) Canceled after 0s
CMS quality / browser (push) Canceled after 0s
CMS quality / mysql (push) Canceled after 0s
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2026-09-14 22:19:14 +02:00
33 changed files with 1088 additions and 191 deletions

No files matched your search

+10
View File
@@ -48,6 +48,16 @@
"$env:APP_ENV='dev'; $env:DATABASE_URL='sqlite:///C:/Django Project/KantSites/var/tagespflege-moldovan.db'; $env:MEDIA_DIRECTORY='C:/Django Project/KantSites/var/tagespflege-moldovan-media'; $env:SITE_ORIGIN='http://127.0.0.1:8089'; & C:/php84/php.exe -d upload_max_filesize=8M -d post_max_size=10M -d memory_limit=256M -S 127.0.0.1:8089 -t public bin/dev-router.php"
],
"port": 8089
},
{
"name": "kantit",
"runtimeExecutable": "powershell",
"runtimeArgs": [
"-NoProfile",
"-Command",
"$env:APP_ENV='dev'; $env:DATABASE_URL='sqlite:///C:/Django Project/KantSites/var/kantit.db'; $env:MEDIA_DIRECTORY='C:/Django Project/KantSites/var/kantit-media'; $env:SITE_ORIGIN='http://127.0.0.1:8130'; & C:/php84/php.exe -d upload_max_filesize=8M -d post_max_size=10M -d memory_limit=256M -S 127.0.0.1:8130 -t public bin/dev-router.php"
],
"port": 8130
}
]
}
+28
View File
@@ -4,6 +4,34 @@ Lokaler CMS-Prototyp für PHP-Webhosting mit erstem visuellen Editor. Symfony 7.
Die übernommenen Originaldokumente sind `AGENTS.md` und `ENTWICKLUNGSPLAN.md`. Den tatsächlichen Stand enthält `docs/STATUS.md`, Entscheidungen und Datenmodell stehen in `docs/ARCHITECTURE.md`.
## Fußzeile des Einwilligungshinweises (ab 1.14.2)
„Einzeln wählen“ steht links, Datenschutz und Impressum rechts auf einer Linie; aufgeklappt nimmt die Einzelwahl die volle Breite, die Links rutschen rechtsbündig darunter.
## Einwilligungshinweis gestalten, Nach-oben-Knopf auch bei offener Frage (ab 1.14.1)
**Der Einwilligungshinweis lässt sich gestalten**, unter **Einstellungen → Einwilligung → Aussehen des Hinweises**: Anordnung (Karte unten in der Mitte, Leiste über die volle Breite, kleine Karte rechts unten), Form (abgerundet, rund, eckig – gilt für Fläche und Knöpfe zusammen), eigene Überschrift und vier Farben (Fläche, Schrift, Knopf „Alle akzeptieren“, Schrift auf dem Knopf), jeweils als `#hex` oder `@schlüssel` aus der Palette. Leer heißt Papier, Tinte und Akzent aus dem Design. Die Fläche trägt einen schmalen Streifen und ein Symbol in der Knopffarbe; „Nur notwendige“ bleibt ein gleich großer Rahmenknopf daneben. Dieselben Farben gelten auf `/einwilligung` und in den Beitragsarchiven.
**Der Nach-oben-Knopf** war ausgeblendet, solange die Einwilligungsfrage offen stand – auf dem Telefon bleibt sie das oft, und der Knopf kam dort nie. Jetzt setzt er sich auf die Oberkante der Leiste, wo sie die Ecke abdeckt; Browser ohne Ankerpositionierung blenden ihn dort weiter aus. Der reservierte Abstand unten reicht auf schmalen Bildschirmen wieder für die ganze Leiste.
**Im Designbereich** sind belegte Eigenschaften jetzt in Orange beschriftet, nicht nur mit Punkt und Fettdruck; die Gerätechips D/T/M stehen weiter auseinander, und der Fokusring bleibt in der Lücke.
## Schriften vom eigenen Server, Hinweise auf jedem Bildschirm (ab 1.14.0)
**Schriften kommen ausschließlich von deinem Server.** Die Ausgabe verlinkt kein Stylesheet mehr von `fonts.googleapis.com` – weder die öffentliche Seite noch die Editorvorschau, die es bisher bei jedem Aufruf tat. Fehlen die Dateien, zeigt die Website die eingestellte Ersatzschrift und sagt es dir. Geholt werden sie wie bisher einmalig unter **Design → Schriften ausliefern**. Zusätzlich wird jetzt **jeder** Schnitt des Designs vorab geladen: bisher waren es die ersten zwei je Familie, weshalb die Überschriften sichtbar von der Ersatzschrift auf die richtige Schrift sprangen.
**Offene Hinweise stehen auf jedem Verwaltungsbildschirm**, mit dem Knopf daneben: „Fassung X ist verfügbar“ → *Jetzt aktualisieren*, „Schriftdateien fehlen“ → *Schriften holen*. Keiner der beiden fragt beim Öffnen im Netz nach.
**System und Update** ist auf dem Telefon benutzbar: Die Seite lief seitlich aus dem Bild, die Sicherungstabelle wird zu gestapelten Blöcken, und die Texte sind knapper – das Kleingedruckte steht zugeklappt.
**Im Designbereich** zeigen die Gerätechips **D/T/M** jetzt in Orange, welches Gerät einen eigenen Wert trägt; das gerade bearbeitete Gerät hat einen Rahmen statt des bisherigen roten Rings, der am Rand der Spalte abgeschnitten wurde.
## Öffnungszeiten, Einsatzgebiet und FAQ in den strukturierten Daten (ab 1.14.0)
Unter **Einstellungen → Unternehmensdaten** gibt es **Öffnungszeiten** (je Wochentag Öffnen und Schließen; leer heißt geschlossen) und das **Einsatzgebiet** (ein Ort je Zeile). Beides erscheint in den strukturierten Daten der Startseite (`openingHoursSpecification`, `areaServed`); gleiche Zeiten werden zu einer Angabe zusammengefasst. Der sichtbare Text auf der Website bleibt unabhängig davon.
Ein Akkordeon wird per Kästchen **Als FAQ auszeichnen** zur `FAQPage`: die Titel sind die Fragen, die Textbausteine im Eintrag die Antwort. Einträge ohne Text erscheinen nicht. Das gilt nur für Akkordeons mit gesetztem Kästchen – ein Akkordeon mit Leistungen bleibt ein Akkordeon.
## Mehr Symbole, Menü-Knopf gestalten, Nach-oben-Knopf zuverlässig (ab 1.13.0)
Der Symbolsatz hat drei Zeichnungen mehr: **Menschen**, **Musik** und **Haus**. Sie stehen überall zur Wahl, wo es Symbole gibt – Symbolbaustein, Symbolkarte und Menüeinträge. Eine am Symbolbaustein eingestellte **Farbe** wirkt jetzt auch wirklich auf die Zeichnung; bisher blieb sie in der Akzentfarbe der Website stecken.
+1 -1
View File
@@ -1 +1 @@
1.13.0
1.14.2
+29 -2
View File
@@ -1,7 +1,34 @@
# Architekturentscheidungen
Stand: 14.09.2026. Arbeitstitel KantSites; Produktname offen.
Stand: 15.09.2026. Arbeitstitel KantSites; Produktname offen.
## ADR 097 – Der Einwilligungshinweis bekommt ein Gesicht, und der Nach-oben-Knopf weicht ihm aus (15.09.2026)
**Anlass.** Umut gefiel das Banner nicht: nicht gestaltbar, ein kantiger Kasten in Papierfarbe. Und der Nach-oben-Knopf „funktionierte auf dem Handy nicht“ – er war ausgeblendet, solange die Frage offen stand, und auf dem Telefon bleibt sie das oft.
**Gestaltung aus den Einstellungen, nicht aus dem Editor.** Der Hinweis ist kein Baustein einer Seite, sondern eine Frage der Website; seine Gestaltung gehört deshalb neben seinen Text unter Einstellungen → Einwilligung: Anordnung (`karte`, `leiste`, `ecke`), Form (`weich`, `rund`, `eckig`), Überschrift, vier Farben (Fläche, Schrift, Knopf, Schrift auf dem Knopf). Die Farben nehmen `#hex` oder `@schlüssel` aus der Palette wie der Nach-oben-Knopf; `Theme::cssColor()` löst beides für beide auf. Ausgegeben wird das als `:root{--kant-consent-…}` im gehashten Stylesblock (`Consent::styles()`), die Anordnung als Klasse. Die Form setzt zwei Radien zugleich – Fläche und Knöpfe gehören zusammen; zwei Regler dafür wären zwei, die man gegeneinander verstellt. Leer heißt weiterhin Papier, Tinte und Akzent des Themes.
**Was gleich bleibt, mit Absicht.** „Nur notwendige“ bleibt ein Rahmenknopf in der Schriftfarbe, genauso groß wie „Alle akzeptieren“, in derselben Zeile – die Farbe des Knopfes ist einstellbar, die Gleichwertigkeit der Antworten nicht. Kein Skript, keine Cookie-Wand.
**Archiv und Einwilligungsseite.** Beide trugen bisher keine Palette im Kopf. Sie bekommen jetzt Theme- und Hinweisvariablen als gehashten Stylesblock; die Einwilligungsseite erweitert ihre Richtlinie um genau diesen einen Hash.
**Der Nach-oben-Knopf.** Statt `display:none` bei offener Frage setzt er sich per Ankerpositionierung auf die Oberkante der Leiste (`anchor-name`, `bottom:calc(anchor(top) + 12px)`), wo sie die Ecke abdeckt: bis 799 px bei der Karte, auf jeder Breite bei Leiste und Ecke (`:has()`). Browser ohne Ankerpositionierung blenden ihn dort weiter aus. Damit die Leiste als Anker taugt, steht sie in `page.html.twig` vor dem Knopf. Der reservierte Abstand unten wächst auf 320 px bis 620 px, weil die Leiste dort mit Standardtext bis 290 px hoch ist.
## ADR 096 – Schriften ausschließlich vom eigenen Server (15.09.2026)
**Entscheidung.** Die Ausgabe verlinkt kein Stylesheet von `fonts.googleapis.com` mehr, in keinem Pfad. Liegen die Schriftdateien lokal, liefert die Website sie selbst; liegen sie nicht vor, zeigt sie die eingestellte Ersatzschrift. `Theme::googleFontsUrl()` entfällt, und die Richtlinien nennen keinen fremden Schrifthost mehr – öffentlich `font-src 'self'`, in der Verwaltung zusätzlich `style-src 'self'`. Das Herunterladen der Dateien bleibt, wo es hingehört: ein Knopf im Designbereich beziehungsweise `cms:fonts:fetch`, einmalig und von einem Menschen ausgelöst.
**Warum.** ADR 037ff. hatten den Verweis auf Google als ausdrückliche Entscheidung Umuts stehen lassen, mit dem Selbsthosten als offenem Weg. Seit die Dateien lokal liegen können, ist der Rückfallpfad nur noch eine Falle: er greift genau dann, wenn niemand hinsieht, und gibt dann die IP-Adresse jedes Besuchers an einen Dritten weiter (LG München I, 3 O 17493/20). Vor allem betraf er die Editorvorschau, die `googleFonts` und **kein** `localFonts` bekam und die Schriften deshalb bei jedem Aufruf von Google holte – auf dem Bildschirm, an dem am meisten gearbeitet wird.
**Folge.** Eine Installation, deren Schriften fehlen, sieht anders aus als vorher: Ersatzschrift statt Wunschschrift. Das ist beabsichtigt und sichtbar gemacht – der Designbereich nennt die fehlenden Schnitte, und seit derselben Fassung sagt es ein Hinweisstreifen auf jedem Verwaltungsbildschirm mit dem Knopf daneben. Ein stilles „lädt halt von Google“ wäre die schlechtere Überraschung.
**Und das Vorabholen.** Es holte je Familie die ersten zwei Schnitte. Das Kant-IT-Theme nennt Lato 400, 700 und 900, die Überschriften stehen auf 800/900 und landen damit auf dem einzigen Schnitt ohne Vorabholen: er lud erst nach dem Stylesheet, und `font-display:swap` tauschte die Überschrift sichtbar. Jetzt wird jeder Schnitt des Themes vorab geholt, im lateinischen Grundbereich, und die Verweise stehen vor dem Stylesheet. Gemessen: alle Dateien sind vor dem ersten Zeichnen da.
## ADR 095 – Öffnungszeiten, Einsatzgebiet und FAQ in den strukturierten Daten (14.09.2026)
`LocalBusiness` nannte Name, Adresse, Telefon, E-Mail und Profile – nicht, wann jemand erreichbar ist und wo er arbeitet. Beides sind Angaben der Website, nicht einer Seite, deshalb stehen sie in den Einstellungen: `openingHours` als Liste `{day, opens, closes}` je Wochentag (Formular: sieben Zeilen mit Uhrzeitfeldern, leer heißt geschlossen; geprüft als `HH:MM`, Schließen nach Öffnen) und `areaServed` als Liste von Ortsnamen (ein Ort je Zeile, höchstens vierzig). `organisation()` fasst Tage mit gleichen Zeiten zu einer `OpeningHoursSpecification` zusammen – Mo–Fr 07:30–17:00 ist eine Angabe, nicht fünf – und gibt `areaServed` als Namensliste aus. Der Text auf der Website bleibt davon unabhängig; niemand soll zwei Wahrheiten pflegen müssen, aber das CMS erzwingt keine.
Eine FAQ ist dagegen Inhalt einer Seite. Ein Akkordeon ist nicht automatisch eine – die Kennzeichnung `props.faq` (Schema v23, Kästchen „Als FAQ auszeichnen“) macht aus den Einträgen Frage-Antwort-Paare einer `FAQPage`: Titel als Frage, die Textbausteine des Eintrags ohne Auszeichnungen als Antwort; Einträge ohne Text fehlen. Nur was sichtbar auf der Seite steht, steht auch in den Daten – Google verlangt genau das, und eine erfundene Antwort im Markup wäre der schnellste Weg zu einer Abstrafung. Kein Datenbankwechsel; beide Einstellungen fallen auf leere Listen zurück, das Akkordeon ohne Kennzeichnung bleibt ein Akkordeon.
## ADR 094 – Drei Symbole mehr, ein Menü-Knopf mit eigener Gestalt, ein Nach-oben-Knopf ohne Scroll-Animation (14.09.2026)
**Symbole.** Der Satz hatte vierzehn Zeichnungen und keine für Menschen, Musik und Haus – drei Bilder, die eine Pflege- oder Vereinsseite als erstes braucht. Sie kommen als `people`, `music` und `home` hinzu, gezeichnet im selben Strich, weiter als reine Pfadangabe in `blocks/icon.html.twig`. Kein Schemawechsel: `ICONS` ist eine Werteliste, kein Bausteintyp; ein Dokument mit einem neuen Namen ist für ältere Fassungen ungültig, was für Werte dieser Art im Projekt bereits gilt. Ein Test hält Liste und Zeichnungen zusammen, denn ein fehlender Pfad ergibt ein leeres `<path d="">`: unsichtbar, ohne Fehlermeldung.
@@ -435,7 +462,7 @@ Das Stylesheet steht aus Geschwindigkeitsgründen inline und ist **über seinen
`Theme` ist die Grundlage darüber: eine frei definierbare Farbpalette, Schriften und die Grundtypografie. Farben werden als `@schlüssel` referenziert und zu CSS-Variablen; eine Farbe zu ändern wirkt überall, wo sie benutzt wird. Die Überschriftengrößen entstehen aus einer modularen Skala, sodass eine Zahl die ganze Hierarchie verschiebt.
**Google Fonts auf ausdrückliche Entscheidung von Umut.** Das bedeutet eine Anfrage an Google bei jedem Seitenaufruf, mit den bekannten Folgen für Datenschutz und Ladezeit – der Entwicklungsplan verlangt eigentlich lokale Schriften. Umgesetzt ist es so, dass nur die tatsächlich benötigten Schnitte geladen werden und die Richtlinie ihre Hosts nur dann öffnet, wenn wirklich eine Google-Schrift eingestellt ist. Der Weg zum Selbsthosten bleibt offen: es wäre ein zusätzlicher Quelltyp neben `system` und `google`.
**Schriften von Google, aber nicht zur Laufzeit.** Eine Familie lässt sich weiterhin bei Google aussuchen; ausgeliefert wird sie aber ausschließlich vom eigenen Server. Die Dateien holt ein Knopf im Designbereich einmalig her, und die Ausgabe verlinkt nie ein fremdes Stylesheet – Näheres in ADR 096.
Die alten Tokenwerte aus v2 bis v9 bleiben gültig und werden weiterhin gerendert. Blöcke, die noch welche tragen, zeigen sie im Editor in einem eingeklappten Bereich „Klassische Werte dieser Seite“, damit ältere Seiten bearbeitbar bleiben, ohne das neue Panel zu überladen.
+1 -1
View File
@@ -255,7 +255,7 @@ Die Messung prüft die gemeinsame öffentliche Ausgabe nach Entfernung der feste
- **154 PHP-Tests / 563 Assertions** unter PHP 8.2.12 und PHP 8.4.22 erfolgreich, dazu **15 JavaScript-Modelltests**.
- Ein v10-Dokument mit Palettenfarbe, eigenem Farbwert, Abständen je Seite, Ecken je Ecke, Schatten, Buchstabenabstand, Hover-Zustand und eigenem Mobilwert wird Byte für Byte gespeichert und zu blockgenauem CSS: Regel für den Block, eigene Regel für `:hover,:focus-within` und eine Media Query für die schmale Breite.
- **Vierzehn abgewiesene Eingaben schreiben nichts.** Darunter gezielt die Ausbruchsversuche: eine Farbe als Funktion (`rgb(1,2,3)`), eine Länge als Ausdruck (`calc(1px + 2px)`), eine angehängte Deklaration (`18px;position:fixed`), ein Schriftschlüssel mit Anführungszeichen und ein Hintergrundbild als Dateipfad. Jeder dieser Werte scheitert am verankerten Muster seines Typs, bevor er gespeichert wird.
- **Die Sicherheitsrichtlinie wurde eigens geprüft:** das erzeugte Stylesheet ist über seinen eigenen SHA-256-Hash erlaubt, `unsafe-inline` kommt im Kopf nicht vor, und Skripte bleiben auf Seiten ohne Tabs abgeschaltet. Ohne eingestellte Google-Schrift wird kein fremder Host erlaubt und keiner kontaktiert.
- **Die Sicherheitsrichtlinie wurde eigens geprüft:** das erzeugte Stylesheet ist über seinen eigenen SHA-256-Hash erlaubt, `unsafe-inline` kommt im Kopf nicht vor, und Skripte bleiben auf Seiten ohne Tabs abgeschaltet. Ein fremder Schrifthost wird nie erlaubt und nie kontaktiert: Schriften liefert seit 1.14.0 ausschliesslich der eigene Server (ADR 096).
- **Acht ungültige Themes** werden abgewiesen, ohne das gespeicherte Theme zu verändern; danach liefert das Theme weiterhin die Voreinstellungen.
- Im Editormodell geprüft: Vererbung, einzelnes Zurücksetzen, Entfernen leerer Reste, Kopieren ohne geteilte Objekte und vollständiges Undo.
- **Im Browser geprüft wurde nur der Aufbau, nicht die Bedienung.** Im laufenden Editor wurde über das DOM bestätigt, dass das Designpanel aus dem Serverschema entsteht: sieben Gruppen, 58 Felder, 11 Farbwähler, 12 Schieberegler, 34 Einheitenauswahlen. **Es wurde kein Gestaltungsvorgang von Hand ausgeführt**, keine Tastaturbedienung erprobt und keine axe- oder Lighthouse-Messung gemacht. Für ein Werkzeug dieser Größe ist das ein erheblicher Vorbehalt.
+122
View File
@@ -1,5 +1,125 @@
# Projektstatus
## 1.14.2 – Einwilligungshinweis: Fußzeile aufgeräumt (15.09.2026)
**Anlass:** Umut fand „Einzeln wählen“ und die Rechtslinks unordentlich und schlug links/rechts vor.
**Umgesetzt (`consent-banner.html.twig`, `site.css`):** Beide stehen in einer Zeile `.consent-foot` – Einzelwahl links, Datenschutz · Impressum rechts, auf gemeinsamer Grundlinie. Aufgeklappt nimmt die Einzelwahl die volle Breite (`[open]{flex-basis:100%}`), die Links rutschen rechtsbündig darunter. Die Links stehen ohne Punkt dazwischen mit 14 px Abstand; ohne beide Adressen entfällt die Zeile. Ein Stolperstein: `.consent-bar p` schlug `.consent-links` und nahm den rechten Rand weg – der Selektor heißt jetzt `.consent-bar p.consent-links`.
**Geprüft:** vier Gestaltungsvarianten auf 1440 und 390 px, zu- und aufgeklappt (Screenshots `reports/consent-look/*-offen.png`), sechs Einwilligungstests grün. Veröffentlicht als 1.14.2, siehe Eintrag oben.
## 1.14.1 veröffentlicht (15.09.2026)
Tag `v1.14.1` (Commit `0bdcc7f`), Release: https://git.kant-it.de/kantarci/KantSites/releases/tag/v1.14.1. Enthält den gestaltbaren Einwilligungshinweis, den bei offener Frage erreichbaren Nach-oben-Knopf, den korrigierten Abstand unten und die orangen Beschriftungen im Editor; dazu `860bed9` (Seed-Skript Tagespflege Moldovan, nicht im Archiv).
**Anhänge:** `kantsites-1.14.1.zip` (4,7 MB, 3552 Dateien, SHA-256 `c0620a3155db894373199dbe2e286744dd7b21eed2c355e8d2a890652d1d203e`), `.sha256`, `install.php` mit eingetragener Prüfsumme; hochgeladen mit `var/publish-release-1.14.1.py`, erst Entwurf, dann veröffentlicht.
**Geprüft:** PHP 505 Tests grün; `browser-check.mjs`, `editor-check.mjs` bestanden; HTTP-Archiv-Update 1.14.0 → 1.14.1 `ok` (Update 302, System 200, Abschluss 302, öffentliche Seite 200). Nach der Veröffentlichung ohne Anmeldung: alle drei Anhänge bytegleich, `/releases/latest` nennt `v1.14.1`, Installeradresse antwortet 200.
**Nächster Schritt:** Update auf `web.kant-it.de` über System → Update aus dem Archiv, Migrationen abschließen (keine neuen), dann unter Einstellungen → Einwilligung das Aussehen wählen; `var/kantit.db` mit dem korrigierten Kopfmenü hochladen.
## 1.14.1 – Einwilligungshinweis gestaltbar, Nach-oben-Knopf bei offener Frage, orange Beschriftungen (15.09.2026)
**Anlass:** Umut wollte das Banner gestaltbar (rund, Farben) und schöner, den Abstand unten korrigiert, belegte Eigenschaften im Editor orange statt nur fett mit Punkt, und Gerätechips, die sich „aktiv überlagern“.
**Einwilligungshinweis (ADR 097).** Sieben neue Einstellungen: `consentLayout` (karte/leiste/ecke), `consentShape` (weich/rund/eckig), `consentTitle`, `consentColor`, `consentInk`, `consentAccent`, `consentAccentInk`; Farben mit `StyleSchema::COLOR` geprüft, Palette über `Theme::cssColor()` (neu, ersetzt die Kopie im Nach-oben-Knopf). `Consent::styles()` schreibt `:root{--kant-consent-…}` in den gehashten Stylesblock; die Anordnung ist eine Klasse. Neues Grundlayout: Streifen und Symbol in der Knopffarbe, gleich breite Knöpfe, aufklappbares „Einzeln wählen“ mit Pfeil, unterstrichene Rechtslinks; Leiste auf breiten Bildschirmen zweispaltig. Archiv und `/einwilligung` bekommen Theme- und Hinweisvariablen als gehashten Stylesblock – das Archiv trug bisher gar keine Palette.
**Abstand unten:** 320 px bis 620 px (Leiste bis 299 px hoch), 270 px bis 899 px, 200 px darüber; die Fläche scrollt ab `100dvh − 24px` in sich. Nach-oben-Knopf hebt sich bei Leiste und Ecke auf jeder Breite (`:has()`), bei der Karte bis 799 px.
**Editor:** belegte Beschriftungen in `--used` (#9d4e0d, 5,6:1); Chips mit 6 px Lücke, Fokusring ohne Versatz, Gruppe `flex:none`. Ein Überlagern der Chips ließ sich in 1.14.0 nicht reproduzieren – am Handy (390 px) liegen die drei Chips bei 22 px Breite mit 6 px Abstand, kein `outline` gezeichnet; die Rückmeldung bezog sich wohl auf den `outline`-Ring von 1.13.0.
**Geprüft:** PHP 505 Tests grün, darunter neu `testTheConsentQuestionTakesLayoutShapeAndColoursFromTheSettings` (Standard, eigene Werte, unbekannter Palettenschlüssel fällt weg, Einwilligungsseite mit Hash, ungültige Farbe abgewiesen). Chromium: vier Varianten (Karte, Leiste, Ecke rund dunkel, Karte eckig dunkel) auf 1440 und 390 px – Klasse, Radien, Farben und Überschrift stimmen, Nach-oben-Knopf sichtbar, treffbar, ohne Überlappung; `/einwilligung` 200 mit gehashtem `style-src`. Nach-oben-Prüfung auf acht Breiten bestanden. `browser-check.mjs`, `editor-check.mjs` (Einstellungen, Einwilligung) und axe über die Editorseitenleiste bestanden. Screenshots: `reports/consent-look/`, `reports/admin-hints/`.
**Nicht geprüft:** echtes iOS-Safari; der `@supports not`-Zweig; Lighthouse.
## Nach-oben-Knopf bei offener Einwilligungsfrage (15.09.2026)
**Anlass:** Umut meldete, der Nach-oben-Knopf funktioniere auf dem Handy nicht.
**Befund.** Der Knopf selbst funktioniert auf dem Telefon: In iPhone- und Pixel-Emulation (Chromium), lokal wie auf `web.kant-it.de` (dort bereits 1.14.0 mit `scrolled.js`), erscheint er nach 500 px, ist treffbar, und Tippen springt nach oben – **sobald die Einwilligungsfrage beantwortet ist**. Vorher galt `body.consent-open .scroll-top{display:none}` auf allen Geräten. Live trägt jeder Erstbesuch `consent-open`, und auf dem Telefon bleibt die Leiste unten oft einfach stehen – der Knopf kam dort nie. Kein Fehler im Skript und nicht der alte Safari-Fehler aus 1.13.0.
**Korrektur (`site.css`, `page.html.twig`).** Der Knopf bleibt bei offener Frage sichtbar. Gemessen deckt die Leiste die rechte Ecke nur bis knapp 800 px ab (bis 620 px volle Breite, 262–285 px hoch; darüber zentriert mit höchstens 620 px). In dieser Stufe setzt sich der Knopf per Ankerpositionierung 12 px auf die Oberkante der Leiste (`anchor-name:--kant-consent`, `bottom:calc(anchor(top) + 12px)`), unabhängig davon, wie hoch ihr Text umbricht. Browser ohne Ankerpositionierung blenden ihn dort weiter aus (`@supports not`). Ab 800 px bleibt er an seinem Platz. Weil ein Anker im Dokument vor dem positionierten Element stehen muss, gibt die Vorlage die Leiste jetzt vor dem Knopf aus.
**Geprüft:** Chromium, isolierte Kopie der Pilotdatenbank, Einwilligung offen auf 360, 390, 700, 768, 799, 800 und 1440 px sowie beantwortet auf 390 px – in allen acht Fällen sichtbar, keine Überlappung mit der Leiste, treffbar, nach dem Tippen `scrollY` 0. Twig-Lint gültig. PHP-Tests 504 grün, `browser-check.mjs` und `editor-check.mjs` (einschließlich Einwilligungsabläufe) bestanden.
**Nicht geprüft:** echtes iOS-Safari – WebKit ist für Playwright auf diesem Rechner nicht installiert. Der `@supports not`-Zweig wurde nicht ausgeführt, weil Chromium Ankerpositionierung kann.
**Nebenbefund, nicht geändert:** Bis 620 px reserviert `body.consent-open` 260 px Abstand unten, die Leiste ist mit Standardtext bis 285 px hoch – auf kleinen Telefonen liegen die letzten rund 25 px der Seite unter der offenen Leiste.
**Nächster Schritt:** nicht committet und nicht veröffentlicht; live erst mit einem Release (z. B. 1.14.1).
## 1.14.0 veröffentlicht (15.09.2026)
Tag `v1.14.0` (Commit `a434e0c`), Release: https://git.kant-it.de/kantarci/KantSites/releases/tag/v1.14.0. Enthält die Schriften vom eigenen Server, den Hinweisstreifen, System und Update auf dem Telefon, die Gerätechips sowie Öffnungszeiten, Einsatzgebiet und FAQ in den strukturierten Daten.
**Anhänge:** `kantsites-1.14.0.zip` (4,7 MB, SHA-256 `8360566b1eaed670b29f506262953d3b17f95893e23c7f4a940ff6d5e3f62735`), `.sha256`, `install.php` mit eingetragener Prüfsumme. Hochgeladen mit `var/publish-release-1.14.0.py` über den Git-Zugang dieses Rechners, erst als Entwurf, dann veröffentlicht.
**Geprüft:** 504 PHP-Tests grün; `browser-check.mjs` und `editor-check.mjs` bestanden; HTTP-Archiv-Update 1.12.1 → 1.14.0 `ok`. Nach der Veröffentlichung ohne Anmeldung: alle drei Anhänge bytegleich mit den lokalen Dateien, `/releases/latest` nennt `v1.14.0`, die Installeradresse `…/releases/download/v1.14.0/kantsites-1.14.0.zip` antwortet mit 200.
**Nächster Schritt:** Update auf `web.kant-it.de` über System → Update aus dem Archiv, danach Migrationen abschließen und `var/kantit.db` mit dem korrigierten Kopfmenü hochladen.
## Globale Hinweise, der Schriftenknopf und die Gerätechips (15.09.2026)
**Anlass:** Umut fehlte ein Hinweis, der auch außerhalb der Systemseite sagt, dass etwas zu tun ist; der Knopf „Schriften holen“ sah nicht aus wie die übrigen; und im Designbereich störte ein roter Rahmen an den Gerätechips, der abgeschnitten wirkte.
**Hinweisstreifen auf jedem Verwaltungsbildschirm (`kant_admin_notices()`, `admin/shell.html.twig`).** Über dem Inhalt steht jetzt, was einen Knopf braucht, und der Knopf gleich daneben: „Fassung X ist verfügbar“ → *Jetzt aktualisieren* (System), „Schriftdateien fehlen: …“ → *Schriften holen* (Design). Keine Zeile davon geht ins Netz – die verfügbare Fassung steht im Protokoll der täglichen Aufgabe `update-check`, die fehlenden Schriften sind ein Blick in den Ordner. Der Updatehinweis erscheint nur für `ROLE_ADMIN`, weil nur die auf die Systemseite dürfen. Warm statt rot: es ist eine Aufgabe, kein Fehler. Auf 390 px bricht der Streifen um, der Knopf rutscht unter den Text.
**Schriftenknopf.** Er trug gar keine Klasse und war deshalb der einzige Knopf der Verwaltung im Standardaussehen des Browsers. Jetzt `primary` (bzw. `secondary` beim erneuten Holen), und der ganze Abschnitt steht wie alles andere in einer Karte mit Kopf und Körper.
**Gerätechips D/T/M (`editor.css`).** Der rote Kasten war `outline:2px` mit `outline-offset:1px` auf dem gerade bearbeiteten Gerät. Ein `outline` liegt außerhalb des Kästchens: bei 2 px Abstand lief er unter den Nachbarchip und wurde von der seitlich beschnittenen Sidebar gekappt – daher der abgeschnittene Eindruck. Jetzt zwei Zustände mit zwei Mitteln:
- **belegt** (dieses Gerät trägt einen eigenen Wert): gefülltes Orange `--used: #9d4e0d`, weiße Schrift – 5,6:1 Kontrast. Dieselbe Farbe trägt der Punkt vor der Beschriftung, damit „hier steht ein eigener Wert“ überall gleich aussieht.
- **gerade bearbeitet**: 2 px Rahmen **innen** (`border-width`, kein `outline`), auf belegten Chips zusätzlich ein weißer Innenring. Nichts ragt mehr aus dem Kästchen, nichts wird beschnitten.
Chips von 19 auf 22 px, Abstand von 2 auf 4 px – auf einen Blick lesbar, welche Geräte an einer Eigenschaft hängen.
**Geprüft** (isolierte Kopie der Pilotdatenbank, künstlich auf „Lato 300 fehlt“ und „Fassung 9.9.9 verfügbar“ gesetzt): beide Streifen erscheinen auf `/admin`, tragen die richtigen Ziele, und auf 390 px bleibt die Dokumentbreite bei 390. Schriftenknopf trägt `primary`. Chips: belegte auf `rgb(157,78,13)`, bearbeitete mit 2 px Rahmen, kein gezeichnetes `outline` mehr. axe über die Editorseitenleiste ohne Verstöße. PHP-Tests: 498, ein bekannter Fehler (`testAnyPublishedPageCanBecomeTheRootAndEverythingFollows`). Screenshots: `reports/admin-hints/`.
**Zu beachten:** `admin.css` und `editor.css` hängen an `?v={{ kant_version() }}`. Bis die `VERSION` steigt, liefert der Browser die alten Fassungen aus dem Zwischenspeicher.
## Schriften nur noch vom eigenen Server, kein sichtbarer Schriftwechsel mehr (14.09.2026)
**Anlass:** Umut sah im Browser, wie die Schrift kurz von fett auf dünn sprang, und stellte zwei Regeln auf: keine Schriften über Adressen von Google, und kein Nachladen nach dem fertigen Seitenaufbau.
**Zwei getrennte Ursachen, beide belegt.**
1. **Der späte Schnitt.** `FontLibrary::preload()` holte je Familie nur die **ersten zwei** Schnitte vorab. Das Kant-IT-Theme nennt Lato 400, 700 und 900; die Überschriften stehen auf 800/900 und landen damit auf Lato 900 – dem einzigen Schnitt ohne Vorabholen. Gemessen am Nachbau: `lato-400` und `lato-700` starteten bei 151 ms, `lato-900` erst bei 156 ms, also nach dem Stylesheet. Mit `font-display:swap` zeichnet der Browser die Überschrift bis dahin in der Ersatzschrift und tauscht sie danach – der gemeldete Sprung. Jetzt wird jeder Schnitt des Themes vorab geholt (lateinischer Grundbereich; die erweiterten Bereiche bleiben draußen).
2. **Google in der Editorvorschau.** `EditorController` und `PartialController` gaben der Vorlage `googleFonts` und **kein** `localFonts`. In der Vorschau kamen die Schriften damit bei jedem Aufruf von `fonts.googleapis.com` und `fonts.gstatic.com` – zwei fremde Verbindungen hintereinander, und genau dort arbeitet Umut am meisten. Beide Vorschauen nutzen jetzt dieselben lokalen Dateien wie die öffentliche Seite.
**Die Regel steht jetzt im Code, nicht in der Einstellung.** `page.html.twig` hat keinen Google-Zweig mehr; fehlen die Schriftdateien, zeigt die Website die Ersatzschrift des Themes. Die Kopfzeilen lassen keinen fremden Schrifthost mehr zu – öffentlich `font-src 'self'`, in der Verwaltung `style-src 'self'; font-src 'self'` statt der bisherigen Ausnahmen für `fonts.googleapis.com`/`fonts.gstatic.com`. `Theme::googleFontsUrl()` ist entfernt; das Herunterladen der Dateien über die Theme-Seite bleibt unverändert und baut seine Adresse selbst. Die Vorabholen-Verweise stehen jetzt **vor** dem Stylesheet, und die Texte auf der Theme-Seite sagen nicht mehr „kommen zurzeit von Google“, sondern „die Dateien fehlen, bis dahin die Ersatzschrift“.
**Geprüft** (Chromium, kalter Zwischenspeicher, isolierte Kopie der Pilotdatenbank): alle drei Schriftdateien starten bei 96 ms und sind bei 166–168 ms fertig, der erste sichtbare Inhalt erscheint bei 292 ms – die Schriften stehen also vor dem ersten Zeichnen, es gibt nichts mehr zu tauschen. Jede Datei wird genau einmal angefragt. Über die ganze Sitzung – öffentliche Seite, Anmeldung, Seiteneditor mit Vorschau, Bereiche – **keine einzige Anfrage außerhalb des eigenen Servers**. PHP-Tests: 498, ein bekannter Fehler (siehe unten). `npm run test:browser` und der Lighthouse-Lauf sind **nicht** gelaufen.
**Tests angepasst:** `testFontsAreReadFromGoogleStylesheetAndServedFromHere` prüft jetzt die Ersatzschrift statt des Google-Verweises und alle drei Vorabhol-Dateien; `testThemeDrivesEveryPageAndGoogleFontsOpenTheirOwnPolicy` heißt `…AndNoFontIsEverFetchedFromGoogle` und prüft die engere Kopfzeile. In `testEveryAllowedIconHasADrawingAndTakesItsColourFromTheBlock` stand eine echte Zeilenschaltung im Suchmuster; unter Windows mit `core.autocrlf=true` schlägt das fehl, sobald die Arbeitskopie CRLF trägt. Das Muster nimmt jetzt `\R` und gilt für beide Schreibweisen; die Vorlage selbst bleibt unverändert.
**Weiterhin offen, nicht von dieser Aufgabe:** `CmsTest::testAnyPublishedPageCanBecomeTheRootAndEverythingFollows` schlägt fehl – der Test erwartet `<a href="/" aria-current="page">Start</a>`, das Menü schreibt seit den Symbolen `<span class="nav-label">` um die Beschriftung.
## Kopfmenü im Hochformat und die Update-Ansicht auf dem Handy (14.09.2026)
**Anlass:** Umut meldete, das Mobilmenü im Kopf erscheine nur im Querformat, und bat darum, Texte und Ansichten der Update-Seite fürs Handy zu kürzen.
**Befund zum Kopfmenü – falsch gebaut, kein Fehler im CMS.** Der Kopfbereich trug zwei Menüblöcke: `area-header-menu` (waagerecht, `mobile: display:none`) und daneben `area-header-burger` (eigener Burger-Block, nur mobil sichtbar). Der veröffentlichte Stand auf `web.kant-it.de` kennt den zweiten Block nicht – abgerufen am 14.09.2026 enthält das Markup dort nur `area-header-menu` samt `@media (max-width:767px){#area-header-menu{display:none}}`. Damit ist im Hochformat (bis 767 px) gar kein Menü da, während im Querformat (768–1024 px) das Standardverhalten `collapse: tablet` denselben Block zum Burger zusammenlegt und ein Knopf erscheint. Genau die gemeldete Beobachtung. In `var/kantit.db` lag zwar ein zweiter Burger-Block, der das Loch stopfte, aber mit eigener Gestaltung: im Hochformat ein 161 px breiter Knopf, im Querformat der 101 px breite des waagerechten Menüs.
**Behoben in `var/kantit.db`:** ein einziger Menüblock `area-header-menu` mit `collapse: tablet` und `burgerLabel: both`, ohne `display:none` auf Mobil, `burgerFontSize: 14px`; der doppelte Block `area-header-burger` ist entfernt (Kopfbereich Fassung 8, Sicherung `var/kantit.db.vor-kopfmenue-20260914-2244.bak`). Geprüft am laufenden Nachbau: 375 px Hochformat und 844 px Querformat zeigen denselben Knopf („MENÜ“, 101 × 45 px, 14 px), die Liste bleibt in beiden verborgen und die aufklappende Fläche liegt über die volle Breite unter dem Kopf; ab 1025 px stehen die vier Einträge wieder waagerecht. Startkonfiguration `kantit` (Port 8130) in `.claude/launch.json` ergänzt.
**Update-Ansicht (`templates/admin/system.html.twig`, `public/assets/admin.css`).** Die Seite schob sich auf dem Handy seitlich aus dem Bild: `.stack` ist ein Raster mit automatischer Spalte, und eine automatische Rasterspalte wächst auf die Mindestbreite ihres breitesten Inhalts – eine lange Datenbankpfadangabe reichte. `.stack` bekommt `minmax(0, 1fr)`, `.facts` beide Spalten als `minmax(0, …)` und unter 620 px nur noch eine, `.card-body` und die Prüfpunkte `min-width: 0` samt `overflow-wrap: anywhere`. Die Sicherungstabelle wird unter 620 px zu gestapelten Blöcken (`.table-stack`, Spaltenüberschrift als `data-label`), statt waagerecht zu scrollen. Texte gekürzt und das Kleingedruckte in zugeklappte `<details class="hint">` gelegt, ebenso die älteren 15 der 20 Protokollzeilen.
**Geprüft:** 390 × 844 mit Touch-Emulation gegen eine isolierte Kopie der Pilotdatenbank (`tests/pilot-fixture.php`, eigenes Zufallskonto): Dokumentbreite 390 statt 492, kein Element mehr breiter als der Inhaltsbereich, Wortzahl der Seite 1017 → 556, axe ohne Verstöße. `/admin`, `/admin/media`, `/admin/menus`, `/admin/forms`, `/admin/theme`, `/admin/settings` bleiben mobil bei 390 px; dieselben Seiten und `/admin/system` bei 1440 px unverändert breit. Screenshots: `reports/system-mobile/`.
**Bekannter Fehler, nicht von dieser Aufgabe:** `CmsTest::testAnyPublishedPageCanBecomeTheRootAndEverythingFollows` schlägt fehl (498 Tests, 1 Fehler) – der Test erwartet `<a href="/" aria-current="page">Start</a>`, das Menü schreibt seit den Symbolen `<span class="nav-label">` um die Beschriftung. Auch ohne diese Änderungen und mit beiden PHP-Fassungen reproduzierbar.
**Nächster Schritt:** Umut spielt `var/kantit.db` auf den Server; erst dort ist das Kopfmenü im Hochformat live. Für die Admin-Änderungen die `VERSION` beim nächsten Release erhöhen, sonst liefert der Browser `admin.css?v=1.13.0` weiter aus dem Zwischenspeicher.
## 1.14.0 – Öffnungszeiten, Einsatzgebiet und FAQ in den strukturierten Daten; Elektro Bernhard aktualisiert (14.09.2026)
**Anlass:** Umut nannte die tatsächlichen Bürozeiten (Mo–Fr 7:30–17:00), das Einsatzgebiet von Karlsruhe bis Offenburg und wollte die FAQ „mit allem, was notwendig ist“ – das JSON-LD, das das CMS bisher nicht hergab (siehe Lücke in den Einträgen vom Abgleich).
**Umgesetzt (ADR 095):** Einstellungen `openingHours` und `areaServed` mit Formular unter Unternehmensdaten; `SiteSettings::organisation()` gibt `openingHoursSpecification` (gleiche Zeiten zusammengefasst) und `areaServed` aus. Akkordeon-Eigenschaft `faq` (Schema v23, Kästchen im Editor); `PageController` baut daraus eine `FAQPage` mit Frage und Antwort aus dem sichtbaren Inhalt. Fünf neue Tests: Zusammenfassung und Reihenfolge der Zeiten, Abweisung unvollständiger oder verdrehter Zeiten, FAQPage nur aus gekennzeichneten Akkordeons und nur mit Antwort, Abweisung der Kennzeichnung vor v23, und – nach einem Fund der vollen Suite – dass ein Bildschirm, der die geladenen Einstellungen unverändert zurückgibt (Anlegen der Rechtsseiten, Installer), Öffnungszeiten und Einsatzgebiet nicht löscht.
**Elektro Bernhard:** Bürozeiten überall Mo–Fr 07:30–17:00 Uhr (Fuß, Kontakt, Beschreibung, FAQ); Einsatzgebiet Baden-Baden, Sinzheim, Hügelsheim, Iffezheim, Bühl, Rastatt, Kuppenheim, Muggensturm, Gaggenau, Gernsbach, Murgtal, Ettlingen, Karlsruhe, Achern, Oberkirch, Offenburg in Text und `areaServed`; FAQ um „Wann ist das Büro erreichbar?“ und „Wie läuft eine Anfrage ab?“ ergänzt und als FAQ gekennzeichnet. Die Öffnungszeiten weichen bewusst von der laufenden Website ab (dort Mo–Do 7:00–16:30, Fr bis 13:00) – Umuts Angabe gilt.
**Arbeitsweise:** Weil eine parallele Sitzung im Hauptarbeitsbaum dreizehn Dateien offen hatte, darunter Validator, PageController und Editor, entstand diese Änderung im eigenen Worktree `var/wt-faq` auf dem Zweig `oeffnungszeiten-faq` und wurde von dort auf `main` gebracht. Der Hauptarbeitsbaum muss danach `git pull` ausführen.
## 1.13.0 – Drei Symbole mehr, gestaltbarer Menü-Knopf, Nachbau „Tagespflege Moldovan“ (14.09.2026)
**Anlass:** Umut ließ die ZIP-Vorlage „Tagespflege Moldovan“ nachbauen. Beim Nachbau fehlten dem Symbolsatz genau die drei Bilder, die die Vorlage zeigt; danach kamen zwei Meldungen vom Telefon: das Menü sei nicht zu sehen, und „Scroll to top“ funktioniere nicht.
@@ -14,6 +134,8 @@
**Geprüft:** PHP-Suite 498 Tests (fünf neue: Symbolliste gegen Zeichnungen, drei Knopfvarianten, abgewiesene Variante, Knopffarben am `summary`); einziger Fehlschlag ist der bekannte Altfehler `testAnyPublishedPageCanBecomeTheRoot…`. 33 JavaScript-Tests, Twig-Lint, PHP-Stilprüfung sauber, Editor-Browserprüfung vollständig erfolgreich einschließlich axe. Playwright auf dem Nachbau bei 1440, 900 und 390 px sowie als iPhone 13: Seite gegen die Vorlage verglichen, Menü öffnet als Fläche unter dem Kopf, Sprungziele, 404-Seite, keine Konsolenfehler. Nach-oben-Knopf auf der Elektro-Bernhard-Installation als iPhone geprüft: oben verborgen, ab der Schwelle sichtbar, springt an den Anfang.
**Veröffentlicht:** Commit `73719ba` und Tag `v1.13.0` auf `origin`; [Release 1.13.0](https://git.kant-it.de/kantarci/KantSites/releases/tag/v1.13.0) mit ZIP (3546 Dateien, 4,6 MB), SHA-256-Datei und `install.php`. Das Archiv wurde aus einem sauberen Worktree des Tags gebaut (`var/release-source-1.13.0`), `vendor/` ohne Entwicklungspakete; die einzige `.env` im Archiv ist die Vorlage ohne Geheimnis. Die drei Anhänge wurden anonym von der Releaseadresse geladen und bytegenau mit den gebauten Dateien verglichen; SHA-256 `14e333e0…59dcbf`, identisch mit der Prüfsumme, die `install.php` mitbringt.
## 1.12.1 – Elektro Bernhard gemessen: Lighthouse und axe (14.09.2026)
**Anlass:** Umut fragte nach Google-Bewertung, SEO, llms.txt und Barrierefreiheit der neuen Website.
+45 -3
View File
@@ -211,13 +211,37 @@ label { display: block; margin: 18px 0 7px; font-size: 13px; font-weight: 600 }
.shell-heading p { font-size: 13px; margin: 7px 0 0; max-width: 62ch }
.shell-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap }
.shell-body { padding: 30px 38px 60px; max-width: 1180px; width: 100% }
.stack { display: grid; gap: 20px }
/* Eine Spalte, die nie breiter wird als der Bildschirm: ohne `minmax(0, 1fr)` waechst
die automatische Rasterspalte auf die Mindestbreite ihres breitesten Inhalts - auf dem
Handy schiebt eine einzige lange Pfadangabe dann die ganze Seite zur Seite. */
.stack { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px }
.notice { padding: 13px 17px; border-radius: 8px; line-height: 1.6; font-size: 13px; margin: 0 }
.notice.ok { background: #edf3dc; color: #2c5340; border: 1px solid #c5d89a }
.error, .notice.error { background: #fff0eb; color: var(--danger); border: 1px solid #e2b2a7 }
.shell-body > .notice { margin-bottom: 4px }
/* Der Hinweisstreifen ueber jedem Verwaltungsbildschirm: eine Sache, die getan werden will, und
gleich daneben der Knopf, der sie tut. Warm statt rot - es ist eine Aufgabe, kein Fehler. */
.shell-notice {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 10px 18px;
margin: 0 0 4px;
padding: 12px 14px 12px 17px;
border: 1px solid #e3cf9b;
border-radius: 10px;
background: #fdf6e4;
color: #5b4412;
line-height: 1.6;
font-size: 13px;
}
.shell-notice > span { min-width: 0; flex: 1 1 260px }
.shell-notice .secondary { flex: none; border-color: #dcc48a; background: var(--paper); color: #5b4412 }
.shell-notice .secondary:hover { background: #fbeecd; border-color: #cbb072 }
/* ---- cards and sections ---------------------------------------------------------------- */
.card { background: var(--paper); border: 1px solid var(--line); border-radius: 12px }
@@ -232,7 +256,12 @@ label { display: block; margin: 18px 0 7px; font-size: 13px; font-weight: 600 }
}
.card-head h2, .card-head h3 { margin: 0 }
.card-head .muted { font-size: 12px }
.card-body { padding: 8px 22px 24px }
.card-body { padding: 8px 22px 24px; min-width: 0 }
.card-body code { overflow-wrap: anywhere }
/* Das Kleingedruckte einer Karte: zugeklappt, damit auf einem Handy der Knopf oben bleibt. */
.hint { margin: 12px 0 0 }
.hint > summary { font-size: 12px; font-weight: 600; color: var(--muted); cursor: pointer; min-height: 44px; display: flex; align-items: center }
.hint[open] > summary { margin-bottom: 2px }
/* A heading for a group of rows, outside any card. */
.section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px 20px; flex-wrap: wrap; margin: 16px 2px -6px }
.section-head h2 { margin: 0 }
@@ -550,6 +579,18 @@ details.card > summary:hover { background: #fafbf8 }
.row.depth-1, .row.depth-2, .row.depth-3 { margin-left: 14px }
.login-card { padding: 26px }
.login-body { padding: 16px }
/* Zwei Rasterspalten aus Bezeichner und Wert sind auf einem Handy eine Spalte zu viel. */
.facts { grid-template-columns: minmax(0, 1fr); gap: 2px }
.facts dt { margin-top: 10px }
.facts dt:first-child { margin-top: 0 }
/* Eine sechsspaltige Tabelle passt auf kein Handy. Jede Zeile wird zu einem Block, und die
Spaltenueberschrift steht als Bezeichner vor ihrem Wert. */
.table-stack thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%) }
.table-stack, .table-stack tbody, .table-stack tr, .table-stack td { display: block; width: 100% }
.table-stack tr { border: 1px solid var(--line); border-radius: 10px; padding: 8px 12px; margin-top: 10px }
.table-stack tbody tr + tr td { border-top: 0 }
.table-stack td { display: flex; gap: 14px; justify-content: space-between; align-items: baseline; padding: 5px 0; text-align: right }
.table-stack td::before { content: attr(data-label); color: var(--muted); text-align: left; flex: none }
}
/* A group of related checkboxes needs a name of its own, not just a label per box. */
@@ -586,11 +627,12 @@ details.card > summary:hover { background: #fafbf8 }
/* ---- system: preflight, update steps, log ---------------------------------------------- */
.facts { display: grid; grid-template-columns: auto 1fr; gap: 8px 20px; margin: 14px 0 0; font-size: 13px }
.facts { display: grid; grid-template-columns: minmax(0, auto) minmax(0, 1fr); gap: 8px 20px; margin: 14px 0 0; font-size: 13px }
.facts dt { color: var(--muted) }
.facts dd { margin: 0; overflow-wrap: anywhere }
.check-list { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 10px; font-size: 13px; line-height: 1.55 }
.check-list li { display: flex; gap: 11px; align-items: flex-start }
.check-list li > span { min-width: 0; overflow-wrap: anywhere }
.check-mark {
display: grid;
place-items: center;
+22 -8
View File
@@ -3,6 +3,9 @@
The layout follows the Flatsome UX Builder: a dark bar on top, one sidebar on the left that
shows one thing at a time, and the page itself filling the rest. */
/* Die Farbe fuer "hier steht ein eigener Wert". Dunkler als der Fokusring, damit weisse
Schrift darauf die Kontrastschwelle sicher nimmt (5,6:1). */
:root{--used:#9d4e0d}
dialog{max-width:450px;width:calc(100% - 40px);padding:28px;background:var(--paper);border:1px solid var(--line);border-radius:12px;color:var(--ink);box-shadow:0 20px 80px #1b2a2433}
dialog::backdrop{background:#172e2966}
dialog p{font-size:14px;line-height:1.7;color:var(--muted)}
@@ -185,8 +188,10 @@ html:has(>.editor-body){overflow:hidden;height:100%}
.design-row{margin-top:14px}
.design-row-head{display:flex;justify-content:space-between;align-items:center;gap:8px}
.design-row-head label{margin:0;font-size:11px;line-height:1.5;flex:1;min-width:0}
.design-own .design-row-head label{color:#2f5d4a;font-weight:700}
.design-own .design-row-head label::before{content:'● ';color:var(--accent)}
/* Belegte Zeilen tragen dieselbe Farbe wie die belegten Geraetechips - eine Farbe, eine
Bedeutung: hier steht ein eigener Wert und nicht der geerbte. */
.design-own .design-row-head label{color:var(--used);font-weight:700}
.design-own .design-row-head label::before{content:'● ';color:var(--used)}
.design-reset-one{font-size:14px;padding:2px 6px;min-height:24px;line-height:1}
.design-inherited{font-size:10px;color:var(--muted);margin:5px 0 0;line-height:1.45}
.length-control{display:grid;grid-template-columns:minmax(0,1fr) 74px;gap:6px}
@@ -210,12 +215,21 @@ html:has(>.editor-body){overflow:hidden;height:100%}
.side-unit{display:flex;align-items:center;gap:7px;margin-top:7px}
.side-unit label{margin:0;font-size:10px;color:var(--muted)}
.side-unit-select{flex:1;min-width:0}
/* The device chips on a single option: which devices carry an own value, and switch to one. */
.device-chips{display:flex;gap:2px;margin-left:auto}
.device-chip{width:19px;height:19px;display:grid;place-items:center;padding:0;min-height:0;border:1px solid var(--line);border-radius:4px;background:#fff;color:var(--muted);font:700 9px/1 system-ui,sans-serif;cursor:pointer}
.device-chip:hover{border-color:var(--accent)}
.device-chip-own{background:#eef5e6;border-color:var(--accent);color:var(--accent)}
.device-chip[aria-pressed=true]{outline:2px solid var(--ring,#b55b12);outline-offset:1px}
/* The device chips on a single option: which devices carry an own value, and switch to one.
Zwei Zustaende, zwei Mittel. "Belegt" - dieses Geraet traegt einen eigenen Wert - ist die
Auskunft, die man ueber die ganze Liste hinweg sucht, und bekommt deshalb die kraeftige Farbe.
"Gerade bearbeitet" ist ein Rahmen, und zwar ein Rahmen INNEN: ein `outline` liegt ausserhalb
des Kaestchens, laeuft bei 2 px Abstand unter den Nachbarn und wird von der seitlich
beschnittenen Spalte gekappt - es sah aus wie ein abgeschnittener roter Kasten. */
.device-chips{display:flex;flex:none;gap:6px;margin-left:auto}
.device-chip{width:22px;height:22px;display:grid;place-items:center;padding:0;min-height:0;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--muted);font:700 10px/1 system-ui,sans-serif;cursor:pointer}
.device-chip:hover{border-color:var(--ink)}
.device-chip-own{background:var(--used);border-color:var(--used);color:#fff}
.device-chip[aria-pressed=true]{border-width:2px;border-color:var(--ink)}
.device-chip-own[aria-pressed=true]{border-color:var(--ink);box-shadow:inset 0 0 0 1px #fff}
/* Der Fokusring bleibt innerhalb der Luecke zwischen zwei Chips - nichts liegt uebereinander. */
.device-chip:focus-visible{outline-width:2px;outline-offset:0}
.design-side-head{margin-bottom:5px}
.design-side-head .design-group-label{margin:0}
/* A number field that can be dragged sideways. The cursor is the only announcement it needs. */
+2
View File
@@ -309,6 +309,7 @@ function renderContent(block, panel) {
if (key === 'click' || key === 'lightbox') upgradeDocument(doc, 19);
if (key === 'newTab') upgradeDocument(doc, 20);
if (key === 'collapse') upgradeDocument(doc, 22);
if (key === 'faq') upgradeDocument(doc, 23);
if (current.type === 'image' && key === 'src') { delete current.props.sources; delete current.props.mediaId; }
}, options.choices ? null : `${selected || 'page'}:${key}`);
if (key === 'src') imagePreview?.update({ src: input.value });
@@ -452,6 +453,7 @@ function renderContent(block, panel) {
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 === 'accordion') {
field('Als FAQ auszeichnen', 'faq', block.props?.faq === true, { checkbox: true, help: 'Die Einträge erscheinen als Frage-Antwort-Paare in den strukturierten Daten (FAQPage): der Titel ist die Frage, die Textbausteine im Eintrag sind die Antwort.' });
const hint = document.createElement('p'); hint.className = 'field-help';
hint.textContent = 'Wähle einen Eintrag, um seinen Titel und Inhalt zu bearbeiten. Texte, Bilder und weitere Elemente gehören in den jeweiligen Eintrag.';
const entries = document.createElement('div'); entries.className = 'accordion-entry-list';
+57 -19
View File
@@ -126,31 +126,56 @@ p{hyphens:auto}
/* The consent question. Fixed to the bottom, but it never covers the whole page: the content
stays readable while the decision is open, because a wall would make "accept" the only way
forward. Accepting and refusing are the same button in the same row. */
.consent-bar{position:fixed;inset-inline:12px;bottom:12px;z-index:50;max-width:620px;margin-inline:auto;background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:14px;padding:20px 22px;box-shadow:0 18px 50px color-mix(in srgb,var(--ink) 15%,transparent);font-size:14px;line-height:1.6}
.kant .consent-bar h2{font-size:16px;margin:0 0 8px}
.consent-bar p{margin:0 0 14px}
forward. Accepting and refusing are the same button in the same row.
Aussehen aus den Einstellungen: `--kant-consent-*` im Kopf der Seite (Consent::styles), die
Anordnung als Klasse. Ohne Einstellung gilt Papier, Tinte und Akzent des Themes. Ein Wert wie
`--k-consent` aus der Palette bleibt als Zwischenstufe erhalten. */
.consent-bar{position:fixed;inset-inline:16px;bottom:16px;z-index:50;max-width:640px;max-height:calc(100dvh - 24px);overflow:auto;margin-inline:auto;background:var(--kant-consent-bg,var(--paper));color:var(--kant-consent-ink,var(--ink));border:1px solid color-mix(in srgb,currentColor 12%,transparent);border-radius:var(--kant-consent-radius,18px);padding:22px 24px 20px;box-shadow:0 24px 60px color-mix(in srgb,var(--ink) 22%,transparent);font-size:14px;line-height:1.6;overscroll-behavior:contain}
/* Ein schmaler Streifen in der Akzentfarbe oben: die Fläche gehört sichtbar zur Website. */
.consent-bar::before{content:'';position:absolute;inset:0 0 auto 0;height:4px;background:var(--kant-consent-accent,var(--k-consent,var(--accent)))}
.kant .consent-bar h2{display:flex;align-items:center;gap:10px;font-size:17px;line-height:1.3;margin:0 0 8px}
.consent-icon{flex:none;color:var(--kant-consent-accent,var(--k-consent,var(--accent)))}
.consent-bar p{margin:0 0 16px;color:color-mix(in srgb,currentColor 82%,transparent)}
.consent-actions{display:flex;flex-wrap:wrap;gap:10px}
.consent-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:11px 18px;border-radius:8px;border:1px solid var(--k-consent,var(--accent));background:var(--k-consent,var(--accent));color:#fff;font:inherit;font-weight:600;cursor:pointer}
.consent-actions .consent-button:last-child{background:var(--paper);color:var(--ink);border-color:var(--line)}
.consent-button{display:inline-flex;align-items:center;justify-content:center;flex:1 1 150px;min-height:46px;padding:11px 18px;border-radius:var(--kant-consent-button-radius,10px);border:1.5px solid var(--kant-consent-accent,var(--k-consent,var(--accent)));background:var(--kant-consent-accent,var(--k-consent,var(--accent)));color:var(--kant-consent-accent-ink,#fff);font:inherit;font-weight:600;cursor:pointer;transition:filter .12s,background-color .12s}
.consent-decline,.consent-choice{background:transparent;color:inherit;border-color:color-mix(in srgb,currentColor 28%,transparent)}
.consent-button:hover{filter:brightness(.94)}
.consent-button:focus-visible,.consent-bar a:focus-visible,.consent-bar summary:focus-visible,.consent-bar input:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.consent-details{margin-top:14px}
.consent-details>summary{cursor:pointer;font-size:13px;font-weight:600;padding:4px 0}
.consent-decline:hover,.consent-choice:hover{filter:none;background:color-mix(in srgb,currentColor 7%,transparent)}
.consent-button:focus-visible,.consent-bar a:focus-visible,.consent-bar summary:focus-visible,.consent-bar input:focus-visible{outline:3px solid var(--kant-consent-accent,var(--k-consent,var(--accent)));outline-offset:2px}
/* Fusszeile der Frage: Einzelwahl links, Rechtslinks rechts, auf einer Linie. Aufgeklappt
nimmt die Einzelwahl die volle Breite und die Links rutschen rechtsbuendig darunter. */
.consent-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 20px;margin-top:14px}
.consent-details{flex:0 1 auto;min-width:0}
.consent-details[open]{flex-basis:100%}
.consent-details>summary{cursor:pointer;font-size:13px;font-weight:600;padding:6px 0;list-style:none;display:inline-flex;align-items:center;gap:6px}
.consent-details>summary::-webkit-details-marker{display:none}
.consent-details>summary::after{content:'';width:7px;height:7px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .15s}
.consent-details[open]>summary::after{transform:translateY(2px) rotate(-135deg)}
.consent-details>summary:hover{text-decoration:underline}
.consent-groups{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:10px}
.consent-groups label{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.5}
.consent-groups input{margin-top:3px;width:18px;height:18px;flex-shrink:0}
.consent-choice{margin-top:14px;background:var(--paper);color:var(--ink);border-color:var(--line)}
.consent-links{margin:14px 0 0;font-size:12px}
.consent-links a{color:var(--accent)}
.consent-groups input{margin-top:3px;width:18px;height:18px;flex-shrink:0;accent-color:var(--kant-consent-accent,var(--k-consent,var(--accent)))}
.consent-choice{margin-top:14px;flex:none;width:auto}
/* Eigener Selektor mit Element, sonst gewinnt `.consent-bar p` und nimmt den Rand rechts weg. */
.consent-bar p.consent-links{margin:0 0 0 auto;display:flex;gap:14px;font-size:12px;color:color-mix(in srgb,currentColor 72%,transparent)}
.consent-links a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.consent-links a:hover{color:var(--kant-consent-accent,var(--k-consent,var(--accent)))}
/* Leiste: über die ganze Breite am unteren Rand, auf breiten Bildschirmen Text links und Knöpfe
rechts. Ecke: eine kleine Karte rechts unten, die den Inhalt kaum verdeckt. */
.consent-layout-leiste{inset-inline:0;bottom:0;max-width:none;border-radius:var(--kant-consent-radius,18px) var(--kant-consent-radius,18px) 0 0;border-inline:0;border-bottom:0;padding-inline:max(24px,calc((100% - 1180px) / 2))}
@media (min-width:900px){.consent-layout-leiste{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 40px;align-items:center}.consent-layout-leiste .consent-body p{margin-bottom:0}.consent-layout-leiste .consent-form{width:360px;max-width:100%}}
.consent-layout-ecke{inset-inline:auto 16px;max-width:400px;margin:0}
/* While the question is open the bar is fixed at the bottom, so the page has to end above it -
otherwise it covers the last element, and an embed's own consent button sat right underneath.
Found by the browser test, which could not click it. */
body.consent-open{padding-bottom:260px}
Found by the browser test, which could not click it. Auf schmalen Bildschirmen ist die Leiste
mit Standardtext bis 290 px hoch; 320 px lassen ihr Luft, ohne einen Bildschirm zu verschenken. */
body.consent-open{padding-bottom:320px}
@media (min-width:621px){body.consent-open{padding-bottom:270px}}
@media (min-width:900px){body.consent-open{padding-bottom:200px}}
.consent-page main{max-width:680px;margin-inline:auto;padding:40px 20px}
.consent-page .consent-bar{position:static;inset:auto;box-shadow:none;max-width:none;margin-top:24px}
@media (max-width:620px){.consent-bar{inset-inline:0;bottom:0;border-radius:14px 14px 0 0;padding:16px}.consent-actions .consent-button{flex:1 1 140px}}
.consent-page .consent-bar{position:static;inset:auto;box-shadow:none;max-width:none;max-height:none;margin:24px 0 0;display:block}
@media (max-width:620px){.consent-bar,.consent-layout-ecke{inset-inline:0;bottom:0;max-width:none;border-radius:var(--kant-consent-radius,18px) var(--kant-consent-radius,18px) 0 0;border-inline:0;border-bottom:0;padding:18px 18px 16px}.consent-layout-leiste{padding-inline:18px}}
/* An embedded third party, and what stands in its place until it may load. */
.block-embed iframe{display:block;width:100%;border:0;border-radius:10px;background:color-mix(in srgb,var(--ink) 8%,var(--paper))}
@@ -406,8 +431,21 @@ body.consent-open{padding-bottom:260px}
.scroll-top:hover{filter:brightness(1.08)}
.scroll-top:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
@media (max-width:767px){.scroll-top{bottom:16px;right:16px}.scroll-top-links{left:16px;right:auto}}
/* Solange der Einwilligungsdialog unten steht, würde der Knopf darauf liegen. */
body.consent-open .scroll-top{display:none}
/* Solange die Einwilligungsfrage offen ist, bleibt der Knopf da. Frueher verschwand er ganz -
und auf dem Telefon bleibt die Frage oft einfach stehen, der Knopf kam dort also nie.
Bis 799 px deckt die Leiste die Ecke ab, in der er steht: dort setzt er sich per
Ankerpositionierung auf ihre Oberkante, wie hoch ihr Text auch umbricht. Ab 800 px steht die
Leiste zentriert mit Rand, die Ecke bleibt frei. Ein Browser ohne Ankerpositionierung blendet
ihn in der schmalen Stufe weiter aus - lieber kein Knopf als einer unter der Leiste. Der Anker
muss im Dokument vor dem Knopf stehen; page.html.twig gibt die Leiste deshalb zuerst aus. */
.consent-bar{anchor-name:--kant-consent}
@media (max-width:799px){
@supports (anchor-name:--kant-consent){body.consent-open .scroll-top{position-anchor:--kant-consent;bottom:calc(anchor(top) + 12px)}}
@supports not (anchor-name:--kant-consent){body.consent-open .scroll-top{display:none}}
}
/* Leiste und Ecke decken die Ecke auf jeder Breite ab - dort gilt dasselbe ohne Stufe. */
@supports (anchor-name:--kant-consent){body.consent-open:has(.consent-layout-leiste,.consent-layout-ecke) .scroll-top{position-anchor:--kant-consent;bottom:calc(anchor(top) + 12px)}}
@supports not (anchor-name:--kant-consent){body.consent-open:has(.consent-layout-leiste,.consent-layout-ecke) .scroll-top{display:none}}
/* Sichtbar, sobald der Leser ein Stueck gescrollt hat - gesteuert von scrolled.js ueber
`kant-top-armed` und `kant-top-shown`. Ohne Skript bleibt der Knopf einfach sichtbar. */
html.kant-top-armed .scroll-top{opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .25s,visibility .25s,transform .25s}
+12 -8
View File
@@ -373,7 +373,7 @@ $fuss = [
]),
$column('fuss-zeiten', [
$heading('fuss-zeiten-titel', 'Bürozeiten', 3, $fussTitel),
$text('fuss-zeiten-text', "Mo–Do: 07:00–16:30 Uhr\nFr: 07:00–13:00 Uhr\nSa–So: geschlossen", ['desktop' => ['fontSize' => '15px', 'lineHeight' => 1.8, 'color' => '#c4c8ce']]),
$text('fuss-zeiten-text', "Mo–Fr: 07:30–17:00 Uhr\nSa–So: geschlossen", ['desktop' => ['fontSize' => '15px', 'lineHeight' => 1.8, 'color' => '#c4c8ce']]),
$text('fuss-zeiten-notdienst', '<strong>Notdienst: 24/7 erreichbar</strong>', ['desktop' => ['fontSize' => '15px', 'color' => '@papier', 'margin' => ['top' => '10px']]]),
]),
], ['desktop' => ['columns' => 'four', 'gap' => 'large'], 'tablet' => ['columns' => 'two'], 'mobile' => ['columns' => 'one']], ['desktop' => ['margin' => ['top' => '0px']]]),
@@ -405,11 +405,13 @@ $leistungen = [
];
$fragen = [
['Wo ist Elektro Bernhard im Einsatz?', 'Unser Standort ist in Baden-Baden. Wir betreuen Projekte in Baden-Baden, Hügelsheim, Iffezheim, Rastatt, Kuppenheim, Gaggenau, Gernsbach, Muggensturm, im Murgtal und in der Umgebung. Fragen Sie uns gerne zu Ihrem konkreten Projektort.'],
['Wo ist Elektro Bernhard im Einsatz?', 'Unser Standort ist in Baden-Baden. Wir betreuen Projekte in Baden-Baden, Sinzheim, Hügelsheim, Iffezheim, Bühl, Rastatt, Kuppenheim, Muggensturm, Gaggenau, Gernsbach und im Murgtal, Ettlingen und Karlsruhe sowie Achern, Oberkirch und Offenburg – von Karlsruhe bis Offenburg. Fragen Sie uns gerne zu Ihrem konkreten Projektort.'],
['Übernehmen Sie Neubauten und Sanierungen?', 'Ja. Elektroinstallation für Neu- und Altbauten gehört zu unseren Leistungen. Wir beraten Sie zu Ihrem Vorhaben und planen gemeinsam die passende Umsetzung.'],
['Was lässt sich mit Smart Home steuern?', 'Zum Beispiel Beleuchtung, Heizung und Sicherheitsfunktionen. Welche Steuerung zu Ihrem Gebäude passt, klären wir in einer individuellen Beratung.'],
['Wie erreiche ich den 24h-Notdienst?', 'Bei einem elektrischen Notfall erreichen Sie unseren Kundendienst rund um die Uhr unter '.$notdienst.'. Für reguläre Projektanfragen erreichen Sie unser Büro unter '.$buero.'.'],
['Bieten Sie auch Solaranlagen an?', 'Solarplanung und Installation übernimmt die eigenständige Elektro Bernhard Regenerative Energie GmbH. Das Angebot richtet sich an private Wohnhäuser und Geschäftsgebäude.'],
['Wann ist das Büro erreichbar?', 'Montag bis Freitag von 07:30 bis 17:00 Uhr unter '.$buero.'. Außerhalb dieser Zeiten und am Wochenende hilft bei einem elektrischen Notfall der 24h-Notdienst unter '.$notdienst.'.'],
['Wie läuft eine Anfrage ab?', 'Sie schildern uns Ihr Vorhaben und den Ort – per Formular, E-Mail oder Telefon. Wir melden uns innerhalb von 24 Stunden, klären offene Fragen und stimmen mit Ihnen einen Termin vor Ort oder ein Angebot ab.'],
];
// Wortlaut, Name und Datum am 14.09.2026 aus den auf elektro-bernhard.de veröffentlichten
@@ -445,7 +447,7 @@ $leistungstexte = [
['Welche Technik passt zum Gebäude?', 'Bevor wir eine Lösung empfehlen, betrachten wir Ihre Wünsche und die Gegebenheiten vor Ort. So lässt sich klären, welche Technik zu Ihrem Projekt passt.'],
]],
'notdienst' => ['24h Elektro-Notdienst in Baden-Baden | Elektro Bernhard', '24h Elektro-Notdienst', 'Bei elektrischen Notfällen ist unser Kundendienst rund um die Uhr unter '.$notdienst.' erreichbar. Schildern Sie uns am Telefon das Problem und Ihren Standort.', [
['Für die Region erreichbar', 'Unser Einsatzgebiet umfasst Baden-Baden, Hügelsheim, Iffezheim, Rastatt, Kuppenheim, Gaggenau, Gernsbach, Muggensturm, das Murgtal und die Umgebung. Die konkrete Verfügbarkeit für Ihren Standort klären wir im Gespräch.'],
['Für die Region erreichbar', 'Unser Einsatzgebiet umfasst Baden-Baden, Sinzheim, Hügelsheim, Iffezheim, Bühl, Rastatt, Kuppenheim, Muggensturm, Gaggenau, Gernsbach und das Murgtal, Ettlingen und Karlsruhe sowie Achern, Oberkirch und Offenburg. Die konkrete Verfügbarkeit für Ihren Standort klären wir im Gespräch.'],
['Der direkte Weg zur Hilfe', 'Für einen Notfall nutzen Sie bitte die Notdienstnummer. Das Kontaktformular ist für reguläre Anfragen gedacht und wird nicht durchgehend überwacht.'],
]],
'beratung-planung' => ['Elektroplanung & Beratung in Baden-Baden | Elektro Bernhard', 'Beratung und Elektroplanung', 'Ob erste Idee oder konkretes Vorhaben: Wir beraten Sie individuell und begleiten die Planung Ihrer Elektrotechnik.', [
@@ -514,7 +516,7 @@ $kontaktAbschnitt = static function (string $praefix) use ($section, $row, $colu
]),
$column($praefix.'-kontakt-zeiten', [
$heading($praefix.'-kontakt-zeiten-titel', 'Bürozeiten', 3, ['desktop' => ['fontSize' => '15px', 'fontWeight' => '700', 'margin' => ['bottom' => '8px']]]),
$text($praefix.'-kontakt-zeiten-text', "Mo–Do: 07:00–16:30 Uhr\nFr: 07:00–13:00 Uhr\nSa–So: geschlossen", ['desktop' => ['fontSize' => '15px', 'lineHeight' => 1.7, 'color' => '@gedaempft']]),
$text($praefix.'-kontakt-zeiten-text', "Mo–Fr: 07:30–17:00 Uhr\nSa–So: geschlossen", ['desktop' => ['fontSize' => '15px', 'lineHeight' => 1.7, 'color' => '@gedaempft']]),
$text($praefix.'-kontakt-zeiten-notdienst', '<strong>Notdienst: 24/7 erreichbar</strong>', ['desktop' => ['fontSize' => '15px', 'margin' => ['top' => '10px']]]),
]),
], ['desktop' => ['columns' => 'two', 'gap' => 'medium'], 'mobile' => ['columns' => 'one']], ['desktop' => ['borderWidth' => ['top' => '1px', 'right' => '0px', 'bottom' => '0px', 'left' => '0px'], 'borderStyle' => 'solid', 'borderColor' => '@linie', 'padding' => ['top' => '26px'], 'margin' => ['top' => '0px']]]),
@@ -542,7 +544,7 @@ $startseite = [
$column('hero-text', [
$fx($eyebrow('hero-label', 'Elektro Bernhard GmbH · Seit über 35 Jahren', '#ff7d90'), 'fade'),
$fx($heading('hero-titel', "Ihr Elektriker in\nBaden-Baden.", 1, ['desktop' => ['fontSize' => '76px', 'lineHeight' => 1.04, 'letterSpacing' => '-0.035em', 'fontWeight' => '900', 'color' => '@papier', 'margin' => ['bottom' => '24px']], 'tablet' => ['fontSize' => '56px'], 'mobile' => ['fontSize' => '40px']]), 'rise', 'short'),
$fx($text('hero-intro', 'Ob Neubau, Sanierung oder eine Störung an der Elektrik: Wir kümmern uns darum. Für Privatkunden und Betriebe in Baden-Baden, Rastatt und Umgebung.', ['desktop' => ['color' => '#ffffffd9', 'fontSize' => '20px', 'lineHeight' => 1.65, 'maxWidth' => '600px', 'margin' => ['bottom' => '34px']], 'mobile' => ['fontSize' => '17px']]), 'rise', 'medium'),
$fx($text('hero-intro', 'Ob Neubau, Sanierung oder eine Störung an der Elektrik: Wir kümmern uns darum. Für Privatkunden und Betriebe von Karlsruhe bis Offenburg.', ['desktop' => ['color' => '#ffffffd9', 'fontSize' => '20px', 'lineHeight' => 1.65, 'maxWidth' => '600px', 'margin' => ['bottom' => '34px']], 'mobile' => ['fontSize' => '17px']]), 'rise', 'medium'),
$fx($row('hero-aktionen', [
$column('hero-aktion-anfrage', [$button('hero-anfrage', 'Anfrage stellen', '/kontakt')]),
$column('hero-aktion-telefon', [
@@ -664,7 +666,7 @@ $startseite = [
$fx($kontaktBlock('fragen-telefon', ['phone' => $buero], ['desktop' => ['fontSize' => '18px', 'fontWeight' => '900', 'color' => '@rot', 'margin' => ['top' => '10px']]]), 'rise', 'medium'),
]),
$column('fragen-liste', [
['id' => 'fragen-akkordeon', 'type' => 'accordion', 'children' => array_map(static function (array $f, int $i) use ($alleEcken): array {
['id' => 'fragen-akkordeon', 'type' => 'accordion', 'props' => ['faq' => true], 'children' => array_map(static function (array $f, int $i) use ($alleEcken): array {
return [
'id' => 'frage-'.($i + 1), 'type' => 'accordionitem', 'props' => ['title' => $f[0], 'open' => 0 === $i],
'style' => ['desktop' => ['backgroundColor' => '@weich', 'borderStyle' => 'none', 'borderRadius' => $alleEcken('14px'), 'padding' => ['top' => '4px', 'right' => '24px', 'bottom' => '4px', 'left' => '24px']]],
@@ -740,7 +742,7 @@ foreach ($leistungen as [$slug, $icon, $name, $kurz]) {
'blocks' => [
$seitenkopf($slug, $name, $h1, $intro, [$knopf]),
$textkoerper($slug, array_merge($absaetze, [
['Ihr Elektriker vor Ort', 'Elektro Bernhard GmbH · Ooser Hauptstr. 51 · 76532 Baden-Baden. Für Baden-Baden, Hügelsheim, Iffezheim, Rastatt, Kuppenheim, Gaggenau, Gernsbach, Muggensturm, das Murgtal und die Umgebung.'],
['Ihr Elektriker vor Ort', 'Elektro Bernhard GmbH · Ooser Hauptstr. 51 · 76532 Baden-Baden. Für Baden-Baden, Sinzheim, Hügelsheim, Iffezheim, Bühl, Rastatt, Kuppenheim, Muggensturm, Gaggenau, Gernsbach und das Murgtal, Ettlingen und Karlsruhe sowie Achern, Oberkirch und Offenburg.'],
]), [], [
$text($slug.'-zurueck', '<a href="/leistungen">Alle Leistungen ansehen →</a>', ['desktop' => [...$linkStil['desktop'], 'margin' => ['top' => '30px']]]),
$cta($slug.'-cta'),
@@ -841,7 +843,7 @@ echo "Menüs angelegt\n";
$settings->assignNotFoundPage($fehlerId, '');
$settings->save([
'legalName' => 'Elektro Bernhard GmbH',
'description' => 'Elektrofachbetrieb in Baden-Baden, seit über 35 Jahren. Elektroinstallation für Neu- und Altbau, Smart Home, Beratung und Planung sowie ein 24h-Notdienst unter 0151 25245851. Bürozeiten Mo–Do 7:00–16:30 Uhr, Fr 7:00–13:00 Uhr.',
'description' => 'Elektrofachbetrieb in Baden-Baden, seit über 35 Jahren. Elektroinstallation für Neu- und Altbau, Smart Home, Beratung und Planung sowie ein 24h-Notdienst unter 0151 25245851. Bürozeiten Mo–Fr 7:30–17:00 Uhr.',
'phone' => $buero, 'email' => $mail,
'street' => 'Ooser Hauptstr. 51', 'postalCode' => '76532', 'city' => 'Baden-Baden', 'country' => 'DE',
// Die Profile, die der bestehende Auftritt selbst verlinkt - einmal hier, gezeigt vom Baustein
@@ -851,6 +853,8 @@ $settings->save([
'instagram' => 'https://www.instagram.com/elektrobernhardgmbh/',
'google' => 'https://g.page/ElektroBernhardbadenbaden',
],
'hours' => array_fill_keys(['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'], ['opens' => '07:30', 'closes' => '17:00']),
'areaServed' => implode("\n", ['Baden-Baden', 'Sinzheim', 'Hügelsheim', 'Iffezheim', 'Bühl', 'Rastatt', 'Kuppenheim', 'Muggensturm', 'Gaggenau', 'Gernsbach', 'Murgtal', 'Ettlingen', 'Karlsruhe', 'Achern', 'Oberkirch', 'Offenburg']),
'localBusiness' => true, 'llmsTxt' => true,
// Der Kopfbereich schwebt über dem dunklen Seitenkopf und bleibt beim Scrollen oben.
'stickyHeader' => true, 'headerOverlay' => true,
+159 -5
View File
@@ -196,6 +196,34 @@ $symbol = static function (string $id, string $name, int $groesse, array $style
return ['id' => $id, 'type' => 'icon', 'props' => ['icon' => $name, 'size' => $groesse, 'decorative' => true, 'label' => ''], 'style' => $style];
};
/**
* Setzt die Einblendungen nach einer Liste, statt sie über das ganze Dokument zu streuen.
*
* Ein Block mit Einblendung wartet unsichtbar, bis er ins Bild scrollt; was beim Laden schon
* sichtbar ist, spielt sofort. Ohne JavaScript steht alles einfach da – die Seite bleibt
* vollständig, nur ohne Bewegung.
*
* @param array<string, array{0: string, 1?: string}> $plan Block-ID => [Art, Verzögerung]
*/
$einblenden = static function (array $dokument, array $plan): array {
$gehen = function (array $bloecke) use (&$gehen, $plan): array {
foreach ($bloecke as $i => $block) {
if (isset($plan[$block['id'] ?? ''])) {
[$art, $verzug] = [...$plan[$block['id']], 'none'];
$bloecke[$i]['layout'] = [...($block['layout'] ?? []), 'effects' => ['entrance' => $art, 'delay' => $verzug]];
}
if (isset($block['children'])) {
$bloecke[$i]['children'] = $gehen($block['children']);
}
}
return $bloecke;
};
$dokument['blocks'] = $gehen($dokument['blocks']);
return $dokument;
};
// Wiederkehrende Gestaltungswerte der Vorlage.
$serif = ['fontFamily' => 'heading', 'fontWeight' => '400', 'letterSpacing' => '-0.045em', 'lineHeight' => 1.1];
$h2Stil = ['desktop' => [...$serif, 'fontSize' => '53px', 'margin' => ['bottom' => '0px']], 'tablet' => ['fontSize' => '42px'], 'mobile' => ['fontSize' => '38px']];
@@ -269,7 +297,8 @@ $forms->save('kontakt', 'Kontaktanfrage', [
['name' => 'name', 'type' => 'text', 'label' => 'Ihr Name', 'required' => true],
['name' => 'email', 'type' => 'email', 'label' => 'E-Mail-Adresse', 'required' => true],
['name' => 'telefon', 'type' => 'phone', 'label' => 'Telefon', 'required' => false, 'help' => 'Für einen persönlichen Rückruf'],
['name' => 'nachricht', 'type' => 'textarea', 'label' => 'Ihre Nachricht', 'required' => true, 'help' => 'Erzählen Sie uns, was Ihnen wichtig ist.'],
['name' => 'nachricht', 'type' => 'textarea', 'label' => 'Ihre Nachricht', 'required' => true, 'help' => 'Erzählen Sie uns, was Ihnen wichtig ist. Bitte keine Angaben zu Gesundheit oder Pflegegrad – das besprechen wir lieber persönlich.'],
['name' => 'datenschutz', 'type' => 'consent', 'label' => 'Ich habe die Datenschutzhinweise gelesen. Meine Angaben werden verwendet, um meine Anfrage zu beantworten.'],
], ['recipient' => $mail, 'subject' => 'Neue Nachricht über tagespflege-moldovan.com', 'success' => 'Vielen Dank. Ihre Nachricht ist angekommen – wir melden uns bei Ihnen.', 'replyToField' => 'email'], 0);
echo "Formular angelegt: kontakt\n";
@@ -363,7 +392,10 @@ $fuss = [
$text('fuss-copyright', '© 2026 Tagespflege Jacqueline Moldovan', ['desktop' => ['fontSize' => '12px', 'margin' => ['bottom' => '0px']], 'mobile' => ['fontSize' => '11px']]),
]),
$column('fuss-hinweis', [
$text('fuss-hinweis-text', 'Gestaltungsentwurf · Beispieltexte & illustratives KI-Bild', ['desktop' => ['fontSize' => '12px', 'textAlign' => 'right', 'margin' => ['bottom' => '0px']], 'mobile' => ['fontSize' => '11px', 'textAlign' => 'left']]),
// Impressum und Datenschutz kommen aus den Einstellungen, nicht aus einem Menü.
['id' => 'fuss-rechtliches', 'type' => 'legal', 'props' => ['label' => 'Rechtliches'],
'style' => ['desktop' => ['fontSize' => '12px', 'justifyContent' => 'flex-end', 'gap' => '4px'], 'mobile' => ['justifyContent' => 'flex-start']],
'css' => "& a:hover{text-decoration:underline}"],
]),
], '20px', ['justifyContent' => 'space-between', 'alignItems' => 'flex-start', 'borderWidth' => $nurOben('1px'), 'borderStyle' => 'solid', 'borderColor' => '#e7ebe4', 'padding' => ['top' => '18px', 'bottom' => '18px'], 'color' => '#78817b'], ['flexDirection' => 'column', 'gap' => '7px']),
], [
@@ -376,6 +408,67 @@ $partials->create('header', 'default', 'Kopfbereich', $kopf);
$partials->create('footer', 'default', 'Fußbereich', $fuss);
echo "Kopf- und Fußbereich angelegt\n";
/**
* Eine Rechtsseite: Kleinzeile, Titel, Vorspann, dann Absätze mit Zwischenüberschriften.
*
* Stellen, die nur die Tagespflege selbst beantworten kann, stehen als „NOCH ZU PRÜFEN“ im Text,
* statt erfunden zu werden – eine falsche Registerangabe ist schlimmer als eine fehlende.
*/
$rechtsseite = static function (string $praefix, string $label, string $titel, string $vorspann, array $absaetze) use ($section, $abschnitt, $row, $column, $kleinzeile, $heading, $text, $serif, $emGruen, $nurOben, $nurUnten): array {
// Oben ein ruhiges Band in der Farbe des Angebotsbereichs: Kleinzeile, Titel, Vorspann.
// Die Sektion bleibt voll breit; die Breite begrenzt erst der Inhalt darin. So steht der
// Text auf derselben Kante wie Marke und Menü im Kopf, statt am Fensterrand zu kleben.
$kopf = $section($praefix.'-kopf', [
[...$kleinzeile($praefix.'-label', $label), 'layout' => ['effects' => ['entrance' => 'fade', 'delay' => 'none']]],
[...$heading($praefix.'-h1', $titel, 1, [
'desktop' => [...$serif, 'fontSize' => '59px', 'margin' => ['bottom' => '22px']],
'tablet' => ['fontSize' => '46px'],
'mobile' => ['fontSize' => '40px', 'margin' => ['bottom' => '16px']],
], $emGruen), 'layout' => ['effects' => ['entrance' => 'rise', 'delay' => 'short']]],
[...$text($praefix.'-vorspann', $vorspann, [
'desktop' => ['maxWidth' => '640px', 'fontSize' => '19px', 'lineHeight' => 1.7, 'color' => '@gedaempft', 'margin' => ['bottom' => '0px']],
'mobile' => ['fontSize' => '17px'],
]), 'layout' => ['effects' => ['entrance' => 'rise', 'delay' => 'medium']]],
], [
'desktop' => ['backgroundColor' => '@blass', 'borderWidth' => $nurUnten('1px'), 'borderStyle' => 'solid', 'borderColor' => '@linie', 'padding' => ['top' => '84px', 'bottom' => '72px']],
'tablet' => ['padding' => ['top' => '64px', 'bottom' => '56px']],
'mobile' => ['padding' => ['top' => '48px', 'bottom' => '40px']],
]);
// Darunter jeder Punkt als eigene Zeile: Zwischentitel links, Text rechts, getrennt durch
// eine feine Linie. Auf dem Telefon untereinander.
$punkte = [];
foreach ($absaetze as $i => [$zwischentitel, $inhalt]) {
$punkte[] = $row($praefix.'-punkt-'.$i, [
$column($praefix.'-punkt-'.$i.'-titel', '' === $zwischentitel ? [] : [
$heading($praefix.'-h2-'.$i, $zwischentitel, 2, [
'desktop' => ['fontFamily' => 'body', 'fontSize' => '17px', 'fontWeight' => '700', 'letterSpacing' => '-0.01em', 'lineHeight' => 1.5, 'color' => '@tinte', 'margin' => ['bottom' => '0px']],
]),
], [
'desktop' => ['flexBasis' => '280px', 'flexShrink' => 0],
'tablet' => ['flexBasis' => '220px'],
'mobile' => ['flexBasis' => 'auto'],
]),
$column($praefix.'-punkt-'.$i.'-text', [
$text($praefix.'-p-'.$i, $inhalt, [
'desktop' => ['fontSize' => '16px', 'lineHeight' => 1.75, 'color' => '@gedaempft', 'margin' => ['bottom' => '0px']],
], "& a{color:#2e7595;text-decoration:underline;text-underline-offset:3px}\n& a:hover{color:#245e79}"),
], ['desktop' => ['flexGrow' => 1, 'flexBasis' => '0', 'minWidth' => '0']]),
], [], [
'desktop' => ['display' => 'flex', 'alignItems' => 'flex-start', 'gap' => '48px', 'margin' => ['top' => '0px'],
'borderWidth' => $nurOben('1px'), 'borderStyle' => 'solid', 'borderColor' => '@linie', 'padding' => ['top' => '28px', 'bottom' => '28px']],
'tablet' => ['gap' => '32px'],
'mobile' => ['flexDirection' => 'column', 'gap' => '8px', 'padding' => ['top' => '22px', 'bottom' => '22px']],
]);
}
$inhalt = $abschnitt($praefix, [
$column($praefix.'-inhalt', $punkte, ['desktop' => ['maxWidth' => '960px']]),
], ['desktop' => ['padding' => ['top' => '56px', 'bottom' => '100px']], 'mobile' => ['padding' => ['top' => '28px', 'bottom' => '61px']]]);
return [$kopf, $inhalt];
};
// ---------------------------------------------------------------------------------------------
// Startseite
// ---------------------------------------------------------------------------------------------
@@ -658,7 +751,7 @@ $startseite = [
& .field-note{font-size:12px;color:#748078}
& .cms-button{width:100%;justify-content:center;border-radius:4px;margin-top:4px}",
],
$text('kontakt-formular-hinweis', 'Ihre Nachricht geht direkt an die Tagespflege. Wir verwenden Ihre Angaben ausschließlich, um Ihre Anfrage zu beantworten.', [
$text('kontakt-formular-hinweis', 'Ihre Nachricht geht direkt an die Tagespflege. Wir verwenden Ihre Angaben ausschließlich, um Ihre Anfrage zu beantworten – mehr dazu in den <a href="/datenschutz">Datenschutzhinweisen</a>.', [
'desktop' => ['fontSize' => '13px', 'lineHeight' => 1.65, 'color' => '#64736b', 'margin' => ['top' => '19px', 'bottom' => '0px']],
]),
], [
@@ -699,14 +792,75 @@ $anlegen = static function (string $slug, array $dokument, string $seoTitel = ''
return $id;
};
// Der Hero spielt beim Laden, alles Weitere beim Hereinscrollen. Gestaffelt, damit eine Zeile
// nacheinander erscheint statt auf einen Schlag.
$startseite = $einblenden($startseite, [
'hero-label' => ['fade'],
'hero-titel' => ['rise', 'short'],
'hero-intro' => ['rise', 'medium'],
'hero-aktionen' => ['rise', 'long'],
'hero-notiz' => ['fade', 'long'],
'hero-visual' => ['right', 'short'],
'werte-zeile' => ['fade'],
'vorstellung-titel' => ['rise'],
'vorstellung-text' => ['rise', 'short'],
'angebot-kopf' => ['rise'],
'angebot-1' => ['rise'],
'angebot-2' => ['rise', 'short'],
'angebot-3' => ['rise', 'medium'],
'tag-intro' => ['rise'],
'tag-schritt-1' => ['rise'],
'tag-schritt-2' => ['rise', 'short'],
'tag-schritt-3' => ['rise', 'medium'],
'tag-schritt-4' => ['rise', 'long'],
'kontakt-text' => ['rise'],
'kontakt-karte' => ['rise', 'short'],
]);
$anlegen('home', $startseite, 'Tagespflege Moldovan · Gemeinsam den Tag genießen', $medien['gemeinsam']['id']);
$anlegen('impressum', [
'schemaVersion' => $SCHEMA, 'title' => 'Impressum',
'description' => 'Anbieterangaben der Tagespflege Jacqueline Moldovan in Baden-Baden.',
'blocks' => [
...$rechtsseite('impressum', 'Rechtliche Angaben', 'Impressum', 'Angaben gemäß § 5 DDG und § 18 Abs. 2 MStV.', [
['Anbieterin', "Tagespflege Jacqueline Moldovan<br>Fremersbergstraße 75<br>76530 Baden-Baden<br><br>Vertreten durch Jacqueline Moldovan."],
['Kontakt', "Telefon: <a href=\"$telHref\">$telefon</a><br>E-Mail: <a href=\"mailto:$mail\">$mail</a>"],
['Rechtsform und Register', 'NOCH ZU PRÜFEN: Rechtsform, Registergericht und Registernummer ergänzen, sofern eine Eintragung besteht.'],
['Umsatzsteuer', 'NOCH ZU PRÜFEN: Umsatzsteuer-Identifikationsnummer eintragen oder auf die Steuerbefreiung für Pflegeleistungen nach § 4 Nr. 16 UStG hinweisen.'],
['Aufsichtsbehörde', 'NOCH ZU PRÜFEN: zuständige Aufsicht für die Tagespflege eintragen, in Baden-Baden üblicherweise die Heimaufsicht der Stadt. Ebenfalls zu ergänzen: Berufsbezeichnung und zuständige Kammer, sofern einschlägig, sowie ein bestehender Versorgungsvertrag nach § 72 SGB XI.'],
['Verantwortlich für den Inhalt', "Jacqueline Moldovan, Anschrift wie oben."],
['Verbraucherstreitbeilegung', 'Wir sind nicht bereit und nicht verpflichtet, an einem Streitbeilegungsverfahren vor einer Verbraucherschlichtungsstelle teilzunehmen.'],
['Bildnachweis', 'Porträt: Jacqueline Moldovan. Einstiegsbild: illustrative KI-Aufnahme, keine Abbildung tatsächlicher Gäste. Markenzeichen: eigene Gestaltung.'],
['Haftung für Links', 'Unser Angebot enthält Links zu externen Websites Dritter, auf deren Inhalte wir keinen Einfluss haben. Für diese Inhalte ist stets die jeweilige Anbieterin oder der jeweilige Anbieter verantwortlich. Bei Bekanntwerden von Rechtsverletzungen entfernen wir solche Links umgehend.'],
]),
],
], 'Impressum | Tagespflege Jacqueline Moldovan Baden-Baden');
$anlegen('datenschutz', [
'schemaVersion' => $SCHEMA, 'title' => 'Datenschutz',
'description' => 'Wie die Tagespflege Jacqueline Moldovan Daten beim Besuch der Website und bei einer Kontaktaufnahme verarbeitet.',
'blocks' => [
...$rechtsseite('datenschutz', 'Ihre Daten', 'Datenschutzhinweise', 'Hier erfahren Sie, welche Daten beim Besuch dieser Website und bei Ihrer Kontaktaufnahme verarbeitet werden – und welche Rechte Sie haben.', [
['1. Verantwortliche', "Tagespflege Jacqueline Moldovan, Fremersbergstraße 75, 76530 Baden-Baden. Telefon <a href=\"$telHref\">$telefon</a>, E-Mail <a href=\"mailto:$mail\">$mail</a>.<br><br>NOCH ZU PRÜFEN: Ob eine Datenschutzbeauftragte oder ein Datenschutzbeauftragter zu benennen ist, hängt von der Zahl der ständig mit der Verarbeitung beschäftigten Personen ab; gegebenenfalls hier die Kontaktdaten ergänzen."],
['2. Besuch dieser Website', 'Beim Aufruf verarbeitet der Hostingdienst technisch erforderliche Verbindungsdaten: IP-Adresse, Zeitpunkt, angeforderte Adresse, Browserangaben und HTTP-Status. Das dient der sicheren Bereitstellung und der Fehlersuche. Rechtsgrundlage ist unser berechtigtes Interesse an einem störungsfreien Betrieb, Art. 6 Abs. 1 lit. f DSGVO.<br><br>NOCH ZU PRÜFEN: Hostinganbieter benennen, Auftragsverarbeitungsvertrag abschließen, Verarbeitungsländer und die konkrete Speicherdauer der Serverprotokolle eintragen.'],
['3. Cookies, Schriften, externe Dienste', 'Diese Website setzt keine Analyse- oder Werbecookies. Bilder, Schriften und Gestaltung kommen vom eigenen Server; es werden keine Karten, Videos oder Schriften von Dritten nachgeladen. Deshalb gibt es auch keinen Einwilligungsdialog.'],
['4. Ihre Nachricht über das Kontaktformular', 'Wenn Sie uns schreiben, verarbeiten wir die von Ihnen angegebenen Kontakt- und Inhaltsdaten, um Ihre Anfrage zu beantworten. Rechtsgrundlage ist Art. 6 Abs. 1 lit. b DSGVO, wenn es um die Anbahnung einer Betreuung geht, sonst Art. 6 Abs. 1 lit. f DSGVO.<br><br>Bitte schildern Sie im Formular keine Gesundheitsangaben, keinen Pflegegrad und keine Diagnosen. Solche Angaben sind besonders geschützt (Art. 9 DSGVO); wir besprechen sie lieber persönlich oder am Telefon.'],
['5. Wie lange wir speichern', 'Anfragedaten löschen wir, sobald sie für die Beantwortung nicht mehr nötig sind und keine gesetzliche Aufbewahrungspflicht entgegensteht. Entsteht aus Ihrer Anfrage ein Betreuungsverhältnis, gelten für die dann anfallenden Unterlagen die gesetzlichen Fristen.'],
['6. Empfänger', 'Ihre Angaben erreichen die Tagespflege per E-Mail. Darüber hinaus geben wir sie nicht weiter, außer wir sind dazu gesetzlich verpflichtet.<br><br>NOCH ZU PRÜFEN: E-Mail-Anbieter und Hostingdienst als Auftragsverarbeiter benennen.'],
['7. Ihre Rechte', 'Sie haben unter den gesetzlichen Voraussetzungen das Recht auf Auskunft, Berichtigung, Löschung, Einschränkung der Verarbeitung und Datenübertragbarkeit. Einer Verarbeitung auf Grundlage von Art. 6 Abs. 1 lit. f DSGVO können Sie widersprechen. Eine erteilte Einwilligung können Sie jederzeit mit Wirkung für die Zukunft widerrufen.'],
['8. Beschwerderecht', 'Sie können sich bei einer Datenschutz-Aufsichtsbehörde beschweren, für uns beim Landesbeauftragten für den Datenschutz und die Informationsfreiheit Baden-Württemberg.'],
['', "Fragen zum Datenschutz beantworten wir gern unter <a href=\"mailto:$mail\">$mail</a>."],
]),
],
], 'Datenschutz | Tagespflege Jacqueline Moldovan');
$fehlerId = $anlegen('404', [
'schemaVersion' => $SCHEMA, 'title' => 'Seite nicht gefunden',
'description' => 'Die gesuchte Seite gibt es nicht oder sie wurde verschoben.',
'blocks' => [
$abschnitt('fehler', [
$kleinzeile('fehler-label', 'Fehler 404'),
[...$kleinzeile('fehler-label', 'Fehler 404'), 'layout' => ['effects' => ['entrance' => 'fade', 'delay' => 'none']]],
$heading('fehler-titel', 'Diese Seite<br><em>haben wir nicht.</em>', 1, [
'desktop' => [...$serif, 'fontSize' => '59px', 'margin' => ['bottom' => '25px']],
'mobile' => ['fontSize' => '40px'],
@@ -744,7 +898,7 @@ $settings->save([
'stickyHeader' => true, 'headerOverlay' => false,
'motion' => 'always',
'faviconMediaId' => $medien['marke']['id'],
'homePath' => 'home',
'homePath' => 'home', 'imprintPath' => 'impressum', 'privacyPath' => 'datenschutz',
'consentBanner' => false, 'scrollTop' => false, 'postMetaHeader' => true,
]);
echo "Einstellungen gespeichert\n";
+31
View File
@@ -172,8 +172,39 @@ final class Consent
'decided' => null !== $decision,
'decidedAt' => $decision['at'] ?? null,
'text' => $settings['consentText'],
'title' => $settings['consentTitle'],
'layout' => $settings['consentLayout'],
'privacyPath' => $settings['privacyPath'],
'imprintPath' => $settings['imprintPath'],
];
}
/**
* Die Gestaltung des Hinweises als CSS-Variablen für den Kopf der Seite.
*
* Das Stylesheet kennt die Standardwerte; hier stehen nur die Abweichungen, die jemand in den
* Einstellungen gewählt hat. Die Form bestimmt zwei Radien auf einmal - Fläche und Knöpfe
* gehören zusammen, und zwei Regler dafür wären zwei Regler, die man gegeneinander verstellt.
*/
public function styles(array $theme): string
{
$settings = $this->settings->load();
if (!$settings['consentBanner']) {
return '';
}
[$box, $button] = match ($settings['consentShape']) {
'rund' => ['28px', '999px'],
'eckig' => ['0', '0'],
default => ['18px', '10px'],
};
$values = ['--kant-consent-radius:'.$box, '--kant-consent-button-radius:'.$button];
foreach (['consentColor' => '--kant-consent-bg', 'consentInk' => '--kant-consent-ink', 'consentAccent' => '--kant-consent-accent', 'consentAccentInk' => '--kant-consent-accent-ink'] as $field => $variable) {
$value = Theme::cssColor((string) $settings[$field], $theme);
if (null !== $value) {
$values[] = $variable.':'.$value;
}
}
return ':root{'.implode(';', $values).'}';
}
}
+5
View File
@@ -251,6 +251,11 @@ final class DocumentValidator
if ('spacer' === $type) {
$this->require(in_array($props['size'] ?? null, self::SPACER_SIZES, true), 'Unknown spacer size.');
}
if ('accordion' === $type && array_key_exists('faq', $props)) {
// Ein Akkordeon ist nicht automatisch eine FAQ; erst die Kennzeichnung macht aus den
// Einträgen Frage-Antwort-Paare in den strukturierten Daten.
$this->require($schemaVersion >= 23 && is_bool($props['faq']), 'Die FAQ-Kennzeichnung ist an oder aus und braucht Schema v23.');
}
if ('accordionitem' === $type) {
$this->text($props['title'] ?? null, 160);
$this->require(is_bool($props['open'] ?? false), 'The open state is a boolean.');
+6 -4
View File
@@ -108,9 +108,11 @@ final class FontLibrary
/**
* Die Dateien, die für den ersten Eindruck vorab geholt werden sollen.
*
* Nur der lateinische Grundbereich und nur die Schnitte, die im Fließtext und in
* Überschriften stehen - ein Vorabholen, das alles holt, verzögert genau das, was es
* beschleunigen soll.
* Jeder Schnitt, den das Theme nennt, im lateinischen Grundbereich. Die früheren „ersten
* zwei je Familie“ ließen genau den Schnitt aus, der die Überschriften trägt: Lato 900 lud
* erst nach dem Stylesheet, und mit `font-display:swap` sprang die Überschrift sichtbar von
* der Ersatzschrift auf die richtige. Die erweiterten Bereiche bleiben draußen - sie werden
* nur für Zeichen gebraucht, die auf den meisten Seiten nicht vorkommen.
*
* @return list<string>
*/
@@ -118,7 +120,7 @@ final class FontLibrary
{
$preload = [];
foreach ($this->wanted($theme) as $family => $weights) {
foreach (array_slice($weights, 0, 2) as $weight) {
foreach ($weights as $weight) {
$name = $this->slug($family).'-'.$weight.'-latin.woff2';
if (is_file($this->directory.'/'.$name)) {
$preload[] = '/assets/fonts/'.$name;
+108
View File
@@ -27,6 +27,10 @@ final class SiteSettings
// Die sozialen Profile, je Netzwerk eine Adresse (siehe SocialProfiles). Der Baustein
// `social` zeigt sie an; die strukturierten Daten führen sie als sameAs mit.
'social' => [],
// Öffnungszeiten je Wochentag (opens/closes als HH:MM) und das Einsatzgebiet als Liste
// von Ortsnamen. Beides landet in LocalBusiness, weil eine Suchmaschine sonst rät.
'openingHours' => [],
'areaServed' => [],
'localBusiness' => false,
'llmsTxt' => false,
// Der Kopfbereich bleibt beim Scrollen oben stehen. Eine Eigenschaft der Website und
@@ -71,14 +75,86 @@ final class SiteSettings
'consentBanner' => false,
'consentGroups' => ['external'],
'consentText' => '',
// Sein Aussehen: Anordnung, Form, Farben, Überschrift. Leer heißt Theme-Standard.
'consentLayout' => 'karte',
'consentShape' => 'weich',
'consentTitle' => '',
'consentColor' => '',
'consentInk' => '',
'consentAccent' => '',
'consentAccentInk' => '',
'privacyPath' => '',
'imprintPath' => '',
];
/** Die Wochentage, wie schema.org sie nennt, mit deutscher Beschriftung für das Formular. */
public const DAYS = ['Monday' => 'Montag', 'Tuesday' => 'Dienstag', 'Wednesday' => 'Mittwoch', 'Thursday' => 'Donnerstag', 'Friday' => 'Freitag', 'Saturday' => 'Samstag', 'Sunday' => 'Sonntag'];
public function __construct(private Connection $db, private MediaLibrary $media)
{
}
/**
* Die Öffnungszeiten aus dem Formular: je Tag ein Paar aus Öffnen und Schließen; ein Tag ohne
* beide Angaben gilt als geschlossen und fehlt in der Liste.
*
* @return list<array{day: string, opens: string, closes: string}>
*/
private function openingHours(mixed $input): array
{
$hours = [];
if (is_array($input) && array_is_list($input)) {
// Die gespeicherte Form: eine Liste von {day, opens, closes} wird zur Formularform.
$map = [];
foreach ($input as $row) {
if (is_array($row) && isset($row['day'])) {
$map[(string) $row['day']] = ['opens' => $row['opens'] ?? '', 'closes' => $row['closes'] ?? ''];
}
}
$input = $map;
}
foreach (self::DAYS as $day => $label) {
$row = is_array($input) && is_array($input[$day] ?? null) ? $input[$day] : [];
$opens = trim((string) ($row['opens'] ?? ''));
$closes = trim((string) ($row['closes'] ?? ''));
if ('' === $opens && '' === $closes) {
continue;
}
foreach ([$opens, $closes] as $time) {
if (1 !== preg_match('/^([01]\d|2[0-3]):[0-5]\d$/D', $time)) {
throw new InvalidPage(sprintf('Die Öffnungszeit für %s braucht Öffnen und Schließen als Uhrzeit wie 07:30.', $label));
}
}
if ($opens >= $closes) {
throw new InvalidPage(sprintf('%s: die Schließzeit muss nach der Öffnungszeit liegen.', $label));
}
$hours[] = ['day' => $day, 'opens' => $opens, 'closes' => $closes];
}
return $hours;
}
/** Das Einsatzgebiet: ein Ortsname je Zeile, höchstens vierzig. */
private function areaServed(string $input): array
{
$places = [];
foreach (preg_split('/[\r\n,]+/', $input) ?: [] as $place) {
$place = trim($place);
if ('' === $place) {
continue;
}
if (mb_strlen($place) > 80 || 1 === preg_match('/[<>"]/', $place)) {
throw new InvalidPage(sprintf('„%s“ ist kein Ortsname.', mb_substr($place, 0, 40)));
}
$places[] = $place;
}
if (count($places) > 40) {
throw new InvalidPage('Mehr als vierzig Orte im Einsatzgebiet sind nicht vorgesehen.');
}
return array_values(array_unique($places));
}
/**
* Remembered for the length of one request.
*
@@ -137,6 +213,14 @@ final class SiteSettings
}
$values['sameAs'] = array_slice(array_unique($values['sameAs']), 0, 20);
$values['social'] = SocialProfiles::clean($input['social'] ?? []);
// Zwei Formen kommen hier an: die des Formulars (hours[Monday][opens], Orte als Text) und
// die gespeicherte (openingHours als Liste, areaServed als Liste), wenn ein anderer Bildschirm
// die geladenen Werte unverändert zurückgibt. Beide müssen dasselbe ergeben, sonst löscht
// das Anlegen der Rechtsseiten die Öffnungszeiten.
$values['openingHours'] = $this->openingHours($input['hours'] ?? $input['openingHours'] ?? []);
$areaInput = $input['areaServed'] ?? '';
$values['areaServed'] = $this->areaServed(is_array($areaInput) ? implode('
', array_map('strval', $areaInput)) : (string) $areaInput);
$values['localBusiness'] = (bool) ($input['localBusiness'] ?? false);
if ($values['localBusiness'] && ('' === $values['street'] || '' === $values['city'])) {
throw new InvalidPage('Ein lokales Unternehmen braucht mindestens Straße und Ort.');
@@ -227,6 +311,16 @@ final class SiteSettings
array_map(static fn (mixed $group): string => (string) $group, (array) ($input['consentGroups'] ?? [])),
));
$values['consentText'] = mb_substr(trim((string) ($input['consentText'] ?? '')), 0, 600);
$values['consentLayout'] = in_array($input['consentLayout'] ?? '', ['karte', 'leiste', 'ecke'], true) ? $input['consentLayout'] : 'karte';
$values['consentShape'] = in_array($input['consentShape'] ?? '', ['weich', 'rund', 'eckig'], true) ? $input['consentShape'] : 'weich';
$values['consentTitle'] = mb_substr(trim((string) ($input['consentTitle'] ?? '')), 0, 80);
foreach (['consentColor', 'consentInk', 'consentAccent', 'consentAccentInk'] as $feld) {
$farbe = trim((string) ($input[$feld] ?? ''));
if ('' !== $farbe && 1 !== preg_match(StyleSchema::COLOR, $farbe)) {
throw new InvalidPage('Die Farben des Einwilligungshinweises werden als #1a2b3c oder als @schlüssel aus der Palette angegeben.');
}
$values[$feld] = $farbe;
}
foreach (['privacyPath', 'imprintPath'] as $key) {
$path = trim(trim((string) ($input[$key] ?? '')), '/');
if ('' !== $path && 1 !== preg_match('#^[a-z0-9]+(?:[-/][a-z0-9]+)*$#D', $path)) {
@@ -363,6 +457,20 @@ final class SiteSettings
if ([] !== $sameAs) {
$data['sameAs'] = $sameAs;
}
// Tage mit denselben Zeiten werden zu einer Angabe: Mo-Fr 07:30-17:00 ist eine Zeile,
// nicht fünf. Das ist die Form, die Google für openingHoursSpecification dokumentiert.
$gruppen = [];
foreach ($settings['openingHours'] ?? [] as $eintrag) {
$schluessel = $eintrag['opens'].'-'.$eintrag['closes'];
$gruppen[$schluessel] ??= ['@type' => 'OpeningHoursSpecification', 'dayOfWeek' => [], 'opens' => $eintrag['opens'], 'closes' => $eintrag['closes']];
$gruppen[$schluessel]['dayOfWeek'][] = $eintrag['day'];
}
if ([] !== $gruppen) {
$data['openingHoursSpecification'] = array_values($gruppen);
}
if ([] !== ($settings['areaServed'] ?? [])) {
$data['areaServed'] = $settings['areaServed'];
}
return $data;
}
+23 -15
View File
@@ -269,6 +269,29 @@ final class Theme
}
/** The stylesheet every page carries: palette variables, font variables and base typography. */
/**
* Eine Farbe aus den Einstellungen als CSS-Wert: `@schlüssel` wird zur Palettenvariablen,
* ein Hexwert bleibt, und leer heißt "nicht gesetzt" - dann gilt der Standard des Stylesheets.
* Ein Schlüssel, den die Palette nicht kennt, wird ebenfalls zu null: lieber der Standard als
* eine Variable, die auf nichts zeigt.
*/
public static function cssColor(string $value, array $theme): ?string
{
if ('' === $value) {
return null;
}
if (!str_starts_with($value, '@')) {
return $value;
}
foreach ($theme['colors'] as $color) {
if ($color['key'] === substr($value, 1)) {
return sprintf('var(--k-%s)', $color['key']);
}
}
return null;
}
public function css(array $theme): string
{
$variables = [];
@@ -329,19 +352,4 @@ final class Theme
).ButtonDesign::css($theme['buttons'] ?? ButtonDesign::defaults($base));
}
/**
* The Google Fonts stylesheet for every family that comes from there, or null when none does.
* Chosen by the user; it means one request to a third party per page view.
*/
public function googleFontsUrl(array $theme): ?string
{
$families = [];
foreach ($theme['fonts'] as $font) {
if ('google' === $font['source'] && '' !== $font['family']) {
$families[] = sprintf('family=%s:wght@%s', str_replace(' ', '+', $font['family']), implode(';', $font['weights']));
}
}
return [] === $families ? null : 'https://fonts.googleapis.com/css2?'.implode('&', array_unique($families)).'&display=swap';
}
}
+9 -3
View File
@@ -4,6 +4,7 @@ namespace App\Controller;
use App\Content\Consent;
use App\Content\SiteSettings;
use App\Content\Theme;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\HttpFoundation\Response;
@@ -19,7 +20,7 @@ use Symfony\Component\Routing\Attribute\Route;
*/
final class ConsentController extends AbstractController
{
public function __construct(private Consent $consent, private SiteSettings $settings)
public function __construct(private Consent $consent, private SiteSettings $settings, private Theme $theme)
{
}
@@ -46,16 +47,21 @@ final class ConsentController extends AbstractController
}
// Deliberately without header and footer: this is a page about a decision, not a page of
// the website, and it must work even when an area is broken.
// Palette und Hinweisfarben wie auf den Seiten, damit die Entscheidung hier aussieht wie
// die Frage dort. Das Stylesheet ist ueber seinen Hash erlaubt, nichts weiter.
$theme = $this->theme->load();
$styles = $this->theme->css($theme).$this->consent->styles($theme);
$response = $this->render('consent.html.twig', [
'consent' => $this->consent->state($request),
'settings' => $this->settings->load(),
'pageStyles' => $styles,
]);
$response->headers->set('Cache-Control', 'no-store');
$response->headers->set('X-Robots-Tag', 'noindex, follow');
$response->headers->set('X-Content-Type-Options', 'nosniff');
$response->headers->set('Referrer-Policy', 'strict-origin-when-cross-origin');
// The page carries no embeds and no own styles, so it keeps the strictest policy.
$response->headers->set('Content-Security-Policy', "default-src 'self'; script-src 'none'; style-src 'self'; img-src 'self' https: data:; object-src 'none'; base-uri 'none'; frame-ancestors 'none'; form-action 'self'");
// The page carries no embeds, so it keeps the strictest policy - plus the one hashed style block.
$response->headers->set('Content-Security-Policy', sprintf("default-src 'self'; script-src 'none'; style-src 'self' 'sha256-%s'; img-src 'self' https: data:; object-src 'none'; base-uri 'none'; frame-ancestors 'none'; form-action 'self'", base64_encode(hash('sha256', $styles, true))));
return $response;
}
+3 -2
View File
@@ -5,6 +5,7 @@ namespace App\Controller;
use App\Content\CustomCode;
use App\Content\DemoContent;
use App\Content\DocumentValidator;
use App\Content\FontLibrary;
use App\Content\MenuRepository;
use App\Content\PageRepository;
use App\Content\PartialRepository;
@@ -28,7 +29,7 @@ use Symfony\Component\Security\Csrf\CsrfTokenManagerInterface;
#[Route('/%kant.admin_path%')]
final class EditorController extends AbstractController
{
public function __construct(private PageRepository $pages, private DocumentValidator $validator, private MenuRepository $menus, private PostRepository $posts, private Theme $theme, private StyleCompiler $styles, private RedirectRepository $redirects, private PartialRepository $partials, private CustomCode $code, private CsrfTokenManagerInterface $csrf, private RequestStack $requests)
public function __construct(private PageRepository $pages, private DocumentValidator $validator, private MenuRepository $menus, private PostRepository $posts, private Theme $theme, private StyleCompiler $styles, private RedirectRepository $redirects, private PartialRepository $partials, private CustomCode $code, private FontLibrary $fonts, private CsrfTokenManagerInterface $csrf, private RequestStack $requests)
{
}
@@ -435,7 +436,7 @@ final class EditorController extends AbstractController
$navigation[$slot] = $this->menus->resolve($menu['items'], (string) $page['path']);
}
return $this->render('page.html.twig', ['page' => [...$page, 'document' => $document], 'canonical' => '', 'editing' => true, 'navigation' => $navigation, 'areas' => $areas, 'sections' => $sections, 'needsTabs' => false, 'pageStyles' => $this->theme->css($theme).$this->styles->compileDocument($document), 'googleFonts' => $this->theme->googleFontsUrl($theme)]);
return $this->render('page.html.twig', ['page' => [...$page, 'document' => $document], 'canonical' => '', 'editing' => true, 'navigation' => $navigation, 'areas' => $areas, 'sections' => $sections, 'needsTabs' => false, 'pageStyles' => $this->theme->css($theme).$this->styles->compileDocument($document), 'localFonts' => $this->fonts->hasLocal($theme) ? $this->fonts->preload($theme) : []]);
}
if (!isset($body['expectedVersion']) || !is_int($body['expectedVersion']) || $body['expectedVersion'] < 0) {
throw new \InvalidArgumentException();
+46 -35
View File
@@ -70,8 +70,6 @@ final class PageController extends AbstractController
private function renderPage(Request $request, array $page, string $path, int $status = 200): Response
{
$styles = '';
$googleFonts = null;
$localFonts = [];
// The page decides which header and footer it gets - including none.
$areas = $this->areas($status >= 400 ? null : $page);
$theme = $this->theme->load();
@@ -84,17 +82,15 @@ final class PageController extends AbstractController
// for the small script that marks the page as scrolled.
// Den Nach-oben-Knopf blendet dasselbe Skript ein; ohne es bleibt er dauerhaft sichtbar.
$needsScrolled = (isset($areas['header']) && $this->hasScrolled($areas['header'])) || (bool) ($this->settings->load()['scrollTop'] ?? false);
$styles = $this->theme->css($theme).$this->scrollTopStyles($this->settings->load(), $theme).$this->styles->compileDocument($page['document']).$this->code->compileDocument($page['document']);
$styles = $this->theme->css($theme).$this->scrollTopStyles($this->settings->load(), $theme).$this->consent->styles($theme).$this->styles->compileDocument($page['document']).$this->code->compileDocument($page['document']);
foreach ([...array_values($areas), ...array_values($sections)] as $extra) {
$styles .= $this->styles->compileDocument($extra).$this->code->compileDocument($extra);
}
// Liegen die Schriften auf dem eigenen Server, wird nichts von Google geholt - weder
// die Datei noch die IP-Adresse des Besuchers.
if ($this->fonts->hasLocal($theme)) {
$localFonts = $this->fonts->preload($theme);
} else {
$googleFonts = $this->theme->googleFontsUrl($theme);
}
// Schriften kommen ausschliesslich vom eigenen Server. Fehlen die Dateien, zeigt die
// Website die Ersatzschrift des Themes - nie ein Stylesheet von fonts.googleapis.com:
// das gaebe die IP-Adresse jedes Besuchers an einen Dritten weiter und haengt den
// Seitenaufbau an zwei fremde Verbindungen nacheinander.
$localFonts = $this->fonts->hasLocal($theme) ? $this->fonts->preload($theme) : [];
$response = $this->render('page.html.twig', [
'page' => $page,
'canonical' => $status >= 400 ? null : rtrim($this->siteOrigin, '/').$this->settings->publicPath($path, $this->settings->homePath()),
@@ -133,7 +129,6 @@ final class PageController extends AbstractController
// ist gar kein Bild, sondern der Hintergrund des ersten Abschnitts.
'heroBackground' => $this->heroBackground($areas['header'] ?? null, $page['document']),
'pageStyles' => $styles,
'googleFonts' => $googleFonts,
'localFonts' => $localFonts,
'styleBundle' => $this->bundle->url([] !== $localFonts),
], new Response(status: $status));
@@ -151,7 +146,7 @@ final class PageController extends AbstractController
$response->headers->set('X-Robots-Tag', 'noindex, follow');
}
return $this->shell($response, $wantsScript, $styles, null !== $googleFonts, $frames);
return $this->shell($response, $wantsScript, $styles, $frames);
}
/**
@@ -167,18 +162,15 @@ final class PageController extends AbstractController
* Nothing is added to the policy for an embed still waiting
* for consent.
*/
private function shell(Response $response, bool $allowScript = false, string $styles = '', bool $googleFonts = false, array $frameHosts = []): Response
private function shell(Response $response, bool $allowScript = false, string $styles = '', array $frameHosts = []): Response
{
$styleSources = ["'self'"];
if ('' !== $styles) {
$styleSources[] = sprintf("'sha256-%s'", base64_encode(hash('sha256', $styles, true)));
}
// Stylesheets und Schriftdateien kommen nur von hier. Kein fonts.googleapis.com, kein
// fonts.gstatic.com - die Regel steht in der Kopfzeile und nicht nur in der Vorlage.
$fontSources = ["'self'"];
if ($googleFonts) {
// Chosen deliberately: the stylesheet comes from Google and the files from its CDN.
$styleSources[] = 'https://fonts.googleapis.com';
$fontSources[] = 'https://fonts.gstatic.com';
}
$response->headers->set('Cache-Control', 'no-store');
$response->headers->set('X-Content-Type-Options', 'nosniff');
$response->headers->set('Referrer-Policy', 'strict-origin-when-cross-origin');
@@ -257,6 +249,29 @@ final class PageController extends AbstractController
*
* @return list<array{name: string, href: string}>
*/
/** @return list<array<string, mixed>> */
private function faqEntries(array $blocks): array
{
$entries = [];
foreach ($blocks as $block) {
if ('accordion' === ($block['type'] ?? null) && true === ($block['props']['faq'] ?? false)) {
foreach ($block['children'] ?? [] as $item) {
$texts = array_filter($item['children'] ?? [], static fn (array $child): bool => 'text' === ($child['type'] ?? null));
$answer = trim(implode("\n\n", array_map(
static fn (array $child): string => trim(html_entity_decode(strip_tags(preg_replace('#<br\s*/?>|</p>#i', "\n", (string) ($child['props']['text'] ?? '')) ?? ''), ENT_QUOTES | ENT_HTML5, 'UTF-8')),
$texts,
)));
if ('' !== $answer && '' !== trim((string) ($item['props']['title'] ?? ''))) {
$entries[] = ['@type' => 'Question', 'name' => $item['props']['title'], 'acceptedAnswer' => ['@type' => 'Answer', 'text' => $answer]];
}
}
}
$entries = [...$entries, ...$this->faqEntries($block['children'] ?? [])];
}
return $entries;
}
private function breadcrumbs(array $page): array
{
if ($page['path'] === $this->settings->homePath()) {
@@ -293,21 +308,6 @@ final class PageController extends AbstractController
if (!($settings['scrollTop'] ?? false)) {
return '';
}
$farbe = static function (string $wert) use ($theme): ?string {
if ('' === $wert) {
return null;
}
if (!str_starts_with($wert, '@')) {
return $wert;
}
foreach ($theme['colors'] as $eintrag) {
if ($eintrag['key'] === substr($wert, 1)) {
return sprintf('var(--k-%s)', $eintrag['key']);
}
}
return null;
};
$werte = [sprintf('--kant-top-size:%dpx', (int) ($settings['scrollTopSize'] ?? 48))];
$werte[] = sprintf('--kant-top-radius:%s', match ($settings['scrollTopShape'] ?? 'rund') {
'eckig' => '0',
@@ -316,7 +316,7 @@ final class PageController extends AbstractController
});
$werte[] = sprintf('--kant-top-after:%dpx', (int) ($settings['scrollTopAfter'] ?? 400));
foreach (['scrollTopColor' => '--kant-top-bg', 'scrollTopInk' => '--kant-top-ink'] as $feld => $variable) {
$wert = $farbe((string) ($settings[$feld] ?? ''));
$wert = Theme::cssColor((string) ($settings[$feld] ?? ''), $theme);
if (null !== $wert) {
$werte[] = $variable.':'.$wert;
}
@@ -382,6 +382,12 @@ final class PageController extends AbstractController
}
$blocks[] = $article;
}
// Ein als FAQ gekennzeichnetes Akkordeon wird zur FAQPage: die Titel sind die Fragen, die
// Textbausteine im Eintrag die Antwort. Nur was auf der Seite steht, steht auch hier.
$fragen = $this->faqEntries($page['document']['blocks'] ?? []);
if ([] !== $fragen) {
$blocks[] = ['@context' => 'https://schema.org', '@type' => 'FAQPage', 'mainEntity' => $fragen];
}
$trail = $this->breadcrumbs($page);
if (count($trail) > 1) {
$blocks[] = [
@@ -493,8 +499,13 @@ final class PageController extends AbstractController
$areas = $this->areas();
$frames = $this->frameHosts($request, ...array_values($areas));
$needsScrolled = isset($areas['header']) && $this->hasScrolled($areas['header']);
// Palette und Hinweisfarben wie auf jeder Seite - das Archiv trug bisher weder das eine
// noch das andere und zeigte den Einwilligungshinweis in den Standardfarben.
$theme = $this->theme->load();
$styles = $this->theme->css($theme).$this->consent->styles($theme);
return $this->shell($this->render('archive.html.twig', [
'pageStyles' => $styles,
'areas' => $areas,
'needsScrolled' => $needsScrolled,
'navigation' => $this->navigation(''),
@@ -504,7 +515,7 @@ final class PageController extends AbstractController
'base' => $base,
'canonical' => rtrim($this->siteOrigin, '/').$base.($result['page'] > 1 ? '?seite='.$result['page'] : ''),
'navigation' => $this->navigation(''),
]), $needsScrolled, frameHosts: $frames);
]), $needsScrolled, $styles, $frames);
}
#[Route('/feed.xml', name: 'feed', methods: ['GET'])]
+3 -1
View File
@@ -4,6 +4,7 @@ namespace App\Controller;
use App\Content\CustomCode;
use App\Content\DocumentValidator;
use App\Content\FontLibrary;
use App\Content\MenuRepository;
use App\Content\PartialRepository;
use App\Content\StyleCompiler;
@@ -35,6 +36,7 @@ final class PartialController extends AbstractController
private Theme $theme,
private StyleCompiler $styles,
private CustomCode $code,
private FontLibrary $fonts,
private CsrfTokenManagerInterface $csrf,
) {
}
@@ -175,7 +177,7 @@ final class PartialController extends AbstractController
'needsTabs' => false,
'forms' => [],
'pageStyles' => $this->theme->css($theme).$this->styles->compileDocument($document),
'googleFonts' => $this->theme->googleFontsUrl($theme),
'localFonts' => $this->fonts->hasLocal($theme) ? $this->fonts->preload($theme) : [],
]);
}
+1
View File
@@ -49,6 +49,7 @@ final class SettingsController extends AbstractController
// Fuer die Farbfelder: dieselbe Palette, die auch der Editor anbietet.
'palette' => $this->theme->load()['colors'],
'socialNetworks' => SocialProfiles::NETWORKS,
'weekdays' => SiteSettings::DAYS,
'socialPlaceholders' => SocialProfiles::PLACEHOLDERS,
]);
}
@@ -51,12 +51,12 @@ final class AdminHeadersSubscriber implements EventSubscriberInterface
$headers->set('X-Content-Type-Options', 'nosniff');
$headers->set('Referrer-Policy', 'same-origin');
$headers->set('Permissions-Policy', 'accelerometer=(), camera=(), display-capture=(), geolocation=(), gyroscope=(), microphone=(), payment=(), usb=()');
// The preview must show the same typeface as the published page, so the font hosts are
// allowed here as well. Everything else stays as narrow as on the public side.
// Die Vorschau zeigt dieselbe Schrift wie die veroeffentlichte Seite - und die liegt,
// genau wie dort, auf diesem Server. Fremde Schrifthosts braucht sie nicht.
// The nonce only ever adds the one script it names; 'self' keeps applying to everything
// else, so nothing is loosened by it.
$nonce = $event->getRequest()->attributes->get('csp_nonce');
$script = is_string($nonce) && '' !== $nonce ? sprintf("'self' 'nonce-%s'", $nonce) : "'self'";
$headers->set('Content-Security-Policy', "default-src 'self'; script-src {$script}; style-src 'self' https://fonts.googleapis.com; font-src 'self' https://fonts.gstatic.com; img-src 'self' https:; object-src 'none'; base-uri 'none'; frame-ancestors 'none'; form-action 'self'");
$headers->set('Content-Security-Policy', "default-src 'self'; script-src {$script}; style-src 'self'; font-src 'self'; img-src 'self' https:; object-src 'none'; base-uri 'none'; frame-ancestors 'none'; form-action 'self'");
}
}
+51 -5
View File
@@ -2,25 +2,71 @@
namespace App\Twig;
use App\Content\FontLibrary;
use App\Content\Theme;
use App\Ops\Updater;
use Twig\Extension\AbstractExtension;
use Twig\TwigFunction;
/**
* The running version, for the administration shell.
* Fassung und offene Hinweise für die Verwaltungshülle.
*
* A function rather than a global, so the templates get exactly this one read-only answer and not
* a whole updater with an update() method on it.
* Funktionen statt Variablen, damit die Vorlagen genau diese Antworten bekommen und nicht einen
* ganzen Updater mit einem update() daran.
*/
final class VersionExtension extends AbstractExtension
{
public function __construct(private Updater $updater, private \Doctrine\DBAL\Connection $db)
public function __construct(private Updater $updater, private \Doctrine\DBAL\Connection $db, private FontLibrary $fonts, private Theme $theme)
{
}
public function getFunctions(): array
{
return [new TwigFunction('kant_version', $this->updater->version(...)), new TwigFunction('kant_update_version', $this->available(...))];
return [
new TwigFunction('kant_version', $this->updater->version(...)),
new TwigFunction('kant_update_version', $this->available(...)),
new TwigFunction('kant_admin_notices', $this->notices(...)),
];
}
/**
* Was auf jedem Verwaltungsbildschirm oben stehen soll, weil es einen Knopf braucht.
*
* Keine Zeile davon geht ins Netz: die verfügbare Fassung steht im Protokoll der täglichen
* Aufgabe, die fehlenden Schriften stehen als Dateien im Ordner. Ein Hinweis, der bei jedem
* Klick eine fremde Verbindung öffnet, wäre die Sorte Hinweis, die man abschaltet.
*
* @return list<array{kind: string, text: string, route: string, action: string, admin: bool}>
*/
public function notices(): array
{
$notices = [];
if (null !== $version = $this->available()) {
$notices[] = [
'kind' => 'update',
'text' => sprintf('Fassung %s ist verfügbar; installiert ist %s.', $version, $this->updater->version()),
'route' => 'admin_system',
'action' => 'Jetzt aktualisieren',
'admin' => true,
];
}
try {
$missing = $this->fonts->missing($this->theme->load());
} catch (\Throwable) {
// Eine Installation, die noch auf ihre Migrationen wartet, hat noch kein Theme.
$missing = [];
}
if ([] !== $missing) {
$notices[] = [
'kind' => 'fonts',
'text' => sprintf('Schriftdateien fehlen auf diesem Server: %s. Bis dahin zeigt die Website die Ersatzschrift.', implode(', ', $missing)),
'route' => 'admin_theme',
'action' => 'Schriften holen',
'admin' => false,
];
}
return $notices;
}
public function available(): ?string
+60
View File
@@ -108,6 +108,22 @@
{% endfor %}
</div>
</fieldset>
<fieldset class="field-set">
<legend>Öffnungszeiten</legend>
<p class="field-help">Als Uhrzeit wie 07:30. Ein Tag ohne Angabe gilt als geschlossen. Erscheint als <code>openingHoursSpecification</code> in den strukturierten Daten – der Text auf der Website ist davon unabhängig.</p>
<div class="fields">
{% for day, label in weekdays %}
{% set row = (settings.openingHours|filter(h => h.day == day)|first) ?: {opens: '', closes: ''} %}
<div>
<label for="hours-{{ day }}-opens">{{ label }}</label>
<div class="hours-row"><input id="hours-{{ day }}-opens" name="hours[{{ day }}][opens]" type="time" value="{{ row.opens }}" aria-label="{{ label }}, öffnet"> <span aria-hidden="true">–</span> <input id="hours-{{ day }}-closes" name="hours[{{ day }}][closes]" type="time" value="{{ row.closes }}" aria-label="{{ label }}, schließt"></div>
</div>
{% endfor %}
</div>
</fieldset>
<label for="areaServed">Einsatzgebiet</label>
<textarea id="areaServed" name="areaServed" rows="3" placeholder="Baden-Baden&#10;Rastatt&#10;Karlsruhe">{{ settings.areaServed|join('\n') }}</textarea>
<p class="field-help">Ein Ort je Zeile, höchstens vierzig. Erscheint als <code>areaServed</code> in den strukturierten Daten.</p>
<label class="check-label" for="localBusiness"><input id="localBusiness" name="localBusiness" type="checkbox" value="1"{{ settings.localBusiness ? ' checked' : '' }}> Als lokales Unternehmen auszeichnen</label>
<p class="field-help">Braucht mindestens Straße und Ort. Sinnvoll bei einem Standort mit Kundenverkehr.</p>
<label class="check-label" for="llmsTxt"><input id="llmsTxt" name="llmsTxt" type="checkbox" value="1"{{ settings.llmsTxt ? ' checked' : '' }}> <code>llms.txt</code> ausliefern</label>
@@ -198,6 +214,50 @@
<label for="consentText">Text im Hinweis</label>
<textarea id="consentText" name="consentText" rows="3" maxlength="600">{{ settings.consentText }}</textarea>
<p class="field-help">Leer lassen für den Standardtext. Er soll sagen, was geladen wird und was ohne Zustimmung passiert – nicht zum Klicken drängen.</p>
<fieldset class="field-set">
<legend>Aussehen des Hinweises</legend>
<div class="fields">
<div>
<label for="consentLayout">Anordnung</label>
<select id="consentLayout" name="consentLayout">
<option value="karte"{{ settings.consentLayout == 'karte' ? ' selected' : '' }}>Karte unten in der Mitte</option>
<option value="leiste"{{ settings.consentLayout == 'leiste' ? ' selected' : '' }}>Leiste über die volle Breite</option>
<option value="ecke"{{ settings.consentLayout == 'ecke' ? ' selected' : '' }}>Kleine Karte rechts unten</option>
</select>
</div>
<div>
<label for="consentShape">Form</label>
<select id="consentShape" name="consentShape">
<option value="weich"{{ settings.consentShape == 'weich' ? ' selected' : '' }}>Abgerundet</option>
<option value="rund"{{ settings.consentShape == 'rund' ? ' selected' : '' }}>Rund</option>
<option value="eckig"{{ settings.consentShape == 'eckig' ? ' selected' : '' }}>Eckig</option>
</select>
<p class="field-help">Gilt für die Fläche und ihre Knöpfe zusammen.</p>
</div>
<div>
<label for="consentTitle">Überschrift</label>
<input id="consentTitle" name="consentTitle" maxlength="80" value="{{ settings.consentTitle }}" placeholder="Externe Inhalte und Einwilligung">
</div>
<div>
<label for="consentColor">Farbe der Fläche</label>
<input id="consentColor" name="consentColor" value="{{ settings.consentColor }}" placeholder="@paper" data-color data-palette="{{ palette|json_encode|e('html_attr') }}">
</div>
<div>
<label for="consentInk">Schriftfarbe</label>
<input id="consentInk" name="consentInk" value="{{ settings.consentInk }}" placeholder="@ink" data-color data-palette="{{ palette|json_encode|e('html_attr') }}">
</div>
<div>
<label for="consentAccent">Farbe des Knopfes „Alle akzeptieren“</label>
<input id="consentAccent" name="consentAccent" value="{{ settings.consentAccent }}" placeholder="@accent" data-color data-palette="{{ palette|json_encode|e('html_attr') }}">
<p class="field-help">Färbt auch den Streifen oben, das Symbol und die Kästchen.</p>
</div>
<div>
<label for="consentAccentInk">Schrift auf dem Knopf</label>
<input id="consentAccentInk" name="consentAccentInk" value="{{ settings.consentAccentInk }}" placeholder="#ffffff" data-color data-palette="{{ palette|json_encode|e('html_attr') }}">
</div>
</div>
<p class="field-help">Leer heißt: Papier, Tinte und Akzent aus dem Design. „Nur notwendige“ bleibt bewusst ein Rahmenknopf in der Schriftfarbe – beide Antworten sind gleich groß, keine wird versteckt.</p>
</fieldset>
<div class="fields">
<div>
<label for="privacyPath">Adresse der Datenschutzseite</label>
+9
View File
@@ -71,6 +71,15 @@
<div class="shell-actions">{% block actions %}{% endblock %}</div>
</div>
<div class="shell-body stack">
{# Offene Handlungen, auf jedem Bildschirm gleich: fehlende Schriften, eine neue Fassung.
Sie stehen hier statt nur auf ihrer eigenen Seite - einen Hinweis findet nur, wer schon
weiss, wo er steht. Jeder traegt den Knopf, der ihn erledigt. #}
{% for hinweis in kant_admin_notices() %}{% if not hinweis.admin or is_granted('ROLE_ADMIN') %}
<p class="shell-notice" role="status">
<span>{{ hinweis.text }}</span>
<a class="secondary" href="{{ path(hinweis.route) }}">{{ hinweis.action }} &rarr;</a>
</p>
{% endif %}{% endfor %}
{% for type in ['error', 'success'] %}{% for message in app.flashes(type) %}
<p class="notice {{ type == 'error' ? 'error' : 'ok' }}" role="{{ type == 'error' ? 'alert' : 'status' }}">{{ message }}</p>
{% endfor %}{% endfor %}
+49 -31
View File
@@ -2,7 +2,7 @@
{% set nav = 'system' %}
{% block title %}System{% endblock %}
{% block heading %}System und Update{% endblock %}
{% block lead %}Welche Fassung läuft, ob ein Update möglich ist, und der Weg dorthin: sichern, Wartungszustand, Dateien tauschen, migrieren.{% endblock %}
{% block lead %}Fassung, Updateweg und Sicherungen dieser Installation.{% endblock %}
{% block content %}
<div class="card">
@@ -13,13 +13,13 @@
<div class="card-body">
<dl class="facts">
<dt>Fassung</dt><dd><strong>{{ state.version }}</strong></dd>
<dt>Adresse der Verwaltung</dt>
<dt>Verwaltung</dt>
<dd>
<code>/{{ adminPath }}</code>
{% if adminPath == 'admin' %}
<span class="muted">– die Adresse, die jeder Scanner zuerst probiert. Ändern mit <code>php bin/console cms:admin:path &lt;neu&gt;</code>; sie steht danach in <code>.env.local</code> und in keiner öffentlichen Datei.</span>
<span class="muted">– Standardpfad, den jeder Scanner zuerst probiert. Ändern: <code>php bin/console cms:admin:path &lt;neu&gt;</code>.</span>
{% else %}
<span class="muted">– geändert. Sie wird in der <code>robots.txt</code> nicht genannt; notiere sie dir an einem sicheren Ort. Zurück mit <code>php bin/console cms:admin:path admin</code>.</span>
<span class="muted">– geändert; steht in keiner öffentlichen Datei. Zurück: <code>php bin/console cms:admin:path admin</code>.</span>
{% endif %}
</dd>
<dt>Datenbank</dt>
@@ -28,17 +28,17 @@
{% if database.datei %}
<code>{{ database.datei }}</code>
{% if database.bytes %}<span class="muted">· {{ (database.bytes / 1048576)|number_format(1, ',', '.') }} MB</span>{% endif %}
{% if not database.schreibbar %}<br><span class="check-bad"><strong>Nicht beschreibbar.</strong> Nach einem Upload per FTP gehört die Datei dem FTP-Benutzer; PHP läuft als ein anderer. SQLite braucht Schreibrechte auf die Datei <em>und</em> auf den Ordner darüber.</span>{% endif %}
{% if not database.schreibbar %}<br><span class="check-bad"><strong>Nicht beschreibbar.</strong> SQLite braucht Schreibrechte auf die Datei <em>und</em> auf den Ordner darüber – nach einem FTP-Upload gehört sie dem FTP-Benutzer.</span>{% endif %}
{% else %}
<code>{{ database.adresse }}</code>
{% endif %}
<br><span class="muted">Eingestellt in <code>{{ database.quelle }}</code>. Die Installationskonfiguration steht in <code>.env</code>. Explizite Server-Umgebungsvariablen haben Vorrang.</span>
<br><span class="muted">Eingestellt in <code>{{ database.quelle }}</code>; Server-Umgebungsvariablen haben Vorrang.</span>
</dd>
{% if state.worktree %}
<dt>Stand</dt><dd><code>{{ state.describe }}</code>{% if state.commit != 'unbekannt' %} · Commit <code>{{ state.commit }}</code>{% endif %}</dd>
{% else %}
<dt>Eingerichtet über</dt>
<dd>das <strong>Releasearchiv</strong> <span class="muted">– kein Git in diesem Verzeichnis, und dafür ist es auch nicht gedacht. Updates laufen über die Karte weiter unten.</span></dd>
<dd><strong>Releasearchiv</strong> <span class="muted">– kein Git; Updates laufen über die Karte unten.</span></dd>
{% endif %}
{% if state.worktree %}
<dt>Verfügbar</dt>
@@ -55,7 +55,7 @@
</dl>
{% if state.maintenance %}
<p class="notice error" role="alert">Die Website antwortet Besuchern gerade mit 503. Wenn das nicht beabsichtigt ist, hebe den Wartungszustand auf – ein gescheitertes Update kann ihn eingeschaltet gelassen haben.</p>
<p class="notice error" role="alert">Die Website antwortet Besuchern mit 503. Wenn das nicht beabsichtigt ist, hebe den Wartungszustand auf – ein gescheitertes Update kann ihn eingeschaltet gelassen haben.</p>
{% endif %}
<div class="sheet-actions">
@@ -74,7 +74,7 @@
vollkommen in Ordnung ist. #}
{% if state.worktree %}
<div class="card">
<div class="card-head"><h2>Vorprüfung</h2><span class="muted">Jede Bedingung wird geprüft, nicht angenommen</span></div>
<div class="card-head"><h2>Vorprüfung</h2><span class="muted">{{ checks|length }} Bedingungen</span></div>
<div class="card-body">
<ul class="check-list">
{% for check in checks %}
@@ -97,9 +97,9 @@
<span class="muted">{{ pendingMigrations|length }} Stück</span>
</div>
<div class="card-body">
<p class="notice">Der Code ist neuer als die Datenbank. Das passiert, wenn ein Update von Hand über FTP eingespielt wurde – dann fehlt der Schritt, den sonst der Updater übernimmt.</p>
<p class="notice">Der Code ist neuer als die Datenbank – typisch nach einem Update von Hand über FTP.</p>
<ul class="log-list">{% for name in pendingMigrations %}<li><code>{{ name }}</code></li>{% endfor %}</ul>
<p class="field-help">Lege vorher eine Sicherung an: Migrationen sind nicht umkehrbar, der Rückweg ist die Sicherung.</p>
<p class="field-help">Vorher sichern: Migrationen sind nicht umkehrbar, der Rückweg ist die Sicherung.</p>
<form action="{{ path('admin_system_migrate') }}" method="post">
<input type="hidden" name="_csrf_token" value="{{ csrf_token('system') }}">
<button class="primary" type="submit">Migrationen jetzt ausführen →</button>
@@ -111,7 +111,7 @@
<div class="card">
<div class="card-head">
<h2>{{ state.worktree ? 'Update aus dem Releasearchiv' : 'Update einspielen' }}</h2>
<span class="muted">{{ state.worktree ? 'Alternative zum Weg über Git' : 'holt die neue Fassung und tauscht die Dateien' }}</span>
<span class="muted">{{ state.worktree ? 'Alternative zum Weg über Git' : 'holt die neue Fassung' }}</span>
</div>
<div class="card-body">
{% if archivePending %}
@@ -122,14 +122,19 @@
<button class="primary" type="submit">Migrationen ausführen und freigeben →</button>
</form>
{% else %}
<p class="muted">Dieser Weg braucht kein Git: Er lädt das Archiv der neuen Fassung von der Releaseseite, vergleicht die Prüfsumme, sichert Datenbank und Medien, schaltet den Wartungszustand ein und ersetzt die Dateien der Anwendung. <strong>Unberührt bleiben <code>var/</code>, <code>.env</code>, <code>.env.local</code>, die geladenen Schriften und das erzeugte Stylesheet-Bündel.</strong> Der vorherige Stand wird beiseitegelegt, nicht gelöscht.</p>
<p class="field-help">Danach folgt ein zweiter Knopf für die Migrationen. Das ist kein Umweg: Erst eine neue Anfrage startet mit dem Code der neuen Fassung – ein Prozess, der sich selbst ausgetauscht hat, arbeitet mit dem alten weiter.</p>
<p class="muted">Ohne Git: Archiv laden, Prüfsumme vergleichen, Datenbank und Medien sichern, Wartungszustand ein, Dateien tauschen. Der vorherige Stand wird beiseitegelegt, nicht gelöscht.</p>
{# Das Kleingedruckte steht zugeklappt: Wer aktualisiert, braucht zuerst den Knopf. #}
<details class="hint">
<summary>Was unberührt bleibt</summary>
<p class="field-help"><code>var/</code>, <code>.env</code>, <code>.env.local</code>, die geladenen Schriften und das erzeugte Stylesheet-Bündel.</p>
<p class="field-help">Danach folgt ein zweiter Knopf für die Migrationen. Das ist kein Umweg: Erst eine neue Anfrage startet mit dem Code der neuen Fassung.</p>
</details>
{% if archiveVersion %}
<p class="notice done">Verfügbar: <strong>{{ archiveVersion }}</strong> (installiert: {{ state.version }}).</p>
{% elseif asked %}
<p class="field-help">Die Releaseseite nennt nichts Neueres als {{ state.version }}.</p>
{% else %}
<p class="field-help"><a href="{{ path('admin_system', {pruefen: 1}) }}">Nachsehen, ob es etwas Neues gibt</a> – das fragt die Releaseseite und dauert einen Moment.</p>
<p class="field-help"><a href="{{ path('admin_system', {pruefen: 1}) }}">Nachsehen, ob es etwas Neues gibt</a> – dauert einen Moment.</p>
{% endif %}
<form action="{{ path('admin_system_archive') }}" method="post">
<input type="hidden" name="_csrf_token" value="{{ csrf_token('system') }}">
@@ -150,9 +155,12 @@
<div class="card">
<div class="card-head"><h2>Update einspielen</h2><span class="muted">{{ ready ? 'Vorprüfung bestanden' : 'erst die Vorprüfung erfüllen' }}</span></div>
<div class="card-body">
<p class="muted">Der Updater sichert zuerst Datenbank und Umgebungsdateien, schaltet den Wartungszustand ein, wechselt auf den Tag, installiert Abhängigkeiten, migriert, räumt den Cache und prüft, ob die Installation antwortet. Scheitert ein Schritt, wird auf den vorherigen Stand zurückgesetzt – und nur wenn die Migration schon begonnen hatte, auch die Datenbank zurückgeschrieben.</p>
<p class="field-help"><strong>Der Medienordner wird nicht gesichert.</strong> Er ist zu groß, und kein Update schreibt darin. Ein Update ist keine Datensicherung.</p>
<p class="field-help">Auf manchen Hostings bricht ein Browseraufruf nach kurzer Zeit ab. Dann ist <code>php bin/console cms:update</code> der verlässliche Weg – dort gibt es dieselben Schritte mit <code>--check</code>, <code>--dry-run</code> und <code>--to=v1.2.0</code>.</p>
<p class="muted">Sichern, Wartungszustand ein, auf den Tag wechseln, Abhängigkeiten, Migrationen, Cache, Antwortprüfung. Scheitert ein Schritt, wird zurückgesetzt – die Datenbank nur, wenn die Migration schon begonnen hatte.</p>
<details class="hint">
<summary>Zwei Hinweise vorab</summary>
<p class="field-help"><strong>Der Medienordner wird nicht gesichert.</strong> Ein Update ist keine Datensicherung.</p>
<p class="field-help">Bricht der Browseraufruf auf dem Hosting ab: <code>php bin/console cms:update</code> – dieselben Schritte mit <code>--check</code>, <code>--dry-run</code> und <code>--to=v1.2.0</code>.</p>
</details>
<form action="{{ path('admin_system_update') }}" method="post">
<input type="hidden" name="_csrf_token" value="{{ csrf_token('system') }}">
@@ -164,7 +172,7 @@
</div>
<div>
<label class="check-label" for="dryRun"><input id="dryRun" name="dryRun" type="checkbox" value="1" checked> Nur Probelauf</label>
<p class="field-help">Prüft alles und verändert nichts. Nimm das Häkchen weg, wenn es wirklich laufen soll.</p>
<p class="field-help">Prüft alles und verändert nichts.</p>
</div>
</div>
<button class="primary" type="submit"{{ ready ? '' : ' disabled' }}>Update ausführen</button>
@@ -175,7 +183,7 @@
{% if steps is not empty %}
<div class="card">
<div class="card-head"><h2>Letzter Durchlauf</h2><span class="muted">Schritt für Schritt</span></div>
<div class="card-head"><h2>Letzter Durchlauf</h2><span class="muted">{{ steps|length }} Schritte</span></div>
<div class="card-body">
<ol class="check-list">
{% for step in steps %}
@@ -197,31 +205,31 @@
<div class="card">
<div class="card-head"><h2>Sicherungen</h2><span class="muted">{{ backups|length }} vorhanden · var/backups</span></div>
<div class="card-body">
<p class="muted">Eine Sicherung enthält die Datenbank als vollständige Kopie – nicht als Dateikopie während des Schreibens, die unbrauchbar sein kann – und den Medienordner. <strong>Nicht enthalten sind <code>.env</code>, <code>vendor/</code> und der Quellcode</strong>: die kommen aus dem Repository, und <code>.env</code> enthält das Geheimnis dieser Installation.</p>
<p class="field-help">Zurückspielen geht bewusst nur auf der Konsole: <code>php bin/console cms:restore &lt;name&gt;</code>. Ein Knopf, der die ganze Datenbank ersetzt, gehört nicht neben einen, der eine Seite speichert. Die tägliche Sicherung erledigt der <a href="{{ path('admin_tasks') }}">Aufgabenplan</a> – auch ohne Cronjob.</p>
<p class="muted">Eine Sicherung enthält die Datenbank als vollständige Kopie und den Medienordner – nicht <code>.env</code>, <code>vendor/</code> und den Quellcode.</p>
<p class="field-help">Zurückspielen nur auf der Konsole: <code>php bin/console cms:restore &lt;name&gt;</code>. Die tägliche Sicherung erledigt der <a href="{{ path('admin_tasks') }}">Aufgabenplan</a>.</p>
<form action="{{ path('admin_system_backup') }}" method="post">
<input type="hidden" name="_csrf_token" value="{{ csrf_token('system') }}">
<button class="primary" type="submit">Sicherung jetzt anlegen</button>
</form>
{% if backups is not empty %}
<table class="table">
<table class="table table-stack">
<caption class="visually-hidden">Vorhandene Sicherungen</caption>
<thead><tr><th scope="col">Name</th><th scope="col">Erstellt</th><th scope="col">Fassung</th><th scope="col">Inhalt</th><th scope="col">Größe</th><th scope="col">Zustand</th></tr></thead>
<tbody>
{% for backup in backups %}
<tr>
<td><code>{{ backup.name }}</code></td>
<td>{{ backup.manifest ? backup.manifest.erstellt|date('d.m.Y H:i') : '—' }}{% if backup.manifest %}<br><span class="muted">{{ backup.manifest.anlass }}</span>{% endif %}</td>
<td>{{ backup.manifest ? backup.manifest.fassung : '—' }}</td>
<td>{% if backup.manifest %}{{ backup.manifest.inhalt.seiten }} Seiten, {{ backup.manifest.medien.dateien }} Dateien{% else %}—{% endif %}</td>
<td>{{ (backup.bytes / 1048576)|number_format(1, ',', '.') }} MB</td>
<td>{% if backup.intact %}<span class="pill pill-live">unversehrt</span>{% else %}<span class="pill pill-off">Prüfsumme falsch</span>{% endif %}</td>
<td data-label="Name"><code>{{ backup.name }}</code></td>
<td data-label="Erstellt">{{ backup.manifest ? backup.manifest.erstellt|date('d.m.Y H:i') : '—' }}{% if backup.manifest %}<br><span class="muted">{{ backup.manifest.anlass }}</span>{% endif %}</td>
<td data-label="Fassung">{{ backup.manifest ? backup.manifest.fassung : '—' }}</td>
<td data-label="Inhalt">{% if backup.manifest %}{{ backup.manifest.inhalt.seiten }} Seiten, {{ backup.manifest.medien.dateien }} Dateien{% else %}—{% endif %}</td>
<td data-label="Größe">{{ (backup.bytes / 1048576)|number_format(1, ',', '.') }} MB</td>
<td data-label="Zustand">{% if backup.intact %}<span class="pill pill-live">unversehrt</span>{% else %}<span class="pill pill-off">Prüfsumme falsch</span>{% endif %}</td>
</tr>
{% endfor %}
</tbody>
</table>
<p class="field-help">„Unversehrt“ heißt: die Prüfsumme der gesicherten Datenbank stimmt noch mit dem Manifest überein. Stimmt sie nicht, wird die Sicherung nicht eingespielt.</p>
<p class="field-help">„Unversehrt“ heißt: die Prüfsumme stimmt noch. Stimmt sie nicht, wird die Sicherung nicht eingespielt.</p>
{% endif %}
</div>
</div>
@@ -232,9 +240,19 @@
{% if state.log is empty %}
<p class="muted">Noch kein Update über diesen Weg eingespielt.</p>
{% else %}
{# Zwanzig Protokollzeilen sind auf einem Handy zwanzig Absätze. Die jüngsten fünf
stehen offen, der Rest liegt eine Umdrehung dahinter. #}
<ul class="log-list">
{% for line in state.log %}<li><code>{{ line }}</code></li>{% endfor %}
{% for line in state.log|slice(0, 5) %}<li><code>{{ line }}</code></li>{% endfor %}
</ul>
{% if state.log|length > 5 %}
<details class="hint">
<summary>Ältere Einträge ({{ state.log|length - 5 }})</summary>
<ul class="log-list">
{% for line in state.log|slice(5) %}<li><code>{{ line }}</code></li>{% endfor %}
</ul>
</details>
{% endif %}
{% endif %}
</div>
</div>
+20 -15
View File
@@ -129,22 +129,27 @@
<button class="primary" type="submit">Design speichern</button>
</form>
<div class="section-head"><h2>Schriften ausliefern</h2><span class="muted">Von Google oder vom eigenen Server</span></div>
{% if fontsMissing is empty and not fontsLocal %}
<p class="field-help">Dieses Design nutzt nur Systemschriften – es lädt ohnehin nichts von Google.</p>
{% else %}
<p class="field-help">
{% if fontsLocal %}
<strong>Die Schriften liegen auf diesem Server.</strong> Besucher laden nichts von Google, und die Seite baut sich schneller auf, weil eine Kette aus zwei fremden Verbindungen entfällt.
<div class="card">
<div class="card-head">
<h2>Schriften ausliefern</h2>
<span class="muted">{{ fontsMissing ? fontsMissing|length ~ ' fehlt noch' : 'immer vom eigenen Server' }}</span>
</div>
<div class="card-body">
{% if fontsMissing is empty and not fontsLocal %}
<p class="muted">Dieses Design nutzt nur Systemschriften – es lädt ohnehin nichts von Google.</p>
{% else %}
<strong>Die Schriften kommen zurzeit von Google.</strong> Damit erfährt Google die IP-Adresse jedes Besuchers – in Deutschland ein abmahnfähiger Mangel (LG München I, 3 O 17493/20) –, und der Seitenaufbau wartet auf zwei fremde Verbindungen nacheinander. Mit dem Knopf werden die Dateien einmalig hierher geholt; die Lizenz der Schriften erlaubt das ausdrücklich.
{% if fontsLocal %}
<p class="muted"><strong>Die Schriften liegen auf diesem Server.</strong> Besucher laden nichts von Google, und die Seite baut sich schneller auf.</p>
{% else %}
<p class="muted"><strong>Die Schriftdateien fehlen auf diesem Server.</strong> Bis sie hier liegen, zeigt die Website die eingestellte Ersatzschrift – von Google wird nichts geladen, weder hier noch beim Besucher.</p>
{% endif %}
{% if fontsMissing %}<p class="field-help">Noch nicht hier: {{ fontsMissing|join(', ') }}.</p>{% endif %}
<form method="post" action="{{ path('admin_theme_fonts') }}">
<input type="hidden" name="_csrf_token" value="{{ csrf_token('theme') }}">
<button class="{{ fontsLocal ? 'secondary' : 'primary' }}" type="submit">{{ fontsLocal ? 'Schriften erneut holen' : 'Schriften auf diesen Server holen' }}</button>
</form>
{% endif %}
{% if fontsMissing %}<br>Noch nicht hier: {{ fontsMissing|join(', ') }}.{% endif %}
</p>
<form method="post" action="{{ path('admin_theme_fonts') }}">
<input type="hidden" name="_csrf_token" value="{{ csrf_token('theme') }}">
<button type="submit">{{ fontsLocal ? 'Schriften erneut holen' : 'Schriften auf diesen Server holen' }}</button>
</form>
{% endif %}
</div>
</div>
<p class="footnote">KantSites · Arbeitsstand</p>
{% endblock %}
+1
View File
@@ -19,6 +19,7 @@
<link rel="stylesheet" href="/assets/site.css?v={{ kant_version() }}">
<link rel="stylesheet" href="/assets/buttons.css?v={{ kant_version() }}">
<link rel="stylesheet" href="/assets/design.css?v={{ kant_version() }}">
{% if pageStyles|default('') %}<style>{{ pageStyles|raw }}</style>{% endif %}
{% if needsScrolled|default(false) %}<script type="module" src="/assets/scrolled.js?v={{ kant_version() }}"></script>{% endif %}
</head>
{% set consentOpen = not editing|default(false) and consentGate.needsBanner(app.request) %}
+18 -7
View File
@@ -3,16 +3,24 @@
No JavaScript: the public pages run with script-src 'none' by default, and a banner that needs
a script would be the one thing that breaks that. Accepting and refusing are the same kind of
button, next to each other, with the same weight - a refusal hidden behind a link would not be
a free choice. The per-group selection sits in a disclosure so the first view stays readable. #}
<section class="consent-bar" role="region" aria-labelledby="consent-heading">
<h2 id="consent-heading">Externe Inhalte und Einwilligung</h2>
<p>{{ consent.text ?: 'Diese Website lädt bestimmte Inhalte erst, wenn du zustimmst. Ohne Zustimmung wird die Seite vollständig angezeigt, nur eingebettete Inhalte anderer Anbieter bleiben leer.' }}</p>
a free choice. The per-group selection sits in a disclosure so the first view stays readable.
Anordnung, Form, Farben und Ueberschrift kommen aus den Einstellungen: die Anordnung als
Klasse, der Rest als Variablen im Kopf der Seite (Consent::styles). #}
<section class="consent-bar consent-layout-{{ consent.layout|default('karte') }}" role="region" aria-labelledby="consent-heading">
<div class="consent-body">
<h2 id="consent-heading"><svg class="consent-icon" viewBox="0 0 24 24" width="22" height="22" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M12 3 5 6v6c0 4.4 2.9 7.9 7 9 4.1-1.1 7-4.6 7-9V6Zm-2.5 9 2 2 4-4.5"/></svg><span>{{ consent.title|default('') ?: 'Externe Inhalte und Einwilligung' }}</span></h2>
<p>{{ consent.text ?: 'Diese Website lädt bestimmte Inhalte erst, wenn du zustimmst. Ohne Zustimmung wird die Seite vollständig angezeigt, nur eingebettete Inhalte anderer Anbieter bleiben leer.' }}</p>
</div>
<form method="post" action="{{ path('consent_save') }}" class="consent-form">
<input type="hidden" name="back" value="{{ back }}">
<div class="consent-actions">
<button class="consent-button" type="submit" name="choice" value="all">Alle akzeptieren</button>
<button class="consent-button" type="submit" name="choice" value="none">Nur notwendige</button>
<button class="consent-button consent-accept" type="submit" name="choice" value="all">Alle akzeptieren</button>
<button class="consent-button consent-decline" type="submit" name="choice" value="none">Nur notwendige</button>
</div>
{# Eine Zeile: links die Einzelwahl, rechts die Rechtslinks. Aufgeklappt nimmt die
Einzelwahl die ganze Breite, die Links rutschen darunter. #}
<div class="consent-foot">
<details class="consent-details">
<summary>Einzeln wählen</summary>
<ul class="consent-groups">
@@ -27,9 +35,12 @@
</ul>
<button class="consent-button consent-choice" type="submit" name="choice" value="some">Auswahl speichern</button>
</details>
{% if consent.privacyPath or consent.imprintPath %}
<p class="consent-links">
{% if consent.privacyPath %}<a href="/{{ consent.privacyPath }}">Datenschutz</a>{% endif %}
{% if consent.imprintPath %} · <a href="/{{ consent.imprintPath }}">Impressum</a>{% endif %}
{% if consent.imprintPath %}<a href="/{{ consent.imprintPath }}">Impressum</a>{% endif %}
</p>
{% endif %}
</div>
</form>
</section>
+1
View File
@@ -7,6 +7,7 @@
<meta name="robots" content="noindex, follow">
{% include 'favicon.html.twig' %}
<link rel="stylesheet" href="/assets/site.css?v={{ kant_version() }}">
{% if pageStyles|default('') %}<style>{{ pageStyles|raw }}</style>{% endif %}
</head>
<body class="kant consent-page">
<main id="main" tabindex="-1">
+12 -7
View File
@@ -33,6 +33,13 @@
drei Abfragen trifft zu - und zwar auf dieselbe Variante, die auch die Regel nimmt. #}
{% for bild in heroBackground|default([]) %}<link rel="preload" as="image" href="{{ bild.src }}" media="{{ bild.media }}" fetchpriority="high">
{% endfor %}
{% if localFonts|default([]) %}
{# Jeder Schnitt, den das Theme nennt, vorab - und zwar alle. Fehlt einer, laedt er erst,
wenn das Stylesheet geparst ist, und die Ueberschrift springt sichtbar von der
Ersatzschrift auf die richtige. Schriften kommen ausschliesslich vom eigenen Server;
ein Stylesheet von fonts.googleapis.com wird nie verlinkt. #}
{% for font in localFonts %}<link rel="preload" href="{{ font }}" as="font" type="font/woff2" crossorigin>{% endfor %}
{% endif %}
{% if styleBundle|default(null) %}
<link rel="stylesheet" href="{{ styleBundle }}">
{% else %}
@@ -42,10 +49,6 @@
{% if page.document.schemaVersion >= 2 %}<link rel="stylesheet" href="/assets/design.css?v={{ kant_version() }}">{% endif %}
{% if page.document.schemaVersion >= 3 %}<link rel="stylesheet" href="/assets/enhancements.css?v={{ kant_version() }}">{% endif %}
{% endif %}
{% if localFonts|default([]) %}
{# Die wichtigsten Schnitte vorab, damit die erste Zeile in der richtigen Schrift steht. #}
{% for font in localFonts %}<link rel="preload" href="{{ font }}" as="font" type="font/woff2" crossorigin>{% endfor %}
{% elseif googleFonts|default(null) %}<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link rel="stylesheet" href="{{ googleFonts }}">{% endif %}
{% if hasPosts|default(false) %} <link rel="alternate" type="application/rss+xml" title="Beiträge" href="/feed.xml">
{% endif %}
{% if needsTabs|default(false) %}<script src="/assets/tabs.js?v={{ kant_version() }}" defer></script>{% endif %}
@@ -94,13 +97,15 @@
{% for block in areas.footer.blocks %}{% include 'blocks/block.html.twig' with {block: block, editing: editing|default(false), postLists: {}, forms: {}, breadcrumbs: [], navigation: navigation|default({}), sections: sections|default({}), richText: areas.footer.schemaVersion|default(1) >= 12, richHeadings: areas.footer.schemaVersion|default(1) >= 17, eagerImage: null} only %}{% endfor %}
</footer>
{% endif %}
{% if not editing|default(false) and consentGate.needsBanner(app.request) %}
{% include 'consent-banner.html.twig' with {consent: consentGate.state(app.request), back: app.request.pathInfo} only %}
{% endif %}
{# Der Knopf steht hinter der Einwilligungsleiste: Solange sie offen ist, setzt er sich per
Ankerpositionierung auf ihre Oberkante, und ein Anker muss im Dokument davor stehen. #}
{% set oben = siteSettings.load() %}
{% if oben.scrollTop|default(false) and not editing|default(false) %}
{# Ein Anker, kein Skript. Er springt an den Anfang - das kann ein Browser allein. #}
<a class="scroll-top{{ oben.scrollTopPosition|default('rechts') == 'links' ? ' scroll-top-links' : '' }}" href="#seitenanfang" aria-label="{{ oben.scrollTopLabel|default('Nach oben') }}"><span aria-hidden="true">↑</span></a>
{% endif %}
{% if not editing|default(false) and consentGate.needsBanner(app.request) %}
{% include 'consent-banner.html.twig' with {consent: consentGate.state(app.request), back: app.request.pathInfo} only %}
{% endif %}
</body>
</html>
+141 -16
View File
@@ -1393,27 +1393,37 @@ final class CmsTest extends TestCase
self::assertSame('https://fonts.gstatic.com/s/lato/latein.woff2', $faces[0]['url']);
self::assertStringContainsString('U+0131', $faces[0]['range']);
// Ohne heruntergeladene Dateien bleibt es beim Verweis auf Google - und das Theme weiß es.
// Ohne heruntergeladene Dateien bleibt es bei der Ersatzschrift - verlinkt wird Google
// nie, denn das gäbe die IP jedes Besuchers an einen Dritten weiter.
$theme = new Theme($this->db);
$gespeichert = $theme->load();
$theme->save($gespeichert['colors'], [
['key' => 'body', 'name' => 'Fließtext', 'family' => 'Lato', 'source' => 'google', 'weights' => [400, 700], 'fallback' => 'system-ui'],
['key' => 'heading', 'name' => 'Überschriften', 'family' => 'Lato', 'source' => 'google', 'weights' => [700], 'fallback' => 'system-ui'],
['key' => 'heading', 'name' => 'Überschriften', 'family' => 'Lato', 'source' => 'google', 'weights' => [700, 900], 'fallback' => 'system-ui'],
], $gespeichert['base']);
self::assertFalse($fonts->hasLocal($theme->load()));
self::assertSame(['Lato 400', 'Lato 700'], $fonts->missing($theme->load()));
self::assertSame(['Lato 400', 'Lato 700', 'Lato 900'], $fonts->missing($theme->load()));
$this->pages->publish('page-1', $this->pages->saveDraft('page-1', DemoContent::starter('Startseite'), 0), 1);
self::assertStringContainsString('fonts.googleapis.com', $this->request('/')->getContent());
$ohne = $this->request('/');
self::assertStringNotContainsString('fonts.googleapis.com', $ohne->getContent());
self::assertStringNotContainsString('fonts.gstatic.com', $ohne->getContent());
self::assertStringNotContainsString('rel="preload"'." href=\"/assets/fonts", $ohne->getContent());
// Mit Dateien: kein Wort mehr von Google, dafür die eigenen Dateien und ein Vorabholen.
// Mit Dateien: die eigenen Dateien, und zwar **jeder** Schnitt vorab. Fehlte einer, läge
// er erst nach dem Stylesheet vor, und die Überschrift spränge sichtbar von der
// Ersatzschrift auf die richtige.
mkdir($this->path.'-fonts', 0o775, true);
foreach (['lato-400-latin.woff2', 'lato-700-latin.woff2'] as $datei) {
foreach (['lato-400-latin.woff2', 'lato-700-latin.woff2', 'lato-900-latin.woff2'] as $datei) {
file_put_contents($this->path.'-fonts/'.$datei, 'wOF2test');
}
file_put_contents($this->path.'-fonts/fonts.css', "@font-face{font-family:'Lato'}");
self::assertTrue($fonts->hasLocal($theme->load()));
self::assertSame(['/assets/fonts/lato-400-latin.woff2', '/assets/fonts/lato-700-latin.woff2'], $fonts->preload($theme->load()));
self::assertSame([
'/assets/fonts/lato-400-latin.woff2',
'/assets/fonts/lato-700-latin.woff2',
'/assets/fonts/lato-900-latin.woff2',
], $fonts->preload($theme->load()));
}
public function testTheStylesheetsGoOutAsOneFileWithoutComments(): void
@@ -1900,9 +1910,7 @@ final class CmsTest extends TestCase
$template = (string) file_get_contents(__DIR__.'/../templates/blocks/icon.html.twig');
foreach (DocumentValidator::ICONS as $icon) {
self::assertMatchesRegularExpression(
'/
\s{4}'.preg_quote($icon, '/').": '[^']{4,}',?
/",
'/\R\s{4}'.preg_quote($icon, '/').": '[^']{4,}',?\R/",
$template,
sprintf('Das Symbol „%s“ steht in der Liste, hat aber keine Zeichnung.', $icon),
);
@@ -2352,7 +2360,7 @@ final class CmsTest extends TestCase
$this->pages->saveDraft('page-1', $document, 0);
}
public function testThemeDrivesEveryPageAndGoogleFontsOpenTheirOwnPolicy(): void
public function testThemeDrivesEveryPageAndNoFontIsEverFetchedFromGoogle(): void
{
$this->pages->publish('page-1', $this->pages->saveDraft('page-1', DemoContent::pages()['home'], 0), 1);
// Without a stored theme the defaults apply and no third party is contacted.
@@ -2373,10 +2381,14 @@ final class CmsTest extends TestCase
self::assertStringContainsString('--kf-body:"Inter",sans-serif', $html);
self::assertStringContainsString('font-size:var(--k-size)', $html);
self::assertStringContainsString('--k-container:1100px', $html);
self::assertStringContainsString('fonts.googleapis.com/css2?family=Inter:wght@400;700', $html);
// Auch eine Google-Familie im Theme verlinkt nichts nach draußen: Solange die Dateien
// nicht hier liegen, greift die Ersatzschrift, und die Kopfzeile lässt keinen fremden
// Schrifthost zu.
self::assertStringNotContainsString('fonts.googleapis.com', $html);
$policy = (string) $response->headers->get('Content-Security-Policy');
self::assertStringContainsString('https://fonts.googleapis.com', $policy);
self::assertStringContainsString("font-src 'self' https://fonts.gstatic.com", $policy);
self::assertStringNotContainsString('googleapis.com', $policy);
self::assertStringContainsString("font-src 'self';", $policy);
self::assertStringContainsString("style-src 'self' 'sha256-", $policy);
}
/**
@@ -2591,7 +2603,12 @@ final class CmsTest extends TestCase
$this->menus->save('header', 'Hauptnavigation', [
['label' => 'Start', 'type' => 'page', 'pageId' => $start, 'anchor' => '', 'children' => []],
], 0);
self::assertStringContainsString('<a href="/" aria-current="page">Start</a>', $this->request('/')->getContent());
// Seit den Menuesymbolen (1.13.0) steht die Beschriftung in einer eigenen Huelle. Geprueft
// wird, was die Aussage traegt: Adresse, Kennzeichnung der aktuellen Seite, Beschriftung.
self::assertMatchesRegularExpression(
'#<a href="/" aria-current="page">.*?Start.*?</a>#s',
(string) $this->request('/')->getContent(),
);
// The root is protected from being renamed or binned while it is the root.
foreach ([fn () => $this->pages->movePage($start, 'anders', null, $this->pages->findForEditor($start)['version'], $this->redirects),
@@ -3458,7 +3475,8 @@ final class CmsTest extends TestCase
self::assertStringNotContainsString('#2c6b4f', $site, 'Der Einwilligungsdialog nimmt die Farbe der Website.');
// Und er lässt sich eigens färben: eine Palettenfarbe mit dem Schlüssel „consent“ gewinnt
// über die Primärfarbe, ohne dass es dafür eine weitere Einstellung braucht.
self::assertStringContainsString('background:var(--k-consent,var(--accent))', $site);
// Der Palettenschlüssel `consent` bleibt die Zwischenstufe hinter der eigenen Einstellung.
self::assertStringContainsString('background:var(--kant-consent-accent,var(--k-consent,var(--accent)))', $site);
self::assertStringNotContainsString('outline:3px solid #b85c12', $site, 'Auch der Fokusring folgt der Palette.');
}
@@ -3698,6 +3716,75 @@ final class CmsTest extends TestCase
$this->pages->saveDraft('page-1', $document, 0);
}
public function testOpeningHoursAndTheServiceAreaReachTheStructuredData(): void
{
$this->pages->publish('page-1', $this->pages->saveDraft('page-1', DemoContent::pages()['home'], 0), 1);
$hours = [];
foreach (['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'] as $day) {
$hours[$day] = ['opens' => '07:30', 'closes' => '17:00'];
}
$hours['Saturday'] = ['opens' => '09:00', 'closes' => '12:00'];
$hours['Sunday'] = ['opens' => '', 'closes' => ''];
$this->site->save(['country' => 'DE', 'homePath' => 'home', 'legalName' => 'Elektro Bernhard GmbH', 'street' => 'Ooser Hauptstr. 51', 'city' => 'Baden-Baden', 'localBusiness' => '1',
'hours' => $hours, 'areaServed' => "Baden-Baden\nRastatt\n\nKarlsruhe, Offenburg\nRastatt"]);
preg_match('#<script type="application/ld\+json">(.*?)</script>#s', $this->request('/')->getContent(), $match);
$data = json_decode(html_entity_decode($match[1], ENT_QUOTES), true);
// Gleiche Zeiten werden zu einer Angabe, der geschlossene Sonntag fehlt, Orte sind eindeutig.
self::assertSame([
['@type' => 'OpeningHoursSpecification', 'dayOfWeek' => ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'], 'opens' => '07:30', 'closes' => '17:00'],
['@type' => 'OpeningHoursSpecification', 'dayOfWeek' => ['Saturday'], 'opens' => '09:00', 'closes' => '12:00'],
], $data['openingHoursSpecification']);
self::assertSame(['Baden-Baden', 'Rastatt', 'Karlsruhe', 'Offenburg'], $data['areaServed']);
}
public function testReSavingLoadedSettingsKeepsHoursAndServiceArea(): void
{
$this->site->save(['country' => 'DE', 'homePath' => 'home', 'hours' => ['Monday' => ['opens' => '07:30', 'closes' => '17:00']], 'areaServed' => 'Bühl
Achern']);
// So gibt das Anlegen der Rechtsseiten die Einstellungen zurück: geladen, unverändert.
$loaded = $this->site->load();
$this->site->save([...$loaded, 'sameAs' => '', 'consentGroups' => $loaded['consentGroups']]);
self::assertSame([['day' => 'Monday', 'opens' => '07:30', 'closes' => '17:00']], $this->site->load()['openingHours']);
self::assertSame(['Bühl', 'Achern'], $this->site->load()['areaServed']);
}
/** @return iterable<string, array{array<string, mixed>}> */
public static function refusedOpeningHours(): iterable
{
yield 'closes before opens' => [['Monday' => ['opens' => '17:00', 'closes' => '07:30']]];
yield 'not a time' => [['Monday' => ['opens' => '7.30', 'closes' => '17:00']]];
yield 'only one half' => [['Monday' => ['opens' => '07:30', 'closes' => '']]];
}
#[DataProvider('refusedOpeningHours')]
public function testOpeningHoursMustBeAPairOfTimes(array $hours): void
{
$this->expectException(InvalidPage::class);
$this->site->save(['country' => 'DE', 'homePath' => 'home', 'hours' => $hours]);
}
public function testAnAccordionMarkedAsFaqBecomesAFaqPage(): void
{
$document = DemoContent::starter('Fragen');
$document['schemaVersion'] = 23;
$item = static fn (string $id, string $q, string $a): array => ['id' => $id, 'type' => 'accordionitem', 'props' => ['title' => $q, 'open' => false], 'children' => '' === $a ? [] : [['id' => $id.'-t', 'type' => 'text', 'props' => ['text' => $a]]]];
$document['blocks'][] = ['id' => 'faq', 'type' => 'accordion', 'props' => ['faq' => true], 'children' => [
$item('f1', 'Wo sind Sie im Einsatz?', 'In <strong>Baden-Baden</strong> &amp; Umgebung.'),
$item('f2', 'Ohne Antwort?', ''),
]];
$document['blocks'][] = ['id' => 'plain', 'type' => 'accordion', 'children' => [$item('p1', 'Kein FAQ', 'Nur ein Akkordeon.')]];
$this->pages->publish('page-1', $this->pages->saveDraft('page-1', $document, 0), 1);
preg_match_all('#<script type="application/ld\+json">(.*?)</script>#s', $this->request('/')->getContent(), $matches);
$faq = array_values(array_filter(array_map(static fn (string $json): array => json_decode(html_entity_decode($json, ENT_QUOTES), true), $matches[1]), static fn (array $d): bool => 'FAQPage' === $d['@type']));
self::assertCount(1, $faq);
// Nur das gekennzeichnete Akkordeon, nur Einträge mit Antwort, ohne Auszeichnungen im Text.
self::assertSame([['@type' => 'Question', 'name' => 'Wo sind Sie im Einsatz?', 'acceptedAnswer' => ['@type' => 'Answer', 'text' => 'In Baden-Baden & Umgebung.']]], $faq[0]['mainEntity']);
// Ohne Schema v23 wird die Kennzeichnung abgewiesen.
$document['schemaVersion'] = 22;
$this->expectException(InvalidDocument::class);
$this->pages->saveDraft('page-1', $document, 1);
}
public function testASocialProfileMustBeAnHttpsAddress(): void
{
$this->expectException(InvalidPage::class);
@@ -3824,6 +3911,44 @@ final class CmsTest extends TestCase
self::assertSame(404, $this->request('/einwilligung')->getStatusCode());
}
public function testTheConsentQuestionTakesLayoutShapeAndColoursFromTheSettings(): void
{
$this->pages->publish('page-1', $this->pages->saveDraft('page-1', DemoContent::pages()['home'], 0), 1);
$this->askConsent();
// Standard: Karte, abgerundet, Themefarben - im Kopf stehen nur die Radien.
$html = $this->request('/')->getContent();
self::assertStringContainsString('consent-layout-karte', $html);
self::assertStringContainsString('--kant-consent-radius:18px;--kant-consent-button-radius:10px', $html);
self::assertStringNotContainsString('--kant-consent-bg', $html);
self::assertStringContainsString('Externe Inhalte und Einwilligung', $html);
// Eigene Werte: Palette wird zur Variablen, ein unbekannter Schlüssel fällt weg statt
// auf nichts zu zeigen, die Überschrift steht escaped im Markup.
$this->site->save(['homePath' => 'home', 'consentBanner' => '1', 'consentGroups' => ['external'], 'privacyPath' => 'datenschutz',
'consentLayout' => 'leiste', 'consentShape' => 'rund', 'consentTitle' => 'Cookies & Co.',
'consentColor' => '#101820', 'consentInk' => '#ffffff', 'consentAccent' => '@ink', 'consentAccentInk' => '@nope']);
$response = $this->request('/');
$html = $response->getContent();
self::assertStringContainsString('consent-layout-leiste', $html);
self::assertStringContainsString('--kant-consent-radius:28px;--kant-consent-button-radius:999px;--kant-consent-bg:#101820;--kant-consent-ink:#ffffff;--kant-consent-accent:var(--k-ink)}', $html);
self::assertStringNotContainsString('--kant-consent-accent-ink', $html);
self::assertStringContainsString('Cookies &amp; Co.', $html);
self::assertStringContainsString("style-src 'self' 'sha256-", (string) $response->headers->get('Content-Security-Policy'));
// Die Einwilligungsseite trägt dieselben Werte, erlaubt per Hash und sonst nichts.
$page = $this->request('/einwilligung');
self::assertSame(200, $page->getStatusCode());
self::assertStringContainsString('--kant-consent-bg:#101820', $page->getContent());
$policy = (string) $page->headers->get('Content-Security-Policy');
self::assertStringContainsString("style-src 'self' 'sha256-", $policy);
self::assertStringContainsString("script-src 'none'", $policy);
// Eine Farbe, die weder Hex noch Palettenschlüssel ist, wird nicht gespeichert.
$this->expectException(InvalidPage::class);
$this->site->save(['homePath' => 'home', 'consentBanner' => '1', 'consentGroups' => ['external'], 'privacyPath' => 'datenschutz', 'consentColor' => 'red']);
}
public function testTheQuestionAppearsUntilItIsAnsweredAndCanBeChangedAgain(): void
{
$document = DemoContent::pages()['home'];