metagame-wiki icon indicating copy to clipboard operation
metagame-wiki copied to clipboard

Published 20 hours ago • verified publisher icon MetaFam

ToC hovers on top of Sidebar

Open pvblick-vniversal-friend opened this issue 3 years ago • 5 comments

What happened?

Table of Contents overlaps with the drop down menu on the right:

MetaWiki_UI_Issue

Where and when:

Spotted on a laptop before entering the server in the player path. This means that various other people will have encountered the problem before entering the MetaGame Discord.

Imporant: This might throw some people off from joining, especially UX/UI Designers.

How can we reproduce the problem?

  • Reducing the width beyond a certain threshold makes the ToC go to the bottom left-hand corner.

  • @Pronoia42 has encountered a similar issue while opening the inspection tool. Here's their post on a similar issue https://github.com/MetaFam/metagame-wiki/issues/365

  • Note: This behavior doesn't happen in default docusaurus and is caused by some of our customization.

Possible cause and proposed solution.

  • Reduced screen width + non-pinned div for ToC -> ToC moves to occupy space on the left.

Problematic element: {div class="tableOfContents_35-E thin-scrollbar theme-doc-toc-desktop"}

Troubleshooting:

  • Inspecting shows that ToC is under element {div class="col col--3"} which is the the sidebar.
  • Issue occurs specifically at widths between 1003-1258px.
  • @polimyl found out that reducing height pushes the ToC up while the sidebar stays locked.
  • At width below 975px the sidebar collapses in drop-down menu on top left corner.
  • Important: Between width 975-1003px, sidebar is fixed on the left side with a scroll-bar. Below 975 it isn't fixed and the issue occurs. The problem is caused by the navbar/sidebar.

Possible solution: Fix sidebar in place on on left side below width of 975px.

Spex (when encountered): Browser: Brave OS: Windows 10 Screen res: 1366x768 Text size: 110%

pvblick-vniversal-friend avatar Nov 15 '21 23:11 pvblick-vniversal-friend

Looking at this now.

luxumbra avatar Nov 16 '21 11:11 luxumbra

@luxumbra any progress?

pvblick-vniversal-friend avatar Nov 16 '21 17:11 pvblick-vniversal-friend

@luxumbra any progress?

I started looking this morning and will do more over the next couple of days but today I was distracted by trying to get another bits of work done on the other repo and helping to push this months SEED mint.

luxumbra avatar Nov 17 '21 00:11 luxumbra

Sorry I think I made this as an additional new issue

https://github.com/MetaFam/metagame-wiki/issues/334

tommycomma avatar Jan 27 '22 05:01 tommycomma

I have picked this up again today. Apologies for the delay!! @pvblick-vniversal-friend @tommycomma

luxumbra avatar Jan 27 '22 17:01 luxumbra