search

n-d-r-d-g / devcon-scheduler

Save sessions you're interested in attending at the MSCC Developers Conference.
https://devconmu.netlify.app
MIT License
1 stars 1 forks source link

Content cut off in PDF #10

Closed n-d-r-d-g closed 3 months ago

n-d-r-d-g commented 3 months ago

Currently

On some mobile devices, when exporting a PDF via the Save button, the content gets cut off if it reaches the end of the page and there is not enough space to fit the whole session card on the current page.

Expected

You can use the following in globals to fix this:

.a4-page {
  @apply bg-white;

  min-inline-size: 210mm;
  inline-size: 210mm;
  max-inline-size: 100%;
  min-block-size: 297mm;
  padding: 25.4mm;

  @media print {
    padding: 0;
  }
}

You will need to add the a4-page class to the root element in the PDFPreview component for it to work.

P-Appadoo commented 3 months ago

The above provided fix did not work. Instead, i used page-break-inside.

n-d-r-d-g commented 3 months ago

My bad! The code I provided was for a preview, i.e. if you want to preview the page inside the document, without needing the print dialog.