I'm trying to create a 200~ page PDF that includes indexes, im using pdfUtils to merge the index template and look up page numbers. It seems like if there is too much data or it takes a long time the styles specified are not respected? If I cut my data down I get the correct font size. I have wait for network idle specified on the Main and Indexes templates. I tried creating a sample to show my problem but I dont think the playground allows the longer running samples?
The font is pulled in from a handlebars component named Styles:
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href={{{style.fontUrl}}} rel="stylesheet">
<style>
{{asset "../Stylesheets/base.css"}}
{{asset "../Stylesheets/legendpage.css"}}
html, body {
font-size: {{style.fontSize}};
font-family: {{{style.fontFamily}}} !important;
line-height: {{style.lineHeight}} !important;
}
...
The Main template:
<!DOCTYPE html>
<html lang="en">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>{{pdfTitle}}</title>
{{component "./Styles"}}
</head>
<body>
...
{{childTemplate (htmlTemplate "./Indexes")}}
...
Here is something of an index template:
{{component "./Styles"}}
...
<section>
...
<h3>{{header}}</h3>
<ul>
{{#each entries}}
<li>
<span>{{label}}</span>
{{#each pageRef}}
<span>{{pageNumber}}</span>
{{/each}}
</li>
{{/each}}
</ul>
</section>
{{/each}}
Wrong font size on page numbers:
profile:
If I run my very small sample dataset It appears to render the font sizes fine: