-
Notifications
You must be signed in to change notification settings - Fork 841
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
EuiSteps to allow for different title sizes #3324
Comments
cc @hbharding on this as he's looking into the disparate stylings we currently have between vertical and horizontal steps as well as possibly some other customizations. |
@andreadelrio FYI, i'm thinking of adding a "disabled" state for vertical steps, which might be useful in the context of your screenshot. If form fields in step 1 are required to complete step 2, we could disabled step 2 (and not render content) until step 1 is valid. My use case is slightly different, so not sure if it's necessary for you here. One benefit of disabled steps is that it could declutter the page / reduce the overall height of the steps in it's initial state, and may help the user to focus. (old mockup for reference... i might change the disabled colors a little) |
I would just be wary of completely hiding content in disabled steps. I've run into this problem quite a few times where if the next content depends on the previous selections what happens when the user is at step 3 but then changes the info in step 1. Does it completely erase their efforts in the following steps? Does it re-hide the content? Does it just populate then error out the next steps? Do the previous steps become readonly? Just something to think about. The reason we have horizontal steps is to mitigate this concern because then not all of the steps are present at the same time. Definitely, focusing users on their current decision is good guidance, it just gets tricky when you have dependent content all visible. If the content doesn't change within the following steps, just the choices, then you might want to consider disabling the options as they flow, versus hiding all the content. Though you could still indicate where the user needs to focus via the step visual. |
And now that I've hijacked this particular issue, maybe we need a separate one for disabled steps just to start the conversion. |
Great points / definitely more to think about... in another issue :) Apologies for getting off topic. +1 for different title sizes for EuiSteps |
Right now the
title
prop is placed inside<EuiTitle size="s">
. We'd need to have a prop to customize the title size.This is the scenario where this came up. We had the following flyout and we wanted to reduce the font size in Steps in order to reflect hierarchy
Related comment in Kibana PR here
The text was updated successfully, but these errors were encountered: