pressbooks / pressbooks-book

McLuhan is the default book theme for Pressbooks.
https://pressbooks.org
GNU General Public License v3.0
20 stars 16 forks source link

Nav-Reading text overlaps with main body text at specific screen widths #264

Closed SteelWagstaff closed 6 years ago

SteelWagstaff commented 6 years ago

Prerequisites

Description

The CSS rules that cause the nav-reading navigation menu to switch from living in the right/left margin of the main body to a fixed position at the bottom of the page appear to be triggered at a breakpoint that is too narrow. The result is that when the book uses webbook width: 'wide' setting the nav-reading text [i.e. Previous (Back Matter)] can overlap the main body text. It appears that this problem occurs primarily between screen widths of 1330px and 1490px. Unfortunately, this range includes the default max-width of many users' laptops. My suspicion is that the css was optimized for the text Next (Chapter), but Previous (Front Matter) has several more characters and this causes overlap issues when the previous/next buttons point to front/back matter

See two examples here: screen shot 2018-09-06 at 10 07 09 am screen shot 2018-09-06 at 10 06 45 am

Steps to Reproduce

  1. Create a book with front matter, chapters, and back matter
  2. Set the webbook width setting to 'wide'
  3. Resize the browser to just over 1330px (when the nav-reading menu jumps from being at the page footer to the page's left-right margins
  4. Frown.

System Information

Book Info

Book ID: 100 Book URL: https://wisc.pb.unizin.org/statsprimer/ Book Privacy: Public

Browser

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

WordPress Configuration

Network URL: http://wisc.pb.unizin.org/ Network Type: Subdirectory Version: 4.9.7 Language: en_US WP_ENV: production WP_DEBUG: Disabled Memory Limit: 64M

Pressbooks Configuration

Version: 5.4.5 Book Theme: Jacobs Book Theme Version: 1.1.1 Root Theme: Aldine Root Theme Version: 1.4.1

Pressbooks Dependencies

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

Must-Use Plugins

Bedrock Autoloader: 1.0.0 hm-autoloader.php: n/a network-storage.php: n/a TablePress Quick LaTeX Functionality Plugin: 0.1.1 telemetry.php: n/a Unizin Allow Custom Post Types: 1.0 Unizin Allow Plugins: 1.0.0 Unizin Allow Upload Extensions: 1.0.0 Unizin Mail From: 1.0.0 UW-Madison Kaltura Enable oEmbed: 1.0

Network Active Plugins

CM Tooltip Glossary: 3.6.4 H5P: 1.10.3 H5P xAPI: 0.1.7 Hypothesis: 0.5.0 iframe: 4.3 LTI: 0.1 Pressbooks: 5.4.5 Pressbooks BISAC: 2.0.0 Pressbooks Cover Generator: 2.4.0 Pressbooks Stats: 1.4.1 Pressbooks Whitelabel: 1.2.0 Redis Object Cache: 1.3.8 Regenerate Thumbnails: 3.0.2 TablePress: 1.9 TablePress Extension: DataTables Buttons: 1.1 Thin CC Exporter: 0.1.1 User Activation Keys: 4.6 Wisc Content Auth LTI: 0.2.7 Wisc H5P LTI Outcomes: 0.2.6 WP QuickLaTeX: 3.8.4

Book Active Plugins

Inactive Plugins

Akismet Anti-Spam: 3.3.4

Server Configuration

PHP Version: 7.1.17-1+ubuntu16.04.1+deb.sury.org+1 MySQL Version: 5.6.10 Webserver Info: nginx/1.13.12

PHP Configuration

Safe Mode: Disabled Memory Limit: 256M Upload Max Size: 50M Post Max Size: 50M Upload Max Filesize: 50M Time Limit: 300 Max Input Vars: 1000 URL-aware fopen: On (1) Display Errors: N/A

PHP Extensions

OPcache: Zend XDebug: Disabled cURL: Supported cURL Version: 7.47.0 imagick: Not Installed xsl: Installed

greatislander commented 6 years ago

Fixed in https://github.com/pressbooks/pressbooks-book/pull/256.