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

design

Browse Source
This commit is contained in:
Marc Mintel
2026-01-29 21:50:28 +01:00
parent eafb740b1d
commit ae303d8a5a
12 changed files with 88 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/MediumCard.tsx
View File

@@ -24,22 +24,22 @@ export const MediumCard: React.FC<MediumCardProps> = ({ post }) => {
return (
<Link href={`/blog/${slug}`} className="group block">
<article className="space-y-3 py-8 border-b border-slate-50 group-hover:border-slate-900 transition-colors">
<time className="text-[10px] font-mono text-slate-300 uppercase tracking-widest group-hover:text-slate-900 transition-colors">
<article className="space-y-4 py-8 px-8 border border-slate-200 rounded-3xl group-hover:border-slate-400 transition-all duration-500 bg-white">
<time className="text-[10px] font-bold uppercase tracking-[0.2em] text-slate-400 group-hover:text-slate-900 transition-colors">
{formattedDate}
</time>
<h3 className="text-3xl font-bold text-slate-900 tracking-tighter group-hover:text-slate-900 transition-colors">
<h3 className="text-3xl md:text-4xl font-bold text-slate-900 tracking-tight group-hover:text-slate-900 transition-colors">
{title}
</h3>
<p className="text-xl text-slate-500 font-serif italic leading-tight line-clamp-2">
<p className="text-xl text-slate-500 font-serif italic leading-snug line-clamp-2">
{description}
</p>
<div className="pt-4 flex items-center gap-4 text-slate-900 font-bold text-sm group/link">
<div className="pt-4 flex items-center gap-4 text-slate-900 font-bold text-xs uppercase tracking-widest group/link">
Lesen
<div className="w-8 h-px bg-slate-900 group-hover:w-12 transition-all"></div>
<div className="w-10 h-px bg-slate-200 group-hover:bg-slate-400 group-hover:w-16 transition-all duration-500"></div>
</div>
</article>
</Link>