techadmin
57039e188b
- Hero-Layout: zweispaltiges Grid 1.618 : 1 (Goldener Schnitt) — Content
links, Logo-Cluster rechts; auf Mobile (<lg) gestackt, Cluster ausgeblendet
- Nur noch ein Cluster (statt drei) — groesser, dominanter, das exakte Logo-
Motiv: Center-Knoten + pulsierender Ring + 5 strahlenfoermige Linien zu
Aussenknoten in originaler Logo-Anordnung
- Jeder Knoten ist Anker-Link zu einer Leistungs-Karte:
Center → Managed Services (Hauptleistung)
TR → Managed Backup
R → Hosting
TL → ERP-Systeme
L → Netzwerk & Infrastruktur
B → Nextcloud
- Hover/Focus-Verstaerkung: Knoten skalieren auf 1.7x (Center 1.35x), kraeftiger
Doppel-Glow, Animation pausiert bei Hover
- Vergroesserte unsichtbare Klickflaeche (.node-hit) fuer komfortable Trefferquote
- Native SVG-Tooltips per <title>; smooth-scroll dank scroll-mt-32 an Karten
- a11y: aria-label am SVG, focus-visible Hervorhebung, prefers-reduced-motion
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
sonith.de — Website
Statischer One-Pager für sonith.de.
Stack
- HTML + CSS + JavaScript
- TailwindCSS (CDN)
- Kein Build-Step notwendig
Lokal testen
index.html im Browser öffnen — fertig.
Oder mit einem lokalen Server:
python3 -m http.server 8080
Dann http://localhost:8080 aufrufen.
Deployment
Statische Dateien auf den Webserver kopieren (Nginx/Apache).
Struktur
| Datei | Beschreibung |
|---|---|
index.html |
Hauptseite (One-Pager) |
impressum.html |
Impressum |
datenschutz.html |
Datenschutzerklärung |
css/style.css |
Custom Styles |
js/main.js |
Mobile Menu, Scroll-Spy, Animationen |
img/ |
Bilder und Platzhalter |
Lizenz
Proprietär — sonith UG (haftungsbeschränkt)