Aligned images render smaller in PDF exports

pb-amy commented 3 years ago

Prerequisites

[x] Can you reproduce the behavior you wish to address with all other plugins deactivated?
[x] Are you running the latest version of Pressbooks and the latest version of WordPress?
[x] Are you experiencing this issue with one of our built-in root or book themes?
[x] Did you perform a cursory search to see if your bug or enhancement is already listed?

Description

This issue was initially reported by two of our clients: University of Iowa and University of Southern Queensland

When images are given an alignment (left, right or center), large images render very small in PDFs. A demonstration is provided in this screenrecording: https://drive.google.com/file/d/1JK-6JKMzKQIYxccNqnhCpfoP9rT72Tpn/view.

This is very easy to tell on this particular example because the size selected was 'large'. By comparison, when the image size selected is 'small' or 'medium', it is harder to tell because the image is not made smaller as compared to the size selected, but seems to only affect 'large' and 'original' size images.

Webbook format is unaffected: https://university.pressbooks.pub/august2021/chapter/chapter-1/

Steps to Reproduce

Import an image, and insert as "large" into a chapter.
Set an alignment for center, left or right.
Export as a PDF

Expected behavior: Image sizes should remain consistent as seen in the Preview

Actual behavior: Image sizes are reduced for large images in PDFs

System Information

SteelWagstaff commented 3 years ago

This is by design: https://github.com/pressbooks/pressbooks-book/blob/f1dd3397b11178f7adcd2b83a278185de389c08c/packages/buckram/assets/styles/components/media/_images.scss#L38-L41. We could remove this rule for center aligned images, however. Workaround for now is to remove left/right alignment.

SteelWagstaff commented 3 years ago

Works as expected on integrations. Images which are center aligned or no alignment do not have a special max-width applied in exports. Images which are left or right aligned are set to max-width: 50% in export files.

@pb-amy we should improve our documentation to let users know that right and left aligned images will have max-width applied in export files (by design) and that this can be overridden via custom-css. If you want sample snippet, let me know?

pressbooks / pressbooks-book