Open clarkwinkelmann opened 5 years ago
Any ideas from anyone on the most elegant solution?
Bootstrap 4 (yeah I know) has the boundary
option for the dropdown which defines the overflow constraint, it is set to scrollParent
by default which is comparable to the current behaviour, but it also allows other settings window
and viewport
which would be a solution to this issue.
https://getbootstrap.com/docs/4.0/components/dropdowns/#options
Well technically this might be a feature but I'm pretty sure it's an unexpected regression from last beta.
In https://github.com/flarum/core/commit/bf3934d16f166921a8757ca0bce93e93fcf2f3ca @tobscure added horizontal scroll to the editor controls. That's great for mobile.
Unfortunately this means we're subject to this:
Meaning overflow above the text editor is now hidden.
It's now impossible to use a dropdown as a control. Expected:
Got:
Two of the extensions I'm working with make use of this behavior. One is Flagrow Fonts, the other is my EmojiOneArea extension. They can no longer display any dropdown (or drop-up).
Tooltips still work because they use jQuery and are created outside of the div. But I'd love to not have to rely on jQuery to manage popovers like those.
I'm going to force
.TextEditor-controls { overflow: visible; }
in those extension's CSS for now as I can't see any easy workaround. I'll just lose horizontal scrolling on mobile...