[Lens] Refactor Flyout Design Updates #14
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
9 tasks
|
If I recall that Edit: using |
|
Tested locally and could not find any performance regression with it |
kibanamachine
added a commit
that referenced
this pull request
Dec 14, 2021
…stic#120103) * 💄 Revisit form style + spacers * ✅ Fix tests * ✨ Replace percentile input with range * 💄 Fix mobile layout * 💄 Make searchbar go below flyout * 🔥 Remove unused jsx * [Lens] Refactor Flyout Design Updates (#14) * allow flyout to go full width on small viewports * remove hiding of layer panel when flyout open Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> Co-authored-by: Michael Marcialis <michael@marcial.is>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Hey, @dej611. This is a little design PR that performs the similar task of fixing the broken Lens configuration flyout at small viewport sizes, but with some slightly reorganized CSS. It also removes the flyout's
max-widthstyles, which allows it to go full width at small viewport sizes (which I think looks better and allows users to better focus on the configuration task on small devices). Finally, it removes somevisibilitystyles that it looks like Wylie had applied to the layer panel when a configuration flyout is open. Not sure why those styles where put in place, but their removal didn't appear to break anything and it prevented the odd flashing disappearance of the layer panel that can be seen when the flyout animation is triggered.