diff --git a/src/features/reports/components/category-report-export.tsx b/src/features/reports/components/category-report-export.tsx index 6990c00..c0b6fff 100644 --- a/src/features/reports/components/category-report-export.tsx +++ b/src/features/reports/components/category-report-export.tsx @@ -224,8 +224,8 @@ export function CategoryReportExport({ const doc = new jsPDF({ orientation: "landscape" }); const primaryColor = getPrimaryPdfColor(); const [smallLogoDataUrl, textLogoDataUrl] = await Promise.all([ - loadExportLogoDataUrl("/images/logo_small.png"), - loadExportLogoDataUrl("/images/logo_text.png"), + loadExportLogoDataUrl("/images/logo_small.svg"), + loadExportLogoDataUrl("/images/logo_text.svg"), ]); let brandingEndX = 14; diff --git a/src/features/transactions/components/transactions-export.tsx b/src/features/transactions/components/transactions-export.tsx index deede3c..f0adf69 100644 --- a/src/features/transactions/components/transactions-export.tsx +++ b/src/features/transactions/components/transactions-export.tsx @@ -229,8 +229,8 @@ export function TransactionsExport({ const doc = new jsPDF({ orientation: "landscape" }); const primaryColor = getPrimaryPdfColor(); const [smallLogoDataUrl, textLogoDataUrl] = await Promise.all([ - loadExportLogoDataUrl("/images/logo_small.png"), - loadExportLogoDataUrl("/images/logo_text.png"), + loadExportLogoDataUrl("/images/logo_small.svg"), + loadExportLogoDataUrl("/images/logo_text.svg"), ]); let brandingEndX = 14; diff --git a/src/shared/utils/export-branding.ts b/src/shared/utils/export-branding.ts index df2938c..8d32fc7 100644 --- a/src/shared/utils/export-branding.ts +++ b/src/shared/utils/export-branding.ts @@ -65,8 +65,10 @@ export function getPrimaryPdfColor(): [number, number, number] { return FALLBACK_PRIMARY_COLOR; } +const EXPORT_LOGO_RENDER_SCALE = 4; + export async function loadExportLogoDataUrl( - logoPath = "/images/logo_text.png", + logoPath = "/images/logo_text.svg", ): Promise { if (typeof window === "undefined" || typeof document === "undefined") { return null; @@ -77,13 +79,16 @@ export async function loadExportLogoDataUrl( image.crossOrigin = "anonymous"; image.onload = () => { - const width = image.naturalWidth || image.width; - const height = image.naturalHeight || image.height; - if (!width || !height) { + const naturalWidth = image.naturalWidth || image.width; + const naturalHeight = image.naturalHeight || image.height; + if (!naturalWidth || !naturalHeight) { resolve(null); return; } + const width = Math.round(naturalWidth * EXPORT_LOGO_RENDER_SCALE); + const height = Math.round(naturalHeight * EXPORT_LOGO_RENDER_SCALE); + const canvas = document.createElement("canvas"); canvas.width = width; canvas.height = height;