mmintel/mintel.me
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

about
Some checks failed
Build & Deploy Mintel Blog / build-and-deploy (push) Failing after 57s
Details

Browse Source
This commit is contained in:
Marc Mintel
2026-01-30 23:08:37 +01:00
parent 6beaf3c0aa
commit 03fa2ea4a9
12 changed files with 683 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/Footer.tsx
View File

@@ -23,6 +23,7 @@ export const Footer: React.FC = () => {
<div className="flex flex-col md:items-end gap-4 text-sm font-mono text-slate-300 uppercase tracking-widest">
<span>© {currentYear}</span>
<div className="flex gap-8">
<a href="/about" className="hover:text-slate-900 transition-colors no-underline">Über mich</a>
<a href="/contact" className="hover:text-slate-900 transition-colors no-underline">Kontakt</a>
<a href="https://github.com/marcmintel" className="hover:text-slate-900 transition-colors no-underline">GitHub</a>
</div>

16
src/components/Header.tsx
View File

@@ -39,16 +39,24 @@ export const Header: React.FC = () => {
</Link>
<nav className="flex items-center gap-8">
<Link
href="/websites"
<Link
href="/about"
className={`text-xs font-bold uppercase tracking-widest transition-colors ${
isActive('/about') ? 'text-slate-900' : 'text-slate-400 hover:text-slate-900'
}`}
>
Über mich
</Link>
<Link
href="/websites"
className={`text-xs font-bold uppercase tracking-widest transition-colors ${
isActive('/websites') ? 'text-slate-900' : 'text-slate-400 hover:text-slate-900'
}`}
>
Websites
</Link>
<Link
href="/blog"
<Link
href="/blog"
className={`text-xs font-bold uppercase tracking-widest transition-colors ${
isActive('/blog') || pathname?.startsWith('/blog/') ? 'text-slate-900' : 'text-slate-400 hover:text-slate-900'
}`}

64
src/components/Landing/Illustrations/ExperienceIllustration.tsx Normal file
View File

@@ -0,0 +1,64 @@
'use client';
import * as React from 'react';
import { motion } from 'framer-motion';
import { IllustrationProps } from './types';
export const ExperienceIllustration: React.FC<IllustrationProps> = ({ className = "", delay = 0 }) => (
<svg className={className} viewBox="0 0 120 120" fill="none" xmlns="http://www.w3.org/2000/svg">
{/* Timeline line */}
<motion.path
d="M 20 100 H 100"
stroke="currentColor"
strokeWidth="1"
className="text-slate-200"
initial={{ pathLength: 0 }}
whileInView={{ pathLength: 1 }}
viewport={{ once: true }}
transition={{ duration: 1.5, delay }}
/>
{/* Experience nodes */}
{[
{ x: 30, y: 80, label: "Agency" },
{ x: 50, y: 60, label: "Corp" },
{ x: 70, y: 40, label: "Startup" },
{ x: 90, y: 20, label: "Now" }
].map((node, i) => (
<React.Fragment key={i}>
<motion.circle
cx={node.x} cy={node.y} r="4"
className={i === 3 ? "fill-slate-900" : "fill-slate-300"}
initial={{ scale: 0 }}
whileInView={{ scale: 1 }}
viewport={{ once: true }}
transition={{ delay: delay + 0.5 + i * 0.2, type: "spring" }}
/>
{i > 0 && (
<motion.path
d={`M ${30 + (i-1)*20} ${80 - (i-1)*20} L ${node.x} ${node.y}`}
stroke="currentColor"
strokeWidth="1"
className="text-slate-200"
initial={{ pathLength: 0 }}
whileInView={{ pathLength: 1 }}
viewport={{ once: true }}
transition={{ duration: 0.5, delay: delay + 0.5 + (i-1) * 0.2 }}
/>
)}
</React.Fragment>
))}
{/* 15+ Years indicator */}
<motion.text
x="20" y="115"
className="text-[8px] font-bold fill-slate-400 uppercase tracking-widest"
initial={{ opacity: 0 }}
whileInView={{ opacity: 1 }}
viewport={{ once: true }}
transition={{ delay: delay + 1.5 }}
>
15+ YEARS
</motion.text>
</svg>
);

52
src/components/Landing/Illustrations/ResponsibilityIllustration.tsx Normal file
View File

@@ -0,0 +1,52 @@
'use client';
import * as React from 'react';
import { motion } from 'framer-motion';
import { IllustrationProps } from './types';
export const ResponsibilityIllustration: React.FC<IllustrationProps> = ({ className = "", delay = 0 }) => (
<svg className={className} viewBox="0 0 120 120" fill="none" xmlns="http://www.w3.org/2000/svg">
{/* Shield / Responsibility shape */}
<motion.path
d="M 60 20 L 90 35 V 65 C 90 85 60 100 60 100 C 60 100 30 85 30 65 V 35 L 60 20 Z"
stroke="currentColor"
strokeWidth="1"
className="text-slate-900"
initial={{ pathLength: 0, fill: "rgba(15, 23, 42, 0)" }}
whileInView={{ pathLength: 1, fill: "rgba(15, 23, 42, 0.05)" }}
viewport={{ once: true }}
transition={{ duration: 1.5, delay }}
/>
{/* Core point */}
<motion.circle
cx="60" cy="55" r="8"
className="fill-slate-900"
initial={{ scale: 0 }}
whileInView={{ scale: 1 }}
viewport={{ once: true }}
transition={{ delay: delay + 1, type: "spring" }}
/>
{/* Responsibility lines */}
{[0, 120, 240].map((angle, i) => {
const x1 = 60 + Math.cos((angle * Math.PI) / 180) * 12;
const y1 = 55 + Math.sin((angle * Math.PI) / 180) * 12;
const x2 = 60 + Math.cos((angle * Math.PI) / 180) * 30;
const y2 = 55 + Math.sin((angle * Math.PI) / 180) * 30;
return (
<motion.line
key={i}
x1={x1} y1={y1} x2={x2} y2={y2}
stroke="currentColor"
strokeWidth="1"
className="text-slate-400"
initial={{ pathLength: 0 }}
whileInView={{ pathLength: 1 }}
viewport={{ once: true }}
transition={{ delay: delay + 1.2 + i * 0.2 }}
/>
);
})}
</svg>
);

54
src/components/Landing/Illustrations/ResultIllustration.tsx Normal file
View File

@@ -0,0 +1,54 @@
'use client';
import * as React from 'react';
import { motion } from 'framer-motion';
import { IllustrationProps } from './types';
export const ResultIllustration: React.FC<IllustrationProps> = ({ className = "", delay = 0 }) => (
<svg className={className} viewBox="0 0 120 120" fill="none" xmlns="http://www.w3.org/2000/svg">
{/* Result Box */}
<motion.rect
x="30" y="30" width="60" height="60" rx="4"
stroke="currentColor"
strokeWidth="1"
className="text-slate-900"
initial={{ pathLength: 0, rotate: -10, opacity: 0 }}
whileInView={{ pathLength: 1, rotate: 0, opacity: 1 }}
viewport={{ once: true }}
transition={{ duration: 1, delay }}
/>
{/* Checkmark */}
<motion.path
d="M 45 60 L 55 70 L 75 50"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
className="text-slate-900"
initial={{ pathLength: 0 }}
whileInView={{ pathLength: 1 }}
viewport={{ once: true }}
transition={{ duration: 0.5, delay: delay + 1 }}
/>
{/* Sparkles */}
{[
{ x: 25, y: 25 },
{ x: 95, y: 35 },
{ x: 85, y: 95 }
].map((pos, i) => (
<motion.path
key={i}
d={`M ${pos.x} ${pos.y-4} V ${pos.y+4} M ${pos.x-4} ${pos.y} H ${pos.x+4}`}
stroke="currentColor"
strokeWidth="1"
className="text-slate-300"
initial={{ scale: 0, opacity: 0 }}
whileInView={{ scale: 1, opacity: 1 }}
viewport={{ once: true }}
transition={{ delay: delay + 1.5 + i * 0.2, type: "spring" }}
/>
))}
</svg>
);

3
src/components/Landing/Illustrations/index.ts
View File

@@ -10,3 +10,6 @@ export * from './ConceptTarget';
export * from './ConceptMessy';
export * from './HeroArchitecture';
export * from './HeroMainIllustration';
export * from './ExperienceIllustration';
export * from './ResponsibilityIllustration';
export * from './ResultIllustration';

1
src/components/Landing/index.ts
View File

@@ -1,6 +1,7 @@
export * from './AbstractLines';
export * from './ExplanatoryIllustrations';
export * from './ConceptIllustrations';
export * from './Illustrations';
export * from './ComparisonRow';
export * from './FeatureCard';
export * from './HeroItem';

24
src/types/images.d.ts vendored Normal file
View File

@@ -0,0 +1,24 @@
declare module '*.svg' {
const content: any;
export default content;
}
declare module '*.webp' {
const content: any;
export default content;
}
declare module '*.png' {
const content: any;
export default content;
}
declare module '*.jpg' {
const content: any;
export default content;
}
declare module '*.jpeg' {
const content: any;
export default content;
}

4
src/types/svg.d.ts vendored
View File

@@ -1,4 +0,0 @@
declare module '*.svg' {
const content: any;
export default content;
}