joachimhummel 46358579c4 Redesign: Modernes SaaS-Design für Joachim Hummel Portfolio
Task #4 — vollständiges Redesign von dunkler Terminal-Ästhetik zu modernem SaaS-Look.

Änderungen:
- index.css: Komplette Neudefinition der CSS-Variablen. Helles Farbschema (weißer Hintergrund),
  Primärfarbe Indigo/Blau (hsl 234 89% 60%), neutrale Grautöne, Google Font Inter eingebunden.
  Utility-Klassen .section-number, .hero-gradient, .dot-pattern, .card-hover hinzugefügt.
  Terminal-spezifische Klassen (.glow-text, .glow-box, .bg-grid-pattern) entfernt.

- navbar.tsx: Sticky Nav mit transparentem Start → weißem Hintergrund + Schatten beim Scrollen.
  Logo "JH" als gefülltes Indigo-Badge + "Joachim Hummel" Text. Pill-Style Navigation Links.
  Primär-CTA Button. Vollständiges Mobile-Menü mit Hamburger/X Toggle.

- hero.tsx: Zentriertes Layout, großer Display-Headline mit Indigo-Akzent auf Nachname.
  "Verfügbar für neue Projekte" Badge mit grünem Puls. Skill-Badges (30+ Jahre, ITIL, etc.).
  Zwei CTAs: gefüllter Primärbutton + Outline-Button. Subtiler Radial-Gradient + Dot-Pattern.

- competencies.tsx: Sechs weiße Karten im Grid mit farbigen Icon-Badges (blau, sky, grün, orange,
  violett, rose). Tech-Icon-Leiste (Linux, Ubuntu, Docker, Grafana, Nginx, Ansible, Prometheus)
  mit Hover-Farbeffekt und Labels.

- strengths.tsx: Drei weiße Karten auf hellgrauem Hintergrund. Nummerierung (01/02/03) als
  dekoratives Element. Highlight-Badge je Karte. Kein Glow, kein Neon.

- projects.tsx: Sechs Projektkarten mit farbigen Icon-Badges je Projektkategorie. Externe Links
  für SafeDocs Portal (safedocsportal.com) und zensend.email als ArrowUpRight-Icon-Buttons.
  Pill-Badges für Tags.

- bio.tsx: Zweispaltiges Layout. Links: Fließtext + Kunden-Badges. Rechts: Weißes Highlights-Panel
  mit CheckCircle-Icons (7 Punkte inkl. ITIL, BSI, Tech-Blogger).

- contact.tsx: Primärfarbige E-Mail-Karte + drei kompakte Link-Cards (Tech-Blog, KI-Blog, Website).
  Footer-Zeile mit Name und Standort.

- home.tsx: Vereinfacht — kein Fixed-Background, kein Grid-Pattern, kein Ambient-Glow.
  max-w-6xl Container für alle Sektionen.
2026-05-15 15:40:45 +00:00
2026-05-13 03:54:14 +00:00
2026-05-13 03:54:14 +00:00
2026-05-13 03:54:14 +00:00
2026-05-13 03:54:14 +00:00
2026-05-13 03:54:14 +00:00
2026-05-13 03:54:14 +00:00
2026-05-13 03:54:14 +00:00
2026-05-13 03:54:14 +00:00
2026-05-13 03:54:14 +00:00
2026-05-13 03:54:14 +00:00
Description
No description provided
2 MiB
Languages
TypeScript 96.4%
CSS 1.6%
HTML 1.3%
JavaScript 0.7%