Skip to content
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

[Guided onboarding] Remove fixed height on dropdown panel #144334

Closed
alisonelizabeth opened this issue Nov 1, 2022 · 1 comment · Fixed by #147333
Closed

[Guided onboarding] Remove fixed height on dropdown panel #144334

alisonelizabeth opened this issue Nov 1, 2022 · 1 comment · Fixed by #147333
Assignees
Labels
8.7 candidate enhancement New value added to drive a business result Team:Journey/Onboarding Platform Journey Onboarding team

Comments

@alisonelizabeth
Copy link
Contributor

The dropdown panel is currently a fixed height, which can cause an uncomfortable stacking with toasts.

For example:
Screen Shot 2022-11-01 at 11 36 18 AM

@alisonelizabeth alisonelizabeth added enhancement New value added to drive a business result 8.7 candidate Team:Journey/Onboarding Platform Journey Onboarding team labels Nov 1, 2022
@elasticmachine
Copy link
Contributor

Pinging @elastic/platform-onboarding (Team:Journey/Onboarding)

cindychangy added a commit that referenced this issue Dec 13, 2022
Fixes [issue #144334](#144334)

Making the panel not take the full height of the screen as is the
default of `EuiFlyout` which we are using.

![image](https://user-images.githubusercontent.com/11224465/207008176-dd34c4d1-7033-46a0-8ff8-b352eb2c9ce8.png)

**Notes**:
- Realized when reading the docs, that there is a `maxWidth` prop for
the `EuiFlyout` so I swapped that with the custom style we had
- Revised the custom styles in `panel_styles.ts` to achieve this
- I put a `max-height` on the panel so there is always room for 1 toast

Let me know if you think there is a better way to approach this.
saarikabhasi pushed a commit to saarikabhasi/kibana that referenced this issue Dec 14, 2022
Fixes [issue elastic#144334](elastic#144334)

Making the panel not take the full height of the screen as is the
default of `EuiFlyout` which we are using.

![image](https://user-images.githubusercontent.com/11224465/207008176-dd34c4d1-7033-46a0-8ff8-b352eb2c9ce8.png)

**Notes**:
- Realized when reading the docs, that there is a `maxWidth` prop for
the `EuiFlyout` so I swapped that with the custom style we had
- Revised the custom styles in `panel_styles.ts` to achieve this
- I put a `max-height` on the panel so there is always room for 1 toast

Let me know if you think there is a better way to approach this.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
8.7 candidate enhancement New value added to drive a business result Team:Journey/Onboarding Platform Journey Onboarding team
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants