techadmin
21cd2c7c3f
Das alte Random-Network-Mesh wirkte unbestimmt — neu als drei wiederholte Sonith-Logo-Sterne in unterschiedlichen Skalen, sodass die Marken-DNA klar durchscheint. - Jeder Cluster: zentraler gefuellter Knoten + pulsierender Ring + 5 strahlenfoermige Linien zu Aussenknoten in der originalen Logo-Anordnung (asymmetrisch nach rechts verlaengert wie im CI-Logo) - Cluster A links-mitte (Skala 6, dominant), Cluster B rechts oben (3.5), Cluster C rechts unten (2.5) — gestaffelte Tiefe - Ring atmet (scale + opacity), Core pulsiert mit Glow, Aussenknoten asynchron via inline animation-delay - Linien als gestrichelte Petrol-Bahnen mit stroke-dashoffset-Datenfluss Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
77 lines
2.7 KiB
Markdown
77 lines
2.7 KiB
Markdown
# CLAUDE.md — sonith.de Website
|
|
|
|
> Projektspezifische Anweisungen für Claude Code.
|
|
|
|
## Projekt
|
|
|
|
**sonith.de** — Statischer One-Pager für die Sonith GmbH (MSP / Managed Service Provider).
|
|
|
|
- **Repository**: https://gitea.sonith.de/techadmin/sonith-website
|
|
- **Stack**: Pures HTML + CSS + JS, TailwindCSS via CDN
|
|
- **Deployment**: Statische Dateien auf eigenem Server (Nginx)
|
|
|
|
## Projektstruktur
|
|
|
|
```
|
|
sonith-website/
|
|
├── CLAUDE.md # Diese Datei
|
|
├── index.html # One-Pager Hauptseite
|
|
├── impressum.html # Impressum (separate Seite)
|
|
├── datenschutz.html # Datenschutzerklärung (separate Seite)
|
|
├── css/
|
|
│ └── style.css # Custom Styles (Animationen, Feintuning)
|
|
├── js/
|
|
│ └── main.js # Mobile Menu, Smooth Scroll, Scroll-Spy
|
|
├── img/
|
|
│ ├── logo.svg # Original-Logo (CI-konform, fuer hellen BG)
|
|
│ └── logo-light.svg # Helle Variante fuer dunklen BG (auf der Seite verwendet)
|
|
├── src/ # CI-Quelldateien (nicht oeffentlich serven)
|
|
│ ├── Logo und CI Handbuch.pdf
|
|
│ └── logo.svg # Original-SVG vom Designer
|
|
├── fonts/ # Inter-Font (lokal gehostet, DSGVO-konform)
|
|
├── .gitignore
|
|
└── README.md
|
|
```
|
|
|
|
**Hinweis:** `src/` enthält interne CI-Quelldateien und sollte vom Webserver
|
|
ausgeschlossen werden (z. B. via Nginx-`location /src { deny all; }`).
|
|
|
|
## Farbschema (CI-konform)
|
|
|
|
Quelle: `src/Logo und CI Handbuch.pdf` (Sonith UG, Apr 2019).
|
|
|
|
**Logofarben** (Primär):
|
|
- `#DEDC1E` — Sonith Gelb-Grün (Pantone 381 C) — Hauptakzent
|
|
- `#848687` — CI-Grau (Pantone 424 C) — Subtexte
|
|
- `#C8C9CA` — CI-Hellgrau (Pantone Coolgray 5 C) — Fließtext auf dunkel
|
|
|
|
**Störer-/Gegenfarbe** (Sekundär):
|
|
- `#067391` — Petrol (Gegenfarbe Logo) — Sekundär-Buttons, Borders, Akzente
|
|
- `#3a96b0` — Petrol hell (Hover)
|
|
- `#045066` — Petrol dunkel (Borders/Töne)
|
|
|
|
**Hintergrund** (petrol-getöntes Dunkel statt generisches Slate):
|
|
- `#0a1f28` — Basis (`bg-dark`)
|
|
- `#102b38` — Sektion alternierend (`bg-dark-light`)
|
|
- `#1a3d4d` — Akzent-Hintergrund (`bg-dark-lighter`)
|
|
|
|
Tailwind-Tokens: `sonith`, `petrol`, `ci-gray`, `dark` — siehe Tailwind-Config inline in den HTML-Dateien.
|
|
|
|
Grundstimmung: Dunkel-modern, Sonith-Gelb als Hauptakzent, Petrol als Sekundärakzent (entspricht der CI-Vorgabe „Störer- und Gegenfarbe Logo").
|
|
|
|
## Konventionen
|
|
|
|
- Keine Build-Tools, kein Node.js — alles statisch
|
|
- TailwindCSS ausschließlich via CDN
|
|
- Inhalte auf Deutsch
|
|
- SVG-Icons inline im HTML
|
|
- Responsive, Mobile-first
|
|
|
|
## Deployment
|
|
|
|
Statische Dateien direkt auf Nginx ausliefern. Kein Build-Step notwendig.
|
|
|
|
---
|
|
|
|
*Zuletzt aktualisiert: Mai 2026 — v1.5.1 (Mesh als Logo-Cluster überarbeitet)*
|