feat: redesign page heroes, implement organic markers, and streamline contact flow
Some checks failed
Build & Deploy / 🔍 Prepare (push) Successful in 6s
Build & Deploy / 🧪 QA (push) Failing after 1m24s
Build & Deploy / 🏗️ Build (push) Failing after 4m3s
Build & Deploy / 🚀 Deploy (push) Has been skipped
Build & Deploy / 🩺 Health Check (push) Has been skipped
Build & Deploy / 🔔 Notify (push) Successful in 5s

- Refined hero sections for About, Blog, Websites, and Case Studies for a bespoke industrial entry point.
- Redesigned Marker component using layered SVG paths for an organic, hand-drawn highlighter effect.
- Restored technical precision in ArchitectureVisualizer with refined line thickness.
- Streamlined contact page by removing generic headers and prioritizing the configurator/gateway.
- Updated technical references to reflect self-hosted Gitea infrastructure.
- Cleaned up unused imports and addressed linting warnings across modified pages.
This commit is contained in:
2026-02-16 19:34:08 +01:00
parent cb32b9d62f
commit 9cfe7ee9e5
58 changed files with 3231 additions and 1592 deletions

View File

@@ -1,7 +1,6 @@
"use client";
import Image from "next/image";
import { PageHeader } from "../../src/components/PageHeader";
import { Section } from "../../src/components/Section";
import { Reveal } from "../../src/components/Reveal";
import {
@@ -15,6 +14,7 @@ import {
} from "../../src/components/Landing";
import { Check } from "lucide-react";
import {
H1,
H3,
H4,
LeadText,
@@ -36,17 +36,16 @@ import { Marker } from "../../src/components/Marker";
export default function AboutPage() {
return (
<div className="flex flex-col bg-white overflow-hidden relative">
<AbstractCircuit />
{/* Background decoration removed per user request */}
{/* Hero Section */}
<section className="relative pt-12 md:pt-32 pb-8 md:pb-24 overflow-hidden border-b border-slate-50">
<Container variant="narrow" className="relative z-10">
<div className="flex flex-col items-center text-center space-y-6 md:space-y-12">
<Reveal>
<Reveal width="fit-content">
<div className="relative">
{/* Structural rings around avatar */}
<div className="absolute inset-0 -m-6 md:-m-8 border border-slate-100 rounded-full animate-[spin_30s_linear_infinite] opacity-50" />
<div className="absolute inset-0 -m-3 md:-m-4 border border-slate-200 rounded-full animate-[spin_20s_linear_infinite_reverse] opacity-30" />
{/* Structural rings removed per user request */}
<div className="relative w-32 h-32 md:w-40 md:h-40 rounded-full overflow-hidden border border-slate-200 shadow-xl bg-white p-1 group">
<div className="w-full h-full rounded-full overflow-hidden relative aspect-square">
@@ -75,15 +74,17 @@ export default function AboutPage() {
<div className="h-px w-6 md:w-8 bg-slate-900"></div>
</div>
</Reveal>
<PageHeader
title={
<>
Über <span className="text-slate-400">mich.</span>
</>
}
description="15 Jahre Erfahrung. Ein Ziel: Websites, die ihre Versprechen halten."
className="pt-0 md:pt-0"
/>
<Reveal delay={0.2}>
<H1 className="text-4xl md:text-8xl leading-none tracking-tighter">
Über <span className="text-slate-400">mich.</span>
</H1>
</Reveal>
<Reveal delay={0.3}>
<p className="text-slate-400 font-medium max-w-xl mx-auto text-sm md:text-xl">
15 Jahre Erfahrung. Ein Ziel: Websites, die ihre Versprechen
halten.
</p>
</Reveal>
</div>
</div>
</Container>
@@ -237,8 +238,8 @@ export default function AboutPage() {
</H3>
</Reveal>
<div className="grid grid-cols-1 md:grid-cols-2 gap-12">
<div className="space-y-8">
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 md:gap-12 items-start">
<div className="space-y-8 min-w-0">
<Reveal delay={0.1}>
<LeadText className="text-lg md:text-xl text-slate-400">
Keine Hierarchien, keine Ausreden. Wenn etwas nicht passt,
@@ -270,7 +271,7 @@ export default function AboutPage() {
</div>
{/* Decorative terminal */}
<Reveal delay={0.3}>
<Reveal delay={0.3} className="min-w-0">
<CodeSnippet variant="terminal" className="opacity-70" />
</Reveal>
</div>