Chneemann/portfolio
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

style: polish visual layout, text contrast and margins

Browse source
This commit is contained in:
Chneemann 2026-07-20 22:40:11 +02:00
parent 1a7d8b8ab6
commit b377ac8b90
2 changed files with 10 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
src/components/Aboutme.tsx
View file

@ -2,19 +2,19 @@ export default function Aboutme() {
return (
<section
id="aboutme"
className="relative py-14 px-6 md:px-12 max-w-5xl mx-auto border-t border-slate-900/50 scroll-mt-20"
className="relative py-8 px-6 md:px-12 max-w-5xl mx-auto border-t border-slate-900/50 scroll-mt-20"
>
{/* Titel */}
<div className="flex items-center gap-4 mb-6">
<h2 className="text-3xl font-bold text-white tracking-tight">
About me<span className="text-blue-500">.</span>
</h2>
<div className="h-1px bg-slate-800 grow max-w-md" />
<div className="h-px bg-slate-800 grow max-w-md" />
</div>
<div className="grid grid-cols-1 md:grid-cols-12 gap-12 items-start">
{/* Left column */}
<div className="md:col-span-7 space-y-6 text-slate-400 leading-relaxed text-base">
<div className="md:col-span-7 space-y-6 text-slate-200 leading-relaxed text-base">
<p>
Hey there! I'm André, a full-stack developer from Karlsruhe. I had a
passion for coding since childhood when I first got my hands on a
@ -58,7 +58,10 @@ export default function Aboutme() {
<div className="relative group p-6 rounded-2xl border border-slate-800 bg-slate-900/50 backdrop-blur-sm space-y-6 hover:border-slate-700/80 transition-colors duration-300">
<div className="absolute top-0 right-0 w-24 h-24 bg-blue-500/5 rounded-full blur-2xl pointer-events-none group-hover:bg-blue-500/10 transition-colors duration-300" />
<h3 className="text-lg font-semibold text-white">Quick Facts</h3>
<h3 className="text-lg font-semibold text-white mb-4 flex items-center gap-2">
<span className="text-blue-500 font-mono text-sm">//</span> Quick
Facts
</h3>
<ul className="space-y-4 text-sm">
<li className="flex items-center gap-3">

6
src/components/Hero.tsx
View file

@ -2,7 +2,7 @@ import Link from "next/link";
export default function Hero() {
return (
<section className="relative flex items-start pt-32 pb-2 px-6 md:px-12 max-w-5xl mx-auto overflow-hidden">
<section className="relative flex items-start pt-32 py-8 px-6 md:px-12 max-w-5xl mx-auto overflow-hidden">
{/* Blue background glow */}
<div className="absolute top-2/4 left-1/6 -translate-x-1/2 -translate-y-1/2 w-72 h-72 bg-blue-500/10 rounded-full blur-3xl pointer-events-none" />
<div className="absolute bottom-2/4 right-2/4 translate-x-1/2 translate-y-1/2 w-96 h-96 bg-blue-600/5 rounded-full blur-3xl pointer-events-none" />
@ -38,13 +38,13 @@ export default function Hero() {
<div className="flex flex-wrap gap-4 pt-4">
<Link
href="#contactme"
className="px-6 py-3 border border-blue-700/30 hover:bg-blue-500 active:bg-blue-700 text-white font-medium rounded-lg shadow-lg shadow-blue-500/40 transition-all hover:-translate-y-0.5 duration-200"
className="px-6 py-3 border border-blue-700/30 hover:bg-blue-500 active:bg-blue-700 text-white font-semibold rounded-lg shadow-lg shadow-blue-500/40 transition-all hover:-translate-y-0.5 duration-200"
>
Contact me
</Link>
<Link
href="https://andre-kempf.com/assets/downloads/Andre_Kempf_Lebenslauf_2025.pdf"
className="px-6 py-3 bg-slate-900 border border-slate-800 hover:border-slate-700 hover:bg-slate-850 text-slate-200 font-medium rounded-lg transition-all hover:-translate-y-0.5 duration-200"
className="px-6 py-3 bg-slate-900 border border-slate-800 hover:border-slate-700 hover:bg-slate-850 text-slate-200 font-semibold rounded-lg transition-all hover:-translate-y-0.5 duration-200"
>
Download CV
</Link>