[Snapshot & Restore] UX enhancements

[sabarasaba]

While working on #131310 we found with @cristina-eleonora a lot of places throughout the UX that can be greatly improved:

• All wizard flows have the back, next, create ... cta's left aligned and the cancel button right aligned. Which seems incredible confusing. We should invert them.
• Wizard body should be wrapped with EuiPanel, cta's can remain outside of it.
• We should increase spacing between wizard titles and its content, right now they are way too close together
• Most summary screens use EuiDescriptionList with textStyle: reverse for some reason, making it a lot harder to scan the selected values in the summary screen.
• There's a bunch of copy changes that we think could help improve the UX for Policy creation -> snapshot settings (we should double check with docs team though):
  • All toggles labels duplicate the copy of the title of the setting making it appear twice. We would like to rename the toggle labels to just Enable.
  • Copy for Data streams and indices should now be All data streams and indices
  • If we rename the toggle label for include feature state to Enable, the dropdown should have a label that says Include feature states from
• UX for include all datastreams and indices and feature states can be improved by being more explicit about what its been selected by using EuiGroupButtons:

[elasticmachine]

Pinging @elastic/platform-deployment-management (Team:Deployment Management)

[cjcenizal]

I love the attention to detail in this feedback! I have thoughts about two specific parts of this guidance.

On labels: The EUI guidelines for labeling switches states: "Avoid verbs that are less conversational such as "enable" unless they are your only option." This is because labels for performing an action should contain at least some of the context you need to decide whether or not to take an action. This is good for accessibility (screen readers will read the label), and people who for whatever reason have trouble forming context from multiple places on the screen (attention-deficit challenges, low peripheral vision). It's also a fundamental usability boost IMO because if I want to know what a switch or button will do, I just have to look at it.

On wizards: Before we implement the changes to the wizard UX, I suggest @cristina-eleonora update the EUI docs for the Horizontal Steps example with visual examples of the changes we want to make. This will ensure other designers also disseminate these ideas throughout our UIs and provide unambiguous guidance to the engineers building these wizards. After that I suggest we audit our UIs for other wizards (there are many!) and create a specific "Wizard layout migration" issue to track this work.

[cristina-eleonora]

I suggest @cristina-eleonora update the EUI docs for the Horizontal Steps example with visual examples of the changes we want to make.

I'll have to consult the team of designers before adding it to the guidelines. I am trying to identify if we already have some guidelines that have not been published on the usage of horizontal steps, and if no, I'll see if I can get it approved.