chore: integrate local imgproxy sidecar and unify list components
Some checks failed
Build & Deploy / 🔍 Prepare (push) Successful in 36s
Build & Deploy / 🧪 QA (push) Successful in 4m2s
Build & Deploy / 🏗️ Build (push) Successful in 10m53s
Build & Deploy / 🚀 Deploy (push) Successful in 27s
Build & Deploy / 🩺 Health Check (push) Failing after 11s
Build & Deploy / 🔔 Notify (push) Successful in 2s

- Added imgproxy service to docker-compose.dev.yml with URL mapping
- Implemented robust Base64 encoding for imgproxy source URLs
- Synchronized NEXT_PUBLIC_IMGPROXY_URL and NEXT_PUBLIC_BASE_URL
- Refactored About page to use existing marc-mintel.png asset
- Created shared IconList component and unified list styles project-wide
- Fixed vertical alignment issues in IconList items
- Updated dev script with aggressive port 3000 and lock file cleanup
This commit is contained in:
2026-02-13 22:03:35 +01:00
parent 43b96bb84b
commit 7c774f65bc
11 changed files with 409 additions and 103 deletions

View File

@@ -23,6 +23,7 @@ import {
} from "../../src/components/Typography";
import { BackgroundGrid, Card, Container } from "../../src/components/Layout";
import { Button } from "../../src/components/Button";
import { IconList, IconListItem } from "../../src/components/IconList";
export default function AboutPage() {
return (
@@ -51,11 +52,10 @@ export default function AboutPage() {
<div className="relative w-40 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">
<Image
src="https://img.infra.mintel.me/unsafe/rs:fill:800:800/plain/https://picsum.photos/seed/marc/800/800"
src="/marc-mintel.png"
alt="Marc Mintel"
fill
className="object-cover grayscale transition-all duration-1000 ease-in-out scale-110 group-hover:scale-100 group-hover:grayscale-0"
unoptimized
/>
</div>
</div>
@@ -116,18 +116,17 @@ export default function AboutPage() {
Ergebnisse, nicht Prozesse.
</span>
</LeadText>
<ul className="space-y-4">
<IconList className="space-y-4">
{[
"Komplexe Systeme vereinfacht",
"Performance-Probleme gelöst",
"Nachhaltige Software-Architekturen gebaut",
].map((item, i) => (
<li key={i} className="flex items-center gap-4 group">
<div className="w-1.5 h-1.5 bg-slate-900 rounded-full group-hover:scale-150 transition-transform" />
<IconListItem key={i} bullet>
<BodyText className="text-lg">{item}</BodyText>
</li>
</IconListItem>
))}
</ul>
</IconList>
</div>
</Reveal>
<Reveal delay={0.2}>
@@ -307,8 +306,8 @@ export default function AboutPage() {
</div>
<div className="space-y-8">
<div className="space-y-6">
<Label className="text-slate-900">Sondern:</Label>
<div className="space-y-8">
<Label className="text-slate-900">Sondern (fix):</Label>
<IconList className="space-y-8">
{[
{
label: "Direkte Kommunikation",
@@ -323,21 +322,16 @@ export default function AboutPage() {
desc: "Code, der hält, was er verspricht.",
},
].map((item, i) => (
<Reveal key={i} delay={0.2 + i * 0.1}>
<div className="flex gap-6 items-start group">
<div className="w-8 h-8 rounded-full bg-slate-900 flex items-center justify-center shrink-0 mt-1 group-hover:scale-110 transition-transform">
<Check className="w-4 h-4 text-white" />
</div>
<div className="space-y-1">
<H4 className="text-xl">{item.label}</H4>
<BodyText className="text-base text-slate-400">
{item.desc}
</BodyText>
</div>
<IconListItem key={i} check>
<div className="space-y-1">
<H4 className="text-xl leading-none">{item.label}</H4>
<BodyText className="text-base text-slate-400">
{item.desc}
</BodyText>
</div>
</Reveal>
</IconListItem>
))}
</div>
</IconList>
</div>
</div>
</div>