Prevent "Back to Top" button from being cropped on firefox/android

[Yann-P]

Fixes #2411

Cropping fixed by using a bottom anchor instead of top

[Yann-P]

This fixes the button being cropped

But the flicker is still happening on firefox/android. Not happening in chrome/android or safari/ios

I assume there is something funny about the scroll event listener in firefox/android

[Yann-P]

Flickering is a firefox bug when the address bar changes sides. I don't think we should add complexity in the code for this, so narrowing down the fix to only the cropping problem.

[sanmaxdev]

Built the theme locally to confirm the SCSS compiles and the back-to-top rule now emits bottom: 2dvh in the compiled CSS. stylelint and prettier are clean on the changed file. dvh is already used in _sidebar-toggle.scss, so this is consistent with the rest of the codebase.

One heads-up: the PR body says Fixes #2411, which auto-closes the issue on merge. The issue covers both the cropping and the flicker, and the flicker on Firefox/Android is intentionally left out of this PR. Consider switching to Refs #2411 (or splitting the issue) so the flicker stays tracked instead of getting auto-closed as resolved.

[Yann-P]

Built the theme locally to confirm the SCSS compiles and the back-to-top rule now emits bottom: 2dvh in the compiled CSS. stylelint and prettier are clean on the changed file. dvh is already used in _sidebar-toggle.scss, so this is consistent with the rest of the codebase.

One heads-up: the PR body says Fixes #2411, which auto-closes the issue on merge. The issue covers both the cropping and the flicker, and the flicker on Firefox/Android is intentionally left out of this PR. Consider switching to Refs #2411 (or splitting the issue) so the flicker stays tracked instead of getting auto-closed as resolved.

I edited the issue to remove the part about flickering