Spec docs/superpowers/specs/2026-10-01-relaunch-design.md (wartet auf Freigabe), Karte aus Natural Earth (gemeinfrei) mit Punkt Falkenstein, 19 Portal-Aufnahmen mit erfundenen Demodaten, Regeln für Cloud-Sitzungen in CLAUDE.md. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
63 lines
4.7 KiB
Markdown
63 lines
4.7 KiB
Markdown
# webklar.com
|
||
|
||
Website of WEBklar GbR (a small web agency in Winnweiler, Rhineland-Palatinate). Vite + React 18 + TypeScript + Tailwind + shadcn/ui, client-rendered SPA with React Router.
|
||
|
||
**Current project: the relaunch.** Read `docs/superpowers/specs/2026-10-01-relaunch-design.md` before any change. The material for it (Germany map, customer portal screenshots) is in `docs/relaunch/`.
|
||
|
||
Status: the spec is waiting for the owner's approval. Once it is approved, write an implementation plan with the `superpowers:writing-plans` skill and save it to `docs/superpowers/plans/`. Implement only after that.
|
||
|
||
## Commands
|
||
|
||
```bash
|
||
npm install
|
||
npm run dev # local dev server
|
||
npm test # Vitest + Testing Library (must stay green)
|
||
npm run build # production build into dist/
|
||
npm run lint # ESLint (main already has old errors; add no new ones)
|
||
```
|
||
|
||
## How this repository relates to the live site
|
||
|
||
- This GitHub repository is the **workspace**. Its `main` is **not** live.
|
||
- webklar.com is built from a separate internal repository on the owner's server. Only the owner, or a session on that server, transfers an approved state there. Never try to deploy from here.
|
||
|
||
## Rules
|
||
|
||
- **Language:** everything user-facing is German, in the polite form **"Sie"**. Brand spelling is always **"WEBklar"**. Write commit messages, PR texts and notes for the owner in German.
|
||
- **The wording of the legal pages stays unchanged without the owner's explicit OK:** `src/pages/AGB.tsx`, `Impressum.tsx`, `WartungsAbo.tsx`, `HostingAbo.tsx`, and the privacy policy (the `/datenschutz` redirect to the customer portal).
|
||
- For the new layout you may change their markup and CSS classes: remove their own header block, replace uppercase and old font/button classes.
|
||
- Keep their wording, order and structure.
|
||
- The tests in `src/test/abos.test.tsx`, `agb-haftung.test.tsx` and `agb-verguetung.test.tsx` protect them; never weaken or delete these three files.
|
||
- `src/test/sofort-paket.test.tsx` may be adapted where it pins old copy or removed components. Keep its source-code scans against banned statements.
|
||
- **No invented content:**
|
||
- no numbers without a source (no "99,9 %", no project counters);
|
||
- no references without the customer's consent (AGB § 13);
|
||
- no stock or AI images of people;
|
||
- no promises of success (AGB § 2: no result is owed);
|
||
- SEO only as a separately ordered service;
|
||
- support after launch only through the subscriptions.
|
||
- **Fixed facts:**
|
||
- Phone: only 0176 23726355 (`tel:+4917623726355`). E-mail: support@webklar.com.
|
||
- Reply time: only "spätestens am nächsten Werktag".
|
||
- Servers: Hetzner in Falkenstein/Vogtland, Saxony. This applies **only to the website and the customer portal**. Never write "all data in Germany".
|
||
- Prices are final prices, small-business rule § 19 UStG, no VAT. Hosting-Abo 20 € per month, Wartungs-Abo 50 € per month, 12 months minimum term each. Extra work 100 € per hour in 15-minute steps, only after approval.
|
||
- **Customer portal screenshots** show only the invented demo customer "Bäckerei Sonnenschein". Never use real customer data.
|
||
- **Privacy:** no requests to third-party servers. Host fonts, images and scripts yourself; no Google Fonts, no CDNs, no tracking.
|
||
- **Secrets:** never commit them. `.env` stays local; `.env.example` holds only public client IDs.
|
||
- **This repository may be public.** Do not check in internal data: price calculations, customer names without consent, server details, logins.
|
||
- **Before every push:** run `npm test`, `npm run build`, and `npm run lint` (no new errors). For visual changes, put screenshots in the pull request: 1440 × 900 and 390 × 844, light and dark.
|
||
- **Work on branches and merge through pull requests.** The relaunch branch is `relaunch`.
|
||
- **Code style:**
|
||
- Match the existing code.
|
||
- German comments where the code already uses them.
|
||
- Only `transform`/`opacity` animations, always behind `prefers-reduced-motion`. The spec section 8.4 lists the only exceptions: map outline drawing, a 3× pulse around the map dot, the rotating hero headline (one pass, with a pause button), and the scroll-linked word highlight.
|
||
- Hover effects only for `(hover: hover) and (pointer: fine)`.
|
||
|
||
## Structure (short)
|
||
|
||
- `src/routes.tsx`: all routes. Subpages share one layout with the footer (`SubpageLayout`).
|
||
- `src/App.tsx`: providers, `ScrollToTop`. It jumps to anchors such as `/#leistungen` once the fonts have loaded.
|
||
- `src/hooks/use-page-meta.ts`: title and description per route.
|
||
- `src/pages/`: pages. `src/components/`: sections and parts. `src/components/ui/`: shadcn.
|
||
- `src/test/`: tests. `sofort-paket.test.tsx` holds source-code scans against banned statements: the old phone number, Unsplash, "24 Stunden", "99,9", success promises. Keep these scans when sections are removed.
|