Remove or hide the new Kibana (black/top) header

[johanhammar]

The new (black/top) Kibana header looks good but we would rather use the vertical space for logs. Would be great if there was an option to remove or hide the header

[elasticmachine]

Pinging @elastic/kibana-core (Team:Core)

[pgayvallet]

cc @elastic/kibana-design @alexfrancoeur is the option to display a thinner header something we've thought about?

[ryankeairns]

The top, black bar is essential to navigating between various Elastic properties while the lower bar is app-specific. For that reason, I don't foresee us hiding it altogether. That said, there are a few existing places where we provide a full screen experience and I suspect that to be the more likely solution going forward. That's not to say we won't consider adjustments but, at this point, a thinner header has not been discussed.

[circuitmike]

I'm not sure how this is "essential" in any way - 6.x did just fine without it. It looks like branding more than anything. It's thrown off the layout of some of my dashboards that were built for tablets. If Elastic considers it important then by all means, leave it enabled by default, but please give us an option to disable it. I don't want to have to do it through an ad blocker, which is my only other option at this point.

[pgayvallet]

It's thrown off the layout of some of my dashboards that were built for tablets

Wouldn't just use the fullscreen mode available from the dashboard app address that problem?

[circuitmike]

If it was a standalone display or something I might be willing to use fullscreen mode, but I really don't care for it for everyday use. Anyway, the point is that the bar is an annoyance that still robs us of vertical real estate. It didn't exist in 6.x and I'd just like an option to hide it.

[theirix]

The top bar makes Kibana 7.10+ unusable for small screens.
There is a good solution to make an option to hide the top bar and bring it with the command-slash keyboard shortcut (it is possible now). It allows user to search through Elastic products and save vertical space.

[meowtochondria]

At my org, people are getting confused where to write their search query - in top Search Elastic bar or box with Search written in it. There's a multitude of folks who use this UI. Some know way too much about logs, and others in support functions frequently need logging 101. I would appreciate if there was:

1. Option to hide top bar, as this ticket mentions, or
2. Redesign it in a way that allows branding to be visible, but is less confusing for folks who are not too deep into exploring data using Kibana.

[davtex]

+1 on this. In simpler ELK deployments where 95% of work is done via Discover tab this make little sense. It's like having those MSN/Winamp taskbars in IE6 in early 2000s that maybe looked nice, but had very little value for most users and took valuable space. Option to hide this bar would be most welcome.

[gempir]

The top bar is not essential. It gives you a search through a few pages, which can be found through the navigation some branding, help icon and a changelog. I've personally never used the bar once.

But it steals important vertical screen space.
Please just consider an option to hide it. Maybe move the Elastic logo down in the second bar when it's hidden, if the Branding is THAT important. (And it has a loading animation when kibana is loading)

Even the 2nd Bar I wouldn't consider essential, an Option to hide that would be welcome aswell. The discover page is super important and browsed by a lot of people where screen space is important.

Even the Filter Bar is pretty big without even having a Filter active. I understand that everyone uses Kibana a little different, but at least give us some options to configure it and don't space waste space. Almost 50% of the screen here are NOT logs.

I tend to go back to Grafana now to read logs because they provider a better UI for it that I can customize.

[snide]

I understand that everyone uses Kibana a little different, but at least give us some options to configure it and don't space waste space

You're absolutely correct, and that's certainly the challenge our UX team faces every day. In an upcoming release we'll be switching to our new layout for discover which should give a lot more control over the layout. In specific, it gives ways to control the density, size of columns, and real estate that the "grid" takes up. If you're interested in participating in a short feedback session with one of our researchers please drop a contact email and we'll reach out.

Here's a short screen share that shows some of these features that we're working on. I think they address a lot of the issues mentioned specifically from Discover.

https://snid.es/2022JAN/frwu0GLqbJVIsjOM.mp4

Towards the larger issue of the black bar in general across the application, it is very hard to stuff branding, navigation, space controls, your own profile awareness, app level controls, breadcrumbs and navigational search all into the same vertical space. This becomes much more challenging given different horizontal layouts and screen sizes.

Our goals from a design paradigm as a team will continue to be center around customization, and that will improve significantly as we add more user-aware settings to Kibana during the 8 cycle. Until those features land, we'll make small steps toward individual application customization (as I showed above for Discover). As these user-settings evolve you'll see us move towards customized navigation and layout. We'll do our best to provide sensible defaults.

Just wanted to provide some context and planning to let folks know we watch these issues. Please be patient with us on these things. We want to get them right and we aim for gradual change, rather than drastic change.

[gempir]

I appreciate the fast feedback and the changes you show look promising. I'm afraid I have taken over the issue a bit, because the original feature request was just a way to disable the first top bar.

Which I still think is reasonable even in the new layout.

[yj7778826]

+1, it waste too much space of screen

[chris-stytch]

We're testing out Kibana (this is 8.3 now) and have the same complaint.

In the image below you can see my Macbook Pro 13" laptop at default scaling with overlays on each section of the product with the useful sections (input, content, and state) highlighted.

Overall just a very limited amount of density for the information I want to look at and a lot of things that are used rarely, i.e. the bar at the top, taking up permanent space. If I want to navigate to the new part of the app I'd use that hamburger menu on the left to expand the side nav and pick there; but this is a rare occurrence, the most common task is to use the actual tool in front of me.

In the current structure, I'd love to be able to toggle off the top black bar, and have the side nav narrowed a bit for more space for the content.

[paalaas]

Same here, users get confused and thats why we're stuck on version 7.9.3.

[lizozom]

@johanhammar @paalaas @chris-stytch @yj7778826 and everyone else -

I've made an open source plugin for 7.x and 8.x that creates a floating top navigation menu.
Hope this helps, and feel free to contribute \ clone and modify!

https://github.com/lizozom/kibana-floating-toolbar

[paalaas]

Great stuff will test søn. 2. okt. 2022 kl. 12:41 skrev Liza Katz ***@***.***>:

…

@paalaas <https://github.com/paalaas> @chris-stytch <https://github.com/chris-stytch> @yj7778826 <https://github.com/yj7778826> and everyone else - I've made an open source plugin that creates a floating top navigation menu. Hope this helps, and feel free to contribute \ clone and modify! https://github.com/lizozom/kibana-floating-toolbar — Reply to this email directly, view it on GitHub <#95782 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AF4BYZGRJYR7QI4S3ARUG3LWBFRHDANCNFSM42B7CXIQ> . You are receiving this because you were mentioned.Message ID: ***@***.***>

[macaty]

+1

[chinhodado]

It has been 2 years, is there any update on this?

[elasticmachine]

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

[chinhodado]

My quick and dirty fix is this custom CSS:

/* Hide useless top blackbar */
.kbnBody.euiBody--headerIsFixed {
  padding-top: 48px;
}

.euiHeader.euiHeader--dark.euiHeader--fixed.header__firstBar {
  display: none;
}

.euiHeader--fixed+.euiHeader--fixed {
  top: 0px;
}

but it does cause some minor UI layout glitches here and there

[lhzw]

Rubbish design, disgusting, waste space and time.

[petrklapka]

This was a great suggestion. It is addressed by two other efforts. The first is the upcoming Solution focused stateful UX which removes the black bar entirely. The other is a unified "full screen mode" where the sidenav and top bars are hidden to allow the app/page to take full focus. Both of those efforts are underway now and should deliver soon. Closing this as not-planned.