MangaDex: layout is pushed to the far right in certain conditions while reading

For support with specific websites

Moderator: trava90

Forum rules
Please always mention the name/domain of the website in question in your topic title.
Please one website per topic thread (to help keep things organized). While behavior on different sites might at first glance seem similar, they are not necessarily caused by the same.

Please try to include any relevant output from the Toolkit Error Console or the Developer Tools Web Console using the following procedure:
  1. Clear any current output
  2. Navigate or refresh the page in question
  3. Copy and paste Errors or seemingly relevant Warnings into a single [ code ] block.
vannilla
Moon Magic practitioner
Moon Magic practitioner
Posts: 2183
Joined: 2018-05-05, 13:29

MangaDex: layout is pushed to the far right in certain conditions while reading

Unread post by vannilla » 2023-06-05, 14:05

When reading something on MangaDex (mangadex.org), if the comic has too many pages and the "progress bar" is set to "lightbar", the layout is pushed to the right by the progress bar itself.
If there are too many pages, the entire right-side menu is effectively unavailable unless the page is scrolled horizontally. This also slightly affect readability as pages are declared to be centered in their container and are thus pushed to the right too.

This does not happen if the progress bar is configured to use a different appearance or to be hidden at all. I briefly tested it on Firefox and somehow the progress bar is "squished" as to not break layout.

Unfortunately there is nothing in the console except custom MangaDex messages, which don't really provide anything useful. I tried activating CSS reporting, but I got nothing; not sure if I missed something.

I don't know if I can link examples given the subject, so I will attach two images with the comics themselves hidden, to show both the breakage and proper layout as it happens on a comic with "not enough" pages. The broken chapter has 74 pages while the working one has 25 pages.
Attachments
Broken layout
Broken layout
Working layout
Working layout

User avatar
Kris_88
Keeps coming back
Keeps coming back
Posts: 933
Joined: 2021-01-26, 11:18

Re: MangaDex: layout is pushed to the far right in certain conditions while reading

Unread post by Kris_88 » 2023-06-05, 15:28

Probably something related to CSS calc().

User avatar
therube
Board Warrior
Board Warrior
Posts: 1650
Joined: 2018-06-08, 17:02

Re: MangaDex: layout is pushed to the far right in certain conditions while reading

Unread post by therube » 2023-06-05, 15:30

Assuming I'm doing it correctly, this 45 looks OK, https://mangadex.org/chapter/23b37377-2 ... 975c683/43

Link to your 74?


PS: You really should tell how to set "lightbar". I did it, but forgot?

User avatar
Kris_88
Keeps coming back
Keeps coming back
Posts: 933
Joined: 2021-01-26, 11:18

Re: MangaDex: layout is pushed to the far right in certain conditions while reading

Unread post by Kris_88 » 2023-06-05, 15:41

"Fit Width"/"Fit Height"/"Fit Both"/"No Limit" setting does not work properly in PM.
The required image size is calculated incorrectly.


It looks like the problem is really related to the width of the progress bar.
Last edited by Kris_88 on 2023-06-05, 16:39, edited 1 time in total.

vannilla
Moon Magic practitioner
Moon Magic practitioner
Posts: 2183
Joined: 2018-05-05, 13:29

Re: MangaDex: layout is pushed to the far right in certain conditions while reading

Unread post by vannilla » 2023-06-05, 15:43

therube wrote:
2023-06-05, 15:30
Assuming I'm doing it correctly, this 45 looks OK
I think the threshold is around 50, but I don't know many 40+ chapters to test.
therube wrote:
2023-06-05, 15:30
PS: You really should tell how to set "lightbar". I did it, but forgot?
Right, I forgot.
Open a chapter, open the right-side menu (click on the "< menu" button) and scroll the menu until you see a button labeled "progress bar".
Click on it until it becomes the lightbar.

Locked