WTH: Why header so unnecessarily big?

This leaves empty white space at the bottom of my view. The main container bg is an image, whereas sidebar bg is a css code. Any idea why?

I think the kiosk-mode “addon” might needs to make more CSS adjustments to compensate the missing header. The best thing would be to open an issue in the repositiory - maybe the creator can help here.

@christian_newton: The PR is merged now - so it should be in 0.117.0 :slight_smile:

1 Like

It is listed in the beta version of the release notes:

1 Like

Here you can see it “in action”: https://www.youtube.com/watch?v=rCF6EhsPNDU?t=75

By the way: To set the height of the new compact header to the hight of the old compact header, just add header-height: 48px to your theme.

1 Like

Way to find the undocumented theme var! Keep in mind things are still in the works, also I’d probably wait to update until the next beta version (if you’re into that kind of thing). Some issues with 0.117.0b0 at the moment.

1 Like

I was following your PR the last few days :wink: And since you’re already here: Thank you for the amazing new header!

I’ve already updated to the beta. But no big deal - I’m used to alpha/beta software, so bugs are not new to me :joy: (also I’ve got lots of backups, just in case)

2 Likes

Great video @nicohirsch ! Can I ask, how did you change the color of your header? Is this finally supported in themes or does this have to do with dark mode?

So happy to finally see this functionality moving over to core. Was there ever a way added to hide views (tabs) for specific users/user agents? I seem to remember this was added at some point but I can’t find where to set it up without custom header. Is this only possible if you aren’t in YAML mode, is that’s what it was?

You have been able to change the header color in themes as well as hide views for users in HA for a while now. The header theme variable is app-header-background-color.

The docs explain how to hide views for users here. Also, at the top of that same page are instructions on how to hide an entire dashboard from non-admin users. You can do all these things in YAML or storage mode. Follow the steps below if you don’t use YAML mode to manage these things from the UI.

There are switches to turn views on and off for users, hit the edit icon on a view while editing the dashboard and then hit the visibility tab. If you go to the sidebar and select Configuration > Lovelace Dashboards you can make a dashboard admin only.

Also, the video was made by @zsarnett.

3 Likes

Can I hide the header like in custom header?
It’s will be good for dashboard views.

@scstraus: I’d say Mayker already answered everything :slight_smile: Including that this is not my video (never wanted to create that impression)

@krovachek: You can try that one: https://github.com/matt8707/kiosk-mode

1 Like

must admit I am a bit disappointed with eh new Header in 117 not to show the instance name anymore. Why isnt this optional? It really should be, because now we dont have any option left to discern between different instances…

new 117.b1:
with favicon installed, but that seems not to work anymore?

116.4
with additional favicon installed

116.4
with additional favicon and custom header installed

I have three instances of Home Assistant running and use different header colors to discern between them (already did that with older HA versions and Custom Header):

  • Home: Dark Blue
  • Home Backup: Bright Red
  • Work: Corporate Identity color

yes that possible too, but not really the point now.

You can not ‘read’ it (the name of the instance, nor the optional view) anymore.
Again this is generic progress by taking specific functionality out. Hope Maykar can have a look to get that back in.

Btw, colors are also set by themes depending on various other states (night/day/alarm) so not really a true solution.

the height is identical now to history, logbook and map, but imho, still too large for icon only. Yet, compare it to developer tools where the page name still is displayed.

Would be really nice t have that possibility back for the Overview (and other dashboards)

You can set the height of the header with header-height: 48px in your theme(s) - then you get the “old” compact header height.

I’d not expect to many customization options, because they usually don’t get integrated into core.
But maybe sometime there will be something like custom addons for the header?

You can also check out card-mod to customize the header (but I don’t know what’s possible with that and the new header at the moment).

a yes, that’s nice, thanks, had been postponing the card-mod-theming till now, so yes, that would be a good start.

btw, has this made

homeassistent:
  name: Home

now useless too?

I’ve tried it but it isn’t proper solution for me because this view is used on other devices too, not only my dashboard. If I use it on my pc the header will be missed.

Have you tried, loading your view on the dashboards with ?kiosk at the end (instead of naming the view “kiosk”)?

https://hass:8123/lovelace/default_view?kiosk

That way, on you pc the header is still visible.

I’d say that it’s pretty useless at the moment, but that could change anytime.

hmm, I would consider that to be a major oversight in the new frontend design. A bug even. Will wait a bit to see if we get a response here, otherwise will issue this in the repo.

having viewed the first bit of this

I fear the poster finds this “really super cool”…
o dear.

only to be seen if you have 1 view. Now that’s going to be a lot of users… But, relief, we can still edit it ;-(

will create a separate post for this, not to hijack here.