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

feat: ultra-aggressive mobile spacing refinement & native fidelity navigation redesign

Browse Source
This commit is contained in:
Marc Mintel
2026-02-15 20:15:04 +01:00
parent 6244425551
commit cb32b9d62f
19 changed files with 722 additions and 376 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
apps/web/src/components/MediumCard.tsx
View File

@@ -29,18 +29,18 @@ export const MediumCard: React.FC<MediumCardProps> = ({ post }) => {
variant="glass"
padding="normal"
techBorder={false}
className="relative overflow-hidden transition-all duration-300 border-slate-100 hover:border-slate-300 bg-white/30 backdrop-blur-sm"
className="relative overflow-hidden transition-all duration-300 border-slate-100 hover:border-slate-300 bg-white/30 backdrop-blur-sm p-5 md:p-6"
>
<div className="space-y-4">
<div className="space-y-3 md:space-y-4">
<div className="flex items-center justify-between">
<time className="text-[10px] font-bold uppercase tracking-[0.2em] text-slate-400">
<time className="text-[9px] md:text-[10px] font-bold uppercase tracking-[0.2em] text-slate-400">
{formattedDate}
</time>
<div className="flex gap-2">
<div className="flex gap-1.5 md:gap-2">
{tags?.slice(0, 2).map((tag) => (
<span
key={tag}
className="text-[9px] font-mono text-slate-300 uppercase"
className="text-[8px] md:text-[9px] font-mono text-slate-300 uppercase"
>
#{tag}
</span>
@@ -48,16 +48,16 @@ export const MediumCard: React.FC<MediumCardProps> = ({ post }) => {
</div>
</div>
<div className="space-y-2">
<h3 className="text-2xl font-bold text-slate-900 tracking-tight leading-tight group-hover:text-black transition-colors">
<div className="space-y-1.5 md:space-y-2">
<h3 className="text-xl md:text-2xl font-bold text-slate-900 tracking-tight leading-tight group-hover:text-black transition-colors">
{title}
</h3>
<p className="text-base text-slate-500 font-serif italic leading-relaxed line-clamp-2">
<p className="text-sm md:text-base text-slate-500 font-serif italic leading-relaxed line-clamp-2">
{description}
</p>
</div>
<div className="pt-2 flex items-center gap-2 text-[10px] font-bold uppercase tracking-widest text-slate-400 group-hover:text-slate-900 transition-all">
<div className="pt-1 md:pt-2 flex items-center gap-2 text-[9px] md:text-[10px] font-bold uppercase tracking-widest text-slate-400 group-hover:text-slate-900 transition-all">
<span>Beitrag öffnen</span>
<ArrowRight className="w-3 h-3 translate-x-0 group-hover:translate-x-1 transition-transform" />
</div>