validatedpatterns / docs

Validated Patterns documentation
https://validatedpatterns.io/
Apache License 2.0
9 stars 54 forks source link

A "fixed" Table of contents `aside` wastes space #334

Open adelton opened 11 months ago

adelton commented 11 months ago

The pattern pages like https://validatedpatterns.io/patterns/industrial-edge/ seem to contain

<aside class="pf-c-jump-links pf-m-vertical sticky pf-m-expandable pf-m-non-expandable-on-2xl" aria-label="Table of contents"> ...

on the right which is empty and wastes space.

Screenshot_2023-10-30_13-09-01

Moreover, when one tries to increase the size of the text with Ctrl-+, that white space grows and wastes even more space.

Screenshot_2023-10-30_13-09-22

It should be turned to float or removed completely.

adelton commented 11 months ago

Note to self -- the following Violentmonkey script workarounds the problem:

// ==UserScript==
// @name        Workaround https://github.com/validatedpatterns/docs/issues/334
// @namespace   adelton
// @match       https://validatedpatterns.io/patterns/*
// @grant       none
// @version     1.0

// ==/UserScript==

var TOC = document.getElementById('TableOfContents');
if (TOC) {
  TOC.parentNode.style.display = 'none';
}
mbaldessari commented 10 months ago

@abhatt-rh can you take a look at this?

abhatt-rh commented 10 months ago

@abhatt-rh can you take a look at this?

Thank you @mbaldessari, but I think @danmacpherson would be the best to consult on the PatternFly front so assigning this one to him.

danmacpherson commented 10 months ago

Hi @adelton

So that column should not be empty and should have table of contents for the page. For example:

image

I might need some help to replicate this issue so I can work out the right way to fix it. Can you let me know the following:

adelton commented 10 months ago
danmacpherson commented 10 months ago

Thanks, @adelton. The good news is I'm running the exact same configuration you are, so it might be easier to isolate the issue.

I have a feeling the page zoom is affecting the TOC column, so I might need to correct this. Just to confirm, do you usually have the pages in Firefox zoomed in? If you click View > Zoom > Actual Size or Zoom Out, does the menu reappear?

adelton commented 10 months ago

Yes, after zooming out to a point when the text is so small I cannot really read it, the menu appears. Screenshot_2023-11-13_17-04-21

danmacpherson commented 10 months ago

Excellent! Seems like we've got the root cause. I'll try and implement a fix to make that right column respect the zoom.