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

Don’t reduce header at at mobile size #1480

Merged
merged 3 commits into from
Jan 28, 2019
Merged

Conversation

cchaos
Copy link
Contributor

@cchaos cchaos commented Jan 25, 2019

Summary

The header was being too squished in height on mobile screens. This PR just keeps the height from changing (but still allows the buttons to squish in width).

Note

To @ryankeairns : I moved the min-width: 49px to just the header logo because it was causing the spaces avatar to look off-center. Though when I look at it without that the button seems to still render at 49px wide (probably because the 'border' is at right: 0. But anyhow, you can double-check that part and let me know if you'd rather me put it back the way it was.

Checklist

  • This was checked in mobile
  • This was checked in IE11
  • This was checked in dark mode
  • [ ] Any props added have proper autodocs
  • [ ] Documentation examples were added
  • A changelog entry exists and is marked appropriately
  • [ ] This was checked for breaking changes and labeled appropriately
  • [ ] Jest tests were updated or added to match the most common scenarios
  • [ ] This was checked against keyboard-only and screenreader scenarios
  • [ ] This required updates to Framer X components

Copy link
Contributor

@snide snide left a comment

Choose a reason for hiding this comment

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

This looks OK. Let's make sure we do the follow up on the Kibana side since I think it has some breakpoint work there as well.

@cchaos
Copy link
Contributor Author

cchaos commented Jan 25, 2019

@ryankeairns You good with these changes?

Copy link
Contributor

@ryankeairns ryankeairns left a comment

Choose a reason for hiding this comment

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

Yep, looks great! Apologies for missing this mention.

@gjones
Copy link
Contributor

gjones commented Jan 28, 2019

Just want to add my +1 for this as I'm seeing issues with the search box on mobile in Cloud.

screenshot 2019-01-28 at 09 46 40

https://elastic.slack.com/archives/C7QC1JV6F/p1548686989609400

@cchaos cchaos merged commit 7a8e258 into elastic:master Jan 28, 2019
@cchaos cchaos deleted the mobile-header branch January 28, 2019 16:12
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants