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

EUI CSS reset regression audit #15315

Closed
15 tasks done
cjcenizal opened this issue Nov 30, 2017 · 1 comment
Closed
15 tasks done

EUI CSS reset regression audit #15315

cjcenizal opened this issue Nov 30, 2017 · 1 comment
Assignees
Labels
Team:Platform-Design Team Label for Kibana Design Team. Support the Analyze group of plugins.

Comments

@cjcenizal
Copy link
Contributor

cjcenizal commented Nov 30, 2017

Here are a few of the visual regressions incurred by the swap to the EUI CSS reset. We'll merge fixes into https://github.com/elastic/kibana/tree/eui/reset-css.

Notifications

  • Notifications are missing padding around their edges, causing text to appear misaligned vertically and buttons to be flush against the top and bottom edges.

image

Timepicker

  • Timepicker buttons don't have a pointer cursor when hovered, probably because they're a elements with no href attribute.
  • The spacing also looks like it got tighter, causing the "collapse" button to get uncomfortably close to the "Absolute" button.

image

Query bar

  • The "Add filter" button doesn't have a pointer cursor when hovered.

image

Discover

  • The "Selected fields" label is too close to the index pattern title.
  • The "Available fields" element become too short, causing the gear button on the right side to overflow.
  • The link ("143" in the screenshot) is missing link styles.
  • The vertical spacing of the values and progress bars looks too tight.

image

  • When expanded, the labels are too close to the Available Fields inputs.

image

  • In "Single document" view, the tabs lack pointer cursors when hovered, possibly because they're a elements without href attributes.

  • Note: this applies to the tabs in an expanded row of the doc table, too.

image

Visualize

  • The title is too close to the search bar in the Visualize Wizard.
  • The sr-only accessibility class has been deleted, which means all elements previously hidden by it are now visible. We can fix this by replacing this class with euiScreenReaderOnly instead.

image

  • The sidebar tabs lack pointer cursors when hovered, possibly because they're a elements without href attributes.

image

  • The spacing between "Select bucket types" and the menu is too tight.

image

@cjcenizal cjcenizal added the Team:Platform-Design Team Label for Kibana Design Team. Support the Analyze group of plugins. label Nov 30, 2017
@cjcenizal cjcenizal mentioned this issue Nov 30, 2017
15 tasks
@snide
Copy link
Contributor

snide commented Dec 7, 2017

These should all be solved by #15436

@cjcenizal cjcenizal mentioned this issue Dec 7, 2017
9 tasks
@snide snide closed this as completed Jan 30, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Team:Platform-Design Team Label for Kibana Design Team. Support the Analyze group of plugins.
Projects
None yet
Development

No branches or pull requests

3 participants