feat(ui5-wizard): improve progress navigator responsiveness #2590
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
|
|
MapTo0
requested changes
Jan 6, 2021
| } | ||
| } | ||
|
|
||
| _adjustHeaderOverflow() { |
There was a problem hiding this comment.
add some comments and try to split this a little bit.
There was a problem hiding this comment.
add some comments and try to split this a little bit.
Done
packages/fiori/src/themes/Wizard.css
Outdated
| user-select: none; | ||
| background: #fff; | ||
| font-size: .875rem; | ||
| box-shadow: 0 0 0.25rem 0 rgba(0,0,0,0.15), inset 0 -0.0625rem 0 0 #d9d9d9; |
| -moz-user-select: none; | ||
| -ms-user-select: none; | ||
| user-select: none; | ||
| background: #fff; |
MapTo0
previously approved these changes
Jan 8, 2021
|
MapTo0
approved these changes
Jan 11, 2021
ilhan007
pushed a commit
that referenced
this pull request
Jan 13, 2021
* [WIP] ui5-wizard: improve progress navigator responsiveness * feat(ui5-wizard): responsive behaviour * ui5-wizard: selection-change fired as expected * ui5-wizard: minor enhancements * ui5-wizard: CSS adjustments * ui5-wizard: CSS adjustments * [WIP] ui5-wizard: improve progress navigator responsiveness * feat(ui5-wizard): responsive behaviour * ui5-wizard: selection-change fired as expected * ui5-wizard: minor enhancements * ui5-wizard: CSS adjustments * css improvements * ui5-wizard: IE fix and other minor adjustments * ui5-wizard: attributes names changed Co-authored-by: Martin Hristov <[email protected]>
ilhan007
added a commit
that referenced
this pull request
Mar 2, 2021
ilhan007
added a commit
that referenced
this pull request
Mar 17, 2021
ilhan007
added a commit
that referenced
this pull request
Mar 18, 2021
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.
Overview
Wizard's navigation header is now responsive. On small sizes, when the space is not enough for the all ui5-wizard-tab instances to be fully visible, the are stacked in a group. Such a group could be positioned in the beginning or in the end of the wizard's navigation header, depending on the user interaction.
When a tab is stacked, it could be activated from a popover, which is presented on a click over the top most of the grouped tabs. The popover contains a button for each grouped tab. On mobile devices, a dialog is used.
For a disabled step, the button in the popover is also disabled, since it is not possible to activate such step.
Preview
WizardProgressNavigator.mov
FIXES: #2441