elastic / kibana

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

Add dark theme styles to all kui framework components #11177

Closed trevan closed 6 years ago

trevan commented 7 years ago

It would be nice if all of the components had a darkTheme version. I use a few of them in plugins and hacks and I have to add custom darkTheme styles to make them look nice in the dashboard. Is there a reason why not all of them have darkTheme or is it just the fact that no one has put in the work?

cjcenizal commented 7 years ago

@trevan This is something I've had in mind for a long time, since it would address https://github.com/elastic/kibana/issues/6786, which requests the ability to have dark theme everywhere. (I'd actually like to close that issue as a duplicate of this one, since I think this issue more clearly defines the path forwards).

Would you mind going into more detail about your use case? Why is dark theme everywhere important? How do people use it, and why? Thanks in advance for any information you can provide!

trevan commented 7 years ago

@cjcenizal The plugins that I'm talking about are visible on the dashboard (nav bar plugins, visualizations, and hacks). I would like to use the kui framework in them because it makes them look like a part of the app. But when someone switches to dark theme, the components that don't have a dark theme look out of place unless I manually add the extra styles.

It is kind of similar to your change in 3fc88df6700a5b35f5e3f86a06290dc79d1f95ee. You switched the add vis panel to use the kui framework and had to add dark theme to several more items (which was awesome, by the way). I use modal, tabs, and notices in the plugins so I've added darkTheme versions for them.

As for dark theme everywhere, I would also like that. Most of my coworkers prefer the dark theme dashboard and going from white landing page to dark dashboard is kind of distracting. Before the landing page, you could stay almost always dark since you can load and create in the dark theme. But the required landing page now forces you to go white. It is also distracting when you click to edit a vis or search and you are forced back into white.

As for why they prefer it or use it, I've asked and they just say they like it better. It makes it feel like a "real app" (not sure what they actually mean by that, though).

timroes commented 6 years ago

Is this issue still relevant with the introduction of EUI? It feels like we should now have a dark theme for all(?) components in EUI?

trevan commented 6 years ago

Yeah, this can be closed since kui has been deprecated and all components that use eui have a dark version.