feat: Hero im Goldenen Schnitt, Cluster als interaktiver Service-Picker (v1.6.0)
- 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>
This commit is contained in:
+1
-1
@@ -91,7 +91,7 @@
|
||||
<div class="flex flex-col sm:flex-row items-center justify-between gap-4">
|
||||
<div class="flex items-center gap-3">
|
||||
<p class="text-ci-gray text-sm">© 2026 sonith UG (haftungsbeschränkt)</p>
|
||||
<span class="text-ci-gray/60 text-xs">v1.5.1</span>
|
||||
<span class="text-ci-gray/60 text-xs">v1.6.0</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-6">
|
||||
<a href="impressum.html" class="text-sonith text-sm">Impressum</a>
|
||||
|
||||
Reference in New Issue
Block a user