Fix fragment scroll margin

[cpoile]

Summary

• The scroll margin was not being set properly in our global css

Ticket Link

• none, this was bugging me

[github-actions]

Newest code from mattermost has been published to preview environment for Git SHA 26422a6

[cwarnermm]

While the scroll issue is indeed fixed (thanks, @cpoile!), the right-hand page-level navigation pane isn't accurate:

I've historically believed the scroll and nav issue as one and the same root cause (Furo bug). Fixing the scroll issue alone makes the nav issue much more obvious, and I'd argue that it's more egregious than the scroll issue.

Note: fixing via Furo rather than forking Furo is preferred due to the long-term maintenance complexity a fork would introduce.

[cwarnermm]

See comments

[github-actions]

Newest code from mattermost has been published to preview environment for Git SHA 498811a

[cpoile]

I've historically believed the scroll and nav issue as one and the same root cause (Furo bug).

Thanks @cwarnermm. But the problem is in our css, not the theme. The problem is that the rules around positioning of the headers and notification bars are in a few different files, and are using absolute positioning, and that means our header is not a single block that the theme understands as our header. So its calculations are off.

We have a couple options:

1. play around with the magic numbers I introduced and you'll get a number where the the TOC calculations almost work nicely, but it won't be perfect.
2. fix the root cause of the issue: fix our docs pages so that we have a single "header" block, and then the theme's fragment navigation and TOC highliighting will automatically work.

@lieut-data I can finish 2 up, since I spent a few hours on it already, but I'm way past a "quick fix". It's not a great use of time, but we need to fix this. But ideally we would have the team do the fix, because they should own this and make it work properly. But they're overloaded.

[cwarnermm]

@cpoile - I really appreciate having your expertise available for this gnarly issue that's plagued us since we introduced Furo. Any additional assistance you can offer towards as close a resolution as possible would be AMAZING and so very welcome!!

I've always assumed it was the theme and not something we were doing. Happy to be incorrect about that and able to control this outcome (with help!)

[github-actions]

Newest code from mattermost has been published to preview environment for Git SHA b873914

[cpoile]

Ok, here's the changes I have so far. There's some big issues with this code -- we're using scss, but not really, because I think the original developer (Alan Lew?) was compiling it locally, but didn't include the compilation step in CI or in scripts (maybe they were using VS Code or something). Anyway, it means any changes since have been trying to keep the sass and css in sync manually.

Next steps:

1. @cwarnermm could you take a look now and see if I've broken anything? I had to refactor the notification banner code and the mobile vs. desktop styling. It's better now, but probably not perfect.
2. Ideally we should either get rid of the sass completely and just work with css, or add a sass compilation step to CI so that the sass is the single source of truth
3. Someone needs to go through and do a thorough refactoring. The layout and logic of everything needs to be cleaned up. Right now we're piling magic numbers on top of magic numbers and hacks on hacks, and that's why we're seeing conflicts with the sphinx theme.

Hope that helps. Sorry to leave it still in a messy state, but I think its at least a bit cleaner than before.

cc @lieut-data

[github-actions]

Newest code from mattermost has been published to preview environment for Git SHA 6bb3c29