[Bug] No dark overlay on tablet when opening sidebar

[tabacitu]

When opening the sidebar on mobile, the main content is covered by a semi-transparent dark overlay:

Which makes the menu easy pop out, easy to read, and easy to distinguish from the content if the sidebar is the same color as the content.

However, when viewing from a tablet, despite the fact that we have the same sidebar (aka drawer) functionality, there is no dark overlay:

This makes it confusing to use the sidebar menu on tablet. We should use the same dark overlay as on mobile.

[vonsogt]

And this is should be a bug or we should make the header fixed? or that's okay for the empty header?

[tabacitu]

Hmm... indeed that doesn't look well at all. That happens when if you scroll after opening the sidebar - right? Otherwise it should just look like this, which I think is fine:

The problem is, if we make the header fixed, that would also fix the header when the sidebar is NOT open. It's a different behaviour for the header, which I don't agree with. You don't need the navbar most of the time, so showing it at the top all the time would just restrict the viewport. There's more important stuff to use that screen real estate than a navbar you rarely use. Like content. Content is king!

Leaving aside my rant about the uselessness of sticky headers, possible solutions to this:

• (A) make the header sticky only when the sidebar is open, with JS (not sure it'll be easy without overwriting a bunch of CoreUI files)
• (B) disabling the scroll on the page, when the sidebar is open on mobile and/or tablet; if the user wants to scroll they, they probably want to scroll the sidebar, not the content;