search

elastic / kibana

Your window into the Elastic Stack
https://www.elastic.co/products/kibana
Other
19.82k stars 8.21k forks source link

Spacing inconsistencies in Navigation #194448

Open yanwalton opened 3 weeks ago

yanwalton commented 3 weeks ago

@dimadavid made me aware that we have spacing inconsistencies throughout our navigation. It would be good to find out why this happened and make the fix so that switching between navs is graceful.

Let's investigate what the final spacings should be @ryankeairns and @MichaelMarcialis and who can fix this - either Shared UX or EUI

CC: @JasonStoltz and @petrklapka

Screenshot here Image

elasticmachine commented 3 weeks ago

Pinging @elastic/appex-sharedux (Team:SharedUX)

ryankeairns commented 3 weeks ago

For reference, the EUI components were aimed at producing a design with spacing as seen here

Screenshot from linked storybook

petrklapka commented 3 weeks ago

The sidenav component can be customized to have flexibility in the spacing. The flyout component can hold either a standard panel or a custom component. In the case of security they use a custom component (cc: @semd ). SharedUX will be happy to fix common components once design settles on a standard.

MichaelMarcialis commented 3 weeks ago

Hey, all. I've been far removed from this project for quite a while now. However, based on what I'm seeing in the current serverless environments, it seems that most (if not all) of the inconsistencies are self-inflicted by the aforementioned solutions. The Elasticsearch solution's navigation in serverless appears largely as intended (compared to Ryan's Storybook example), but both Observability and Security solution navigations appear to be injecting a lot of spacers in various locations. These bespoke spacer injections are what is creating these inconsistencies.

I'm assuming the ability to add custom components (such as spacers) was provided to ensure ultimate flexibility with these navigations, but this flexibility is resulting in inconsistency. If they wish to be consistent, I imagine the simplest direction is to advise them to follow the Storybook example and not deviate (acknowledging that if they do decide to deviate, it will result in these sort of inconsistencies). Alternatively, we could consider being more strict about the sort of customizations that could be made to the navigation, but I'm guessing that isn't desired by the solution teams (recalling from past navigation conversations).

Anyway, I'm happy to help in any way, but this looks like something that will ultimately need to be addressed by the Observability and Security engineers.