UX: Align bulk select menu toggle relative to main wrapper when possible (PR #9265)

The goal is to align the bulk-select menu toggle relative to the content rather than the viewport as discussed here: https://meta.discourse.org/t/better-bulk-select-wrench-icon-placement/141396

I’m grabbing the padding on the top of #main-outlet so I can set the top value for position:sticky;… this should ensure that if the header height is increased/decreased the button would still align with the content (because the padding would also need to be increased/decreased).

Also checking for position: sticky support in the CSS and falling back to the current implementation if it’s not.

Before: Screen Shot 2020-03-24 at 2 39 59 PM

After: Screen Shot 2020-03-24 at 2 39 21 PM

GitHub

I think should be in an afterRender block

CLA assistant check
Thank you for your submission! We really appreciate it. Like many open source projects, we ask that you all sign our Contributor License Agreement before we can accept your contribution.
10 out of 12 committers have signed the CLA.

:white_check_mark: featheredtoast
:white_check_mark: awesomerobot
:white_check_mark: jjaffeux
:white_check_mark: eviltrout
:white_check_mark: davidtaylorhq
:white_check_mark: vinothkannans
:white_check_mark: udan11
:white_check_mark: romanrizzi
:white_check_mark: markvanlan
:white_check_mark: riking
:x: SamSaffron
:x: jordanvidrine
You have signed the CLA already but the status is still pending? Let us recheck it.

ok, just updated it… can you double-check that I went about it the right way?

Yes should be good, your only risk now is that the node is actually not available because some fast transition removed the component before it rendered but still called the block. That could show an error but wouldn’t cause any crash, so no need to worry about it probably.

This pull request has been mentioned on Discourse Meta. There might be relevant details there:

https://meta.discourse.org/t/better-bulk-select-wrench-icon-placement/141396/5