No Indent Class not shared to PDFs when paragraph is inside a shaded textbox

[beckej13820]

Prerequisites

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

Description

I'm having trouble getting indent and no-indent classes to apply if the paragraphs are inside a textbox. When I apply a class of no-indent, it works correctly inside the webbook, but the Prince PDF export doesn't get styled accordingly

Steps to Reproduce

1. Create a book with a shared textbox. Put some elements in the shared textbox such as a heading and two paragraphs.
2. Do an export to check default behavior.
3. Now apply no-indent to the paragraphs. Many style guides use no indent for the first paragraph in a textbox or after a heading, and then indentation on all subsequent paragraphs.

Expected behavior:

I expect to be able to fine tune indentation by using the Pressbooks no-indent and indent classes.

Actual behavior:

This screenshots shows a webbook using McLuhan. I have the side panel open to show that the paragraphs have the no-indent class.

The next screenshot shows the same section of the book in the PDF export. Notice that the paragraph is indented.

System Information

Root Blog Info

Root Blog ID: 1
Root Blog URL: https://pressbooks.sunycreate.cloud/

Browser

Platform: OS X
Browser Name: Chrome
Browser Version: 119.0.0.0
User Agent String: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/119.0.0.0 Safari/537.36

WordPress Configuration

Network URL: https://pressbooks.sunycreate.cloud/
Network Type: Subdomain
Version: 6.3.2
Language: en_US
WP_ENV: Not set
WP_DEBUG: Enabled
Memory Limit: 64M

Pressbooks Configuration

Version: 6.15.1
Root Theme: Aldine
Root Theme Version: 1.19.1

Pressbooks Dependencies

Epubcheck: Installed
xmllint: Installed
PrinceXML: Installed
Saxon-HE: Installed

Must-Use Plugins

hm-autoloader.php: n/a

Network Active Plugins

Editoria11y Accessibility Checker: 1.0.12
Git Updater: 12.3.1
Koko Analytics: 1.3.3
Limit Login Attempts Reloaded: 2.25.26
Multisite Plugin Manager: 3.1.6
Pressbooks: 6.15.1
Pressbooks Network Catalog: 1.3.3
Pressbooks Stats: 1.9.0
Unconfirmed: 1.3.6
User Switching: 1.7.0

Root Blog Active Plugins

Editoria11y Accessibility Checker: 1.0.12
Git Updater: 12.3.1
H5P: 1.15.6
Koko Analytics: 1.3.3
Limit Login Attempts Reloaded: 2.25.26
Multisite Plugin Manager: 3.1.6
Pressbooks: 6.15.1
Pressbooks Network Catalog: 1.3.3
Pressbooks Stats: 1.9.0
Unconfirmed: 1.3.6
User Switching: 1.7.0

Inactive Plugins

Candela Citation: 0.2.4
Excalibur: 0.7.0
Hypothesis: 0.6.0
Parsedown Party: 1.2.1
Pressbooks Shortcode Handler: 0.1
Pressbooks Shortcode Handler: 1.0.1
TablePress: 2.2
WordPress Importer: 0.8.1
WP QuickLaTeX: 3.8.6

Server Configuration

PHP Version: 8.1.18
MySQL Version: 5.7.30
Webserver Info: Apache

PHP Configuration

Memory Limit: 256M
Upload Max Size: 150M
Post Max Size: 150M
Upload Max Filesize: 150M
Time Limit: 60
Max Input Vars: 5000
URL-aware fopen: On (1)
Display Errors: N/A

PHP Extensions

OPcache: Disabled
XDebug: Disabled
cURL: Supported
cURL Version: 7.86.0
imagick: Installed
xsl: Installed

[beckej13820]

When I inspect the XHTML output from the diagnostics area, this is what I see when I inspect:

[SteelWagstaff]

@beckej13820 this looks like a case of CSS selection priority and specificity. See https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity for some of the gnarly specificity details.

It looks like the print CSS has two rules that both apply to this paragraph -- one of them is the simple class selector (.no-indent) (it has a weight of 0-1-0) and the other is a class selector with an element .textbox p (which has a weight of 0-1-1). Because the latter is more specific, it takes precedence and is applied. You could probably fix this by adding a custom CSS rule to your PDF export that targeted the .no-indent class and was MORE specific than the .textbox p rule. Something like .textbox p.no-indent { text-indent: 0;} would do the trick, for example.