David/WORKFLOW-APP
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: print to PDF button on registration detail view

Browse source
This commit is contained in:
Dave 2026-08-14 19:51:59 +02:00
parent 5cedaf714c
commit c8fcddfbf1
3 changed files with 35 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
app/globals.css
View file

@ -247,3 +247,14 @@ textarea:focus-visible {
@media (min-width: 1128px) {
.section-y { padding-block: var(--section-y-desktop); }
}
/* Print styles — hide nav, footer, back button */
@media print {
nav, footer, .no-print { display: none !important; }
body { background: white !important; color: black !important; }
.bg-surface { background: white !important; border-color: #ccc !important; }
.bg-surface-warm { background: #f9f9f9 !important; }
.container-x { max-width: 100% !important; padding: 0 !important; }
a { color: inherit !important; text-decoration: none !important; }
button { display: none !important; }
}

10
app/registrations/[id]/page.tsx
View file

@ -4,6 +4,7 @@
import { fetchCollection, fetchRecord } from "@/lib/pb";
import type { PBList, PBRecord } from "@/lib/pb";
import PageHeader from "@/components/PageHeader";
import PrintButton from "@/components/PrintButton";
import Link from "next/link";
import { notFound } from "next/navigation";
@ -123,9 +124,12 @@ export default async function RegistrationDetailPage({ params }: { params: { id:
title={reg.reference_name || "Registration"}
subtitle={"Status: " + (status.charAt(0).toUpperCase() + status.slice(1))}
action={
<Link href="/registrations" className="inline-flex items-center px-4 py-2 border border-border rounded-md text-sm font-semibold text-fg hover:bg-surface-warm no-underline transition-colors">
&larr; Back to list
</Link>
<div className="flex items-center gap-3">
<PrintButton />
<Link href="/registrations" className="inline-flex items-center px-4 py-2 border border-border rounded-md text-sm font-semibold text-fg hover:bg-surface-warm no-underline transition-colors">
&larr; Back to list
</Link>
</div>
}
/>

17
components/PrintButton.tsx Normal file
View file

@ -0,0 +1,17 @@
"use client";
export default function PrintButton() {
return (
<button
onClick={() => window.print()}
className="inline-flex items-center gap-2 px-4 py-2 border border-border rounded-md text-sm font-semibold text-fg hover:bg-surface-warm transition-colors"
>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
<polyline points="6 9 6 2 18 2 18 9"></polyline>
<path d="M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2"></path>
<rect x="6" y="14" width="12" height="8"></rect>
</svg>
Print / Save PDF
</button>
);
}