Make notices push down content #13614
Conversation
jasmussen
added
[Type] Enhancement
|
Please read also review points on #12301, as some of them still apply. |
|
This also mitigates the situation in https://core.trac.wordpress.org/ticket/46098#comment:6. |
|
Nice, thank you. I put this in a milestone and expanded the review range for a code review. |
|
In Firefox, I see an issue at the medium range viewport size (~970px). Using:
|
This PR restores the good stuff from #12301. That is: it allows notices to push down content. Dismissible notices are sticky at the top, non-dismisible notices scroll out of view. This is mostly an exact copy of the other PR, but fresh. The behavior has a number of benefits: - If you have multiple non-dismissible notices, you can still actually use the editor. - Notices no longer cover the scrollbar. - Notices no longer cover the permalink interface. - Notices now only cover content if you do not dismiss the notices.
jasmussen
force-pushed
the
try/restore-notices-push-content
branch
from
9deb5de
to
33ddecf
Compare
jasmussen
requested review from
ajitbohra,
chrisvanpatten,
gziolo,
jorgefilipecosta and
talldan
as code owners
|
Noticed an issue with this branch that isn't fixed:
Notice how the sticky notice covers the block toolbar. However, compare to master:
It's even worse there. For that reason, I feel like it would still be good to ship this as an improvement. |
|
Looking into the issue, thanks Andrew. It's not Firefox specific, it's because of the top toolbar. |
|
Solid catch, Andrew. Turns out there was a lot of old cruft there that was vestigial and could be killed entirely. So the most recent commit should fix issues even in master:
I think this should be good for a final review. |
This PR tries to add additional animation when the sidebar open/closes. Specifically, it now animates the right-margin in lockstep with the sidebar opening and closing. This causes the main body content to animate, just like the sidebar, for a nicer experience. However in order to be performant, this means we add `will-change: transform;` to the .edit-post__layout-content`. This is causing an issue with the notices, which will be moot when #13614 gets merged, so *this PR is dependant on that landing first*. Secondly, although it's a small PR, the addition of the will-change property is likely going to need a lot of testing so it doesn't cause regressions. Things to look for are absolute, fixed, or sticky position elements and the like. In my own testing, only the notices regressed which as mentioned gets fixed when 13614 lands. But this will still need a lot of eyes.
|
Thanks all for the reviews, I think this is good to go when the checks pass. |
|
That would be an improvement. It's a bit jarring to have the title covered. Thanks for letting me know. |
* Make notices push down content This PR restores the good stuff from #12301. That is: it allows notices to push down content. Dismissible notices are sticky at the top, non-dismisible notices scroll out of view. This is mostly an exact copy of the other PR, but fresh. The behavior has a number of benefits: - If you have multiple non-dismissible notices, you can still actually use the editor. - Notices no longer cover the scrollbar. - Notices no longer cover the permalink interface. - Notices now only cover content if you do not dismiss the notices. * Address top toolbar issues. * Remove the overly specific is-pinned.
* Make notices push down content This PR restores the good stuff from #12301. That is: it allows notices to push down content. Dismissible notices are sticky at the top, non-dismisible notices scroll out of view. This is mostly an exact copy of the other PR, but fresh. The behavior has a number of benefits: - If you have multiple non-dismissible notices, you can still actually use the editor. - Notices no longer cover the scrollbar. - Notices no longer cover the permalink interface. - Notices now only cover content if you do not dismiss the notices. * Address top toolbar issues. * Remove the overly specific is-pinned.
This PR restores the good stuff from #12301. That is: it allows notices to push down content. Dismissible notices are sticky at the top, non-dismisible notices scroll out of view.
This is mostly an exact copy of the other PR, but fresh. The behavior has a number of benefits:
Fixes #7276.
GIFs: