mmintel/mintel.me
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 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

54
apps/web/src/components/Typography.tsx
View File

@@ -1,4 +1,4 @@
import * as React from 'react';
import * as React from "react";
interface TypographyProps {
children: React.ReactNode;
@@ -6,49 +6,77 @@ interface TypographyProps {
}
export const H1: React.FC<TypographyProps> = ({ children, className = "" }) => (
<h1 className={`text-5xl md:text-7xl font-bold text-slate-900 tracking-tighter leading-[1.1] ${className}`}>
<h1
className={`text-4xl md:text-7xl font-bold text-slate-900 tracking-tighter leading-[1.1] ${className}`}
>
{children}
</h1>
);
export const H2: React.FC<TypographyProps> = ({ children, className = "" }) => (
<h2 className={`text-3xl md:text-5xl font-bold text-slate-900 tracking-tighter leading-tight ${className}`}>
<h2
className={`text-xl md:text-5xl font-bold text-slate-900 tracking-tighter leading-tight ${className}`}
>
{children}
</h2>
);
export const H3: React.FC<TypographyProps> = ({ children, className = "" }) => (
<h3 className={`text-2xl md:text-4xl font-bold text-slate-900 tracking-tight leading-tight ${className}`}>
<h3
className={`text-lg md:text-4xl font-bold text-slate-900 tracking-tight leading-tight ${className}`}
>
{children}
</h3>
);
export const H4: React.FC<TypographyProps> = ({ children, className = "" }) => (
<h4 className={`text-xl md:text-2xl font-bold text-slate-900 tracking-tight ${className}`}>
<h4
className={`text-base md:text-2xl font-bold text-slate-900 tracking-tight ${className}`}
>
{children}
</h4>
);
export const LeadText: React.FC<TypographyProps> = ({ children, className = "" }) => (
<p className={`text-lg md:text-xl font-serif italic text-slate-500 leading-relaxed ${className}`}>
export const LeadText: React.FC<TypographyProps> = ({
children,
className = "",
}) => (
<p
className={`text-sm md:text-xl font-serif italic text-slate-500 leading-relaxed ${className}`}
>
{children}
</p>
);
export const BodyText: React.FC<TypographyProps> = ({ children, className = "" }) => (
<p className={`text-base text-slate-500 leading-relaxed ${className}`}>
export const BodyText: React.FC<TypographyProps> = ({
children,
className = "",
}) => (
<p
className={`text-sm md:text-base text-slate-500 leading-relaxed ${className}`}
>
{children}
</p>
);
export const Label: React.FC<TypographyProps> = ({ children, className = "" }) => (
<span className={`text-[10px] font-bold uppercase tracking-[0.3em] text-slate-400 block ${className}`}>
export const Label: React.FC<TypographyProps> = ({
children,
className = "",
}) => (
<span
className={`text-[10px] font-bold uppercase tracking-[0.3em] text-slate-400 block ${className}`}
>
{children}
</span>
);
export const MonoLabel: React.FC<TypographyProps> = ({ children, className = "" }) => (
<span className={`text-[10px] font-mono uppercase tracking-[0.2em] text-slate-400 block ${className}`}>
export const MonoLabel: React.FC<TypographyProps> = ({
children,
className = "",
}) => (
<span
className={`text-[10px] font-mono uppercase tracking-[0.2em] text-slate-400 block ${className}`}
>
{children}
</span>
);