4.0 KiB
CLAUDE.md
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
What this repo is
Static one-page website for Marszalek Architekten (Perchtoldsdorf, Austria). No build system, no framework — the entire site is a single index.html served by nginx inside Docker. A 2-page A4 PDF info sheet lives alongside it as a pre-generated static asset.
Key commands
Regenerate the PDF
Requires Node.js and Google Chrome installed locally. Close the PDF in any viewer first (Windows locks open files).
node generate-pdf.js
The script uses puppeteer-core with the system Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe. If Chrome moves, update executablePath in generate-pdf.js and generate-favicons.js.
Regenerate favicons
node generate-favicons.js
Reads favicon.svg and exports favicon-16x16.png, favicon-32x32.png, and apple-touch-icon.png via puppeteer. Run this whenever favicon.svg changes.
Build and run via Docker
docker compose up --build -d # build image and start on port 8082
docker compose down # stop
Install Node deps (only needed to regenerate the PDF or favicons locally)
npm install
Architecture
index.html ← entire website (HTML + CSS + JS)
images/ ← all portfolio photos, self-hosted (15 JPEGs)
favicon.svg ← master favicon (M monogram, green #99cc00 bg)
favicon-16x16.png ← ┐
favicon-32x32.png ← ├ generated from favicon.svg via generate-favicons.js
apple-touch-icon.png ← ┘
infosheet-template.html ← HTML source rendered to PDF by Puppeteer
generate-pdf.js ← Node script: opens template in Chrome → exports A4 PDF
generate-favicons.js ← Node script: renders favicon.svg → PNG at 3 sizes
marszalek-architekten-infosheet.pdf ← pre-generated output; committed to repo
nginx.conf ← caching, gzip, PDF download header
Dockerfile ← nginx:alpine; copies all static assets
docker-compose.yml ← single service, host port 8082 → container port 80
PDF workflow
infosheet-template.html is a self-contained 2-page A4 HTML document (mm units, print-color-adjust: exact, page-break-after: always between pages). generate-pdf.js loads it via a file:/// URL in headless Chrome, waits 1.5 s for Google Fonts, then calls page.pdf(). The output PDF is committed — Docker does not regenerate it at build time.
Website structure
index.html is a single-page site with five anchor-linked sections: #home (hero), #projekte (portfolio grid with JS category filter), #leistungen (services), #ueber-uns (team), #kontakt (contact + Google Maps iframe + PDF download banner). Portfolio images are served from the local images/ folder — do not revert to the WordPress CDN URLs, as the WordPress server blocks hotlinking on mobile. Google Fonts (Cormorant Garamond + Inter) are the only remaining external dependency.
Third-party integrations
- Analytics: Matomo at
analytics.stranto.com, site ID3— snippet is in<head>ofindex.html. - Map: Google Maps iframe embed (no API key) in the
#kontaktsection, centred on48.1176923, 16.2631144(Elisabethstraße 14, Perchtoldsdorf).
Brand colours
- Green accent:
#99cc00— nav bar background, PDF header, favicon background - Near-black:
#0f0f0f— body text, footer, favicon M lettermark - Grey-mid:
#999— used for secondary labels; defined as--grey-midinindex.html
Deployment (Portainer)
Stack points at https://git.stranto.com/cgasser/web_marszalekarchitekten, branch master. Site is available on the host at port 8082.
When content changes: edit index.html and/or infosheet-template.html, regenerate the PDF with node generate-pdf.js, commit all changed files, and redeploy the stack in Portainer.