Pilot-Feedback 17.10.: Der Chat wirkte durchsichtig und verrutscht. - Handy: Inhalt steht fest zwischen Kopf und Leiste (wie das Blatt); die Eingabe sitzt höchstens 6 px über der Leiste bzw. dem Widerrufsstreifen und bei offener Tastatur am unteren Rand des sichtbaren Bereichs. "Chat" steht klein im Kopf (die H1 bleibt nur für Screenreader), der Kopf ist deckend mit Haarlinie, der Verlauf beginnt direkt darunter und scrollt in sich. - Desktop: Spalte in Fensterhöhe, Chat höchstens 760 px breit und mittig, Verlauf füllt die Höhe, Eingabe am unteren Spaltenrand. - Verlauf steht unten (neueste Nachricht sichtbar), kurze Verläufe unten bei der Eingabe; Blasen fremd #f8f9fb, eigen #ebeef1. - "Senden" bleibt schwarz, auch bei leerem Feld (gesperrt im Ansichtsmodus weiter gedämpft). - haltFokus: Druck auf Senden, Anhang oder Mikrofon nimmt dem Textfeld den Fokus nicht; sonst kommt die Leiste zurück, schiebt die feste Eingabe hoch und der Tipp auf "Senden" geht bei offener Tastatur verloren (im Browser nachgestellt). public/chat-composer.js und die alte Ansicht bleiben unverändert. Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
Webklar Kundenbereich
Kundenportal für Website-Projekte. Liest ausschließlich aus woms-database auf ticket.webklar.com (Ticketsystem). Es gibt keine eigene Portal-Datenbank mehr.
- Keine Kundenanlage im Portal
- Keine Admin-Funktionen
- Login über Appwrite Auth (ein User pro Kunde, verknüpft über
customers.appwriteUserId)
Verwaltung (Kunden, Passwörter, Projekte, Freischaltung): Ticketsystem.
Struktur
server/ Express-API, Appwrite, Gitea-Webhook
public/ Login & Dashboard (statisch)
Schnellstart
cp .env.example .env
# SESSION_SECRET (min. 32 Zeichen) und APPWRITE_API_KEY setzen
npm install
npm run dev
Öffnen: http://localhost:3000
API
| Methode | Pfad | Beschreibung |
|---|---|---|
| POST | /api/auth/login |
Appwrite Login + Portal-Prüfungen |
| POST | /api/auth/logout |
Session beenden |
| GET | /api/auth/me |
Aktueller Kunde |
| GET | /api/projects |
Eigene websiteProjects |
| GET | /api/features |
Eigene portalFeatures (enabled) |
| POST | /webhook/gitea?token=… |
Gitea Push → Deploy + DB-Update |
Appwrite
Schema und Collection-Anlage: siehe APPWRITE_SCHEMA.md.
Endpoint: https://ticket.webklar.com/v1
Project: 6a1058610003c5a13a05
Database: woms-database
Gitea / Preview
- Template: https://git.webklar.com/knso/webklar-preview-template.git
- Webhook-URL:
https://project.webklar.com/webhook/gitea - Secret:
GITEA_WEBHOOK_TOKENin.env - Vorschau:
https://<subdomain>.project.webklar.com
customerId wird im Ticketsystem am websiteProjects-Eintrag gesetzt, nicht im Webhook.
E-Mails
Alle automatischen Mails sind HTML-Vorlagen mit Textfassung in server/mail-templates/
(K01–K11 an Kunden, T01–T11 ans Team; Design aus Claude Design). Jede Vorlage nennt im
Kopfkommentar Betreff, Platzhalter ({{name}}) und optionale Blöcke
(<!-- WENN x --> … <!-- ENDE x -->). Eine neue Fassung aus dem Design kann die Datei direkt
ersetzen, solange Platzhalter und Blöcke gleich heißen; npm test prüft das. Das Logo in den
Mails liegt unter public/webklar-logo.png.
Deployment
npm start
# Reverse Proxy (nginx) → Port 3000
# PREVIEW_DEPLOY_ROOT für statische Vorschau-Dateien