Skip to content

Conversation

@cchaos
Copy link
Contributor

@cchaos cchaos commented Sep 29, 2021

Closes #5112 and closes #4843

Made subtitle optional

I ran into this where I wanted to use the EuiTour component more to indicate to users changes in the UI, so it wasn't more than a single step. Requiring two titles and body content was quite excessive. So I just made subtitle optional.

Fixed the footer background from extending beyond the popover bounds

Before
Screen Shot 2021-09-29 at 17 10 35 PM

After
Screen Shot 2021-09-29 at 17 10 26 PM

🔔 [Breaking] Changed how minWidth was applied and added maxWidth

Before, it was accepting a boolean, number or string and doing some className workarounds for the default of true. I noticed that this wasn't actually working (the default minWidth class was never getting applied) and so I just changed the type to CSSProperties['minWidth'] set the default to 300 and passed it along to panelStyle.

I also then added a similar thing for maxWidth.

Lowered the heading levels

They started at <h1>, but as per the guidance in #4843 , they should start at h2.

Checklist

  • Check against all themes for compatibility in both light and dark modes
  • Checked in mobile
  • Checked in Chrome, Safari, Edge, and Firefox
  • Props have proper autodocs and playground toggles
  • Added documentation
  • Checked Code Sandbox works for any docs examples
  • Added or updated jest tests
  • Checked for breaking changes and labeled appropriately
  • Checked for accessibility including keyboard-only and screenreader modes
  • A changelog entry exists and is marked appropriately

cchaos added 4 commits September 29, 2021 16:47
And instead maps directly to `CSSProperties[‘minWidth’]` and applies it directly to `panelStyle`.

Also adds `maxWidth` option.
@cchaos cchaos added the breaking change PRs with breaking changes. (Don't delete - used for automation) label Sep 29, 2021
@kibanamachine
Copy link

Preview documentation changes for this PR: https://eui.elastic.co/pr_5225/

Copy link
Contributor

@elizabetdev elizabetdev left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! 🎉
+1 for making the subtitle optional. Tested locally in Chrome, Safari, Edge, and Firefox.

All the tests snapshots don't look good to me. Even old ones like EuiTourStep can be closed. I added some suggestions to fix the new tests that you added but I'm not a specialist. So maybe @thompsongl can take a look.

Copy link
Contributor

@1Copenut 1Copenut left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you @cchaos! One question and one suggested change.

@cchaos cchaos requested a review from 1Copenut September 30, 2021 19:42
@kibanamachine
Copy link

Preview documentation changes for this PR: https://eui.elastic.co/pr_5225/

Copy link
Contributor

@1Copenut 1Copenut left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍 LGTM!

@cchaos cchaos merged commit e1a74cc into elastic:master Sep 30, 2021
@cchaos cchaos deleted the update/tour branch September 30, 2021 20:18
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

breaking change PRs with breaking changes. (Don't delete - used for automation)

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[EuiTour] Styling issues [EuiTourStep] Subtitle shouldn't be a h1

5 participants