From 20b7de2310bfea6f03e5cff0accb19d32e1b40c9 Mon Sep 17 00:00:00 2001 From: mihretue Date: Tue, 18 Aug 2026 12:12:00 +0000 Subject: [PATCH] fix(exam): pin print footer to the bottom of every page Footer was just the last thing in document flow, so on a short paper it landed mid-page instead of at the bottom. position:fixed in @media print (the standard trick for a repeating page footer) plus a matching @page bottom margin so it never overlaps the last question's text. Co-Authored-By: Claude Sonnet 5 --- .../src/app/features/exam/pages/ExamDetailPage.tsx | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) diff --git a/apps/backoffice/src/app/features/exam/pages/ExamDetailPage.tsx b/apps/backoffice/src/app/features/exam/pages/ExamDetailPage.tsx index 0bbb98aa8..454238995 100644 --- a/apps/backoffice/src/app/features/exam/pages/ExamDetailPage.tsx +++ b/apps/backoffice/src/app/features/exam/pages/ExamDetailPage.tsx @@ -288,7 +288,15 @@ export function ExamDetailPage() { .header p { margin: 2px 0; font-size: 13px; color: #555; } .directions { background: #f5f5f5; padding: 12px 16px; border-radius: 4px; margin-bottom: 24px; font-size: 13px; } .directions strong { display: block; margin-bottom: 4px; } - @media print { @page { margin: 20mm; } body { -webkit-print-color-adjust: exact; } } + .footer { margin-top: 40px; border-top: 1px solid #ccc; padding-top: 12px; font-size: 12px; color: #888; text-align: center; } + /* Pinned to the bottom of every printed page (not just after the + last question) — @page's bottom margin leaves room for it so it + never overlaps question text on the last page. */ + @media print { + @page { margin: 20mm 20mm 28mm 20mm; } + body { -webkit-print-color-adjust: exact; padding-bottom: 0; } + .footer { position: fixed; bottom: 0; left: 0; right: 0; margin-top: 0; } + }
${logoBase64 ? `` : ""} @@ -299,7 +307,7 @@ export function ExamDetailPage() {
${exam.direction?.[locale] ? `
Directions: ${exam.direction[locale]}
` : ""} ${qHtml} -
+
Generated by EMA — Ethiopian Maritime Authority