117 lines
5.5 KiB
TypeScript
117 lines
5.5 KiB
TypeScript
import Image from 'next/image';
|
|
import Link from 'next/link';
|
|
import type { Metadata } from 'next';
|
|
import appIcon from '@/public/images/ihatepdfs/icon.png';
|
|
import mainWindow from '@/public/images/ihatepdfs/main-window.png';
|
|
|
|
export const metadata: Metadata = {
|
|
title: 'I Hate PDFs',
|
|
description: 'A native macOS PDF reader for highlighting, commenting, reviewing, and saving annotated PDFs locally on your Mac.',
|
|
alternates: {
|
|
canonical: '/ihatepdfs',
|
|
},
|
|
openGraph: {
|
|
title: 'I Hate PDFs',
|
|
description: 'A native macOS PDF reader for highlighting, commenting, reviewing, and saving annotated PDFs locally on your Mac.',
|
|
url: '/ihatepdfs',
|
|
images: [
|
|
{
|
|
url: '/images/ihatepdfs/main-window.png',
|
|
width: 1440,
|
|
height: 1440,
|
|
alt: 'I Hate PDFs macOS app showing a PDF with comments sidebar',
|
|
},
|
|
],
|
|
},
|
|
};
|
|
|
|
const features = [
|
|
'Open local PDF files without uploading them anywhere.',
|
|
'Highlight text, add comments, underline passages, and place free-text notes.',
|
|
'Review annotations in a compact comments sidebar with replies, filters, and search.',
|
|
'Save annotations back into the original PDF or export an annotated copy.',
|
|
'Customize highlight and comment colors from the macOS Settings window.',
|
|
];
|
|
|
|
export default function IHatePDFsPage() {
|
|
return (
|
|
<div className="page-frame py-20 sm:py-24">
|
|
<div className="mx-auto max-w-[72rem] space-y-12">
|
|
<header className="grid gap-8 border-b border-line pb-12 lg:grid-cols-[minmax(0,1fr)_30rem] lg:items-center">
|
|
<div className="space-y-6">
|
|
<div className="flex items-center gap-3">
|
|
<Image
|
|
src={appIcon}
|
|
alt=""
|
|
width={50}
|
|
height={50}
|
|
className="h-12 w-12 rounded-xl border border-line bg-paper-strong"
|
|
priority
|
|
/>
|
|
<p className="eyebrow">macOS PDF reader</p>
|
|
</div>
|
|
|
|
<div className="space-y-4">
|
|
<h1 className="max-w-[37rem] text-balance font-sans text-5xl font-medium leading-[0.96] text-ink sm:text-6xl lg:text-7xl">
|
|
I Hate PDFs
|
|
</h1>
|
|
<p className="max-w-[36rem] text-[1.04rem] leading-8 text-muted sm:text-[1.1rem]">
|
|
A native macOS PDF reader built for local annotation, review, and saving without accounts, tracking, or cloud upload.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="flex flex-wrap gap-x-6 gap-y-3 text-[0.96rem] text-ink">
|
|
<Link href="/ihatepdfs/privacy" className="transition-colors hover:text-accent">
|
|
Privacy policy
|
|
</Link>
|
|
<a href="mailto:mathabbayi@icloud.com" className="transition-colors hover:text-accent">
|
|
Contact
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="relative overflow-hidden rounded-md border border-line bg-paper-strong">
|
|
<Image
|
|
src={mainWindow}
|
|
alt="I Hate PDFs showing a marked-up PDF with the comments sidebar open"
|
|
sizes="(max-width: 1024px) 100vw, 30rem"
|
|
className="h-auto w-full"
|
|
priority
|
|
/>
|
|
</div>
|
|
</header>
|
|
|
|
<section className="grid gap-4 border-b border-line pb-10 lg:grid-cols-[9rem_minmax(0,1fr)]">
|
|
<p className="eyebrow lg:pt-1">Features</p>
|
|
<div className="grid gap-4 sm:grid-cols-2">
|
|
{features.map((feature) => (
|
|
<p
|
|
key={feature}
|
|
className="rounded-md border border-line bg-paper-strong p-4 text-[0.96rem] leading-7 text-muted"
|
|
>
|
|
{feature}
|
|
</p>
|
|
))}
|
|
</div>
|
|
</section>
|
|
|
|
<section className="grid gap-4 lg:grid-cols-[9rem_minmax(0,1fr)]">
|
|
<p className="eyebrow lg:pt-1">Privacy</p>
|
|
<div className="max-w-[42rem] space-y-4 text-[1rem] leading-8 text-muted">
|
|
<p>
|
|
I Hate PDFs keeps opened PDFs on your Mac. The app does not collect analytics, use advertising, create accounts, or send your documents to a server.
|
|
</p>
|
|
<p>
|
|
See the full{' '}
|
|
<Link href="/ihatepdfs/privacy" className="font-medium text-ink underline decoration-line-strong underline-offset-4 transition-colors hover:text-accent hover:decoration-accent">
|
|
privacy policy
|
|
</Link>
|
|
.
|
|
</p>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|