Shouldn’t it be transparant instead of transparent? The latter has never worked for me, that is why I ask.
Edit: Somehow I missed the fact that compact-custom-header is now just Custom Header. Makes plenty of sense now.
Anyone else see this in their startup logs lately? Not sure when it started showing up, but I did just update to .103.2 today.
“You have maykar/compact-custom-header installed with HACS this repository has been blacklisted, please consider removing it.”
tried to search around and I didn’t really find anything that seemed to point to why this is showing in the logs. CCH seems to be functioning without an issue.
I’m getting the spinning wheel when I try and update as well…
The documentation website is back online 
Looks like HACS…
@DavidFW1960 Restart HA and it should work.
I did and it just kept spinning from before. Weird. Eventually it seemed to time out and I clicked uninstall and then installed and it’s updated now.
cool, I’ll check 
suppose I need to set it for the icon specifically? I first thought maybe this Custom Header could be an option, but when using eg
button_text_css: padding-bottom: 2px
this would be set for the full header… Could I set it for the icon in the button_text in this section of the config also?
Moreover, the warning given here:
Keep in mind that this will be trial and error as these items already have CSS applied to them that you’ll be overriding
makes me wonder if it wouldn’t be better to center the icons vertically in the CH code itself?
anyways, this seems to be better:
button_text:
options: >-
{{ time }} - <ha-icon icon='{{states('sensor.weather_icon')}}' style='padding-bottom: 3px';></ha-icon> - {{states('sensor.temp_current') }}°
but, when being really minute about things… checking the button_text vertical alignment against the header itself, it seems it is down a few pixels.
That would be a CH code thing I would think, because when trying the
options_css: 'padding-bottom: 10px;'
the full header moves up, and not only the options section right of the right chevron.
options_list_css doesnt seem to do anything
I just tried both ways and both worked for me.
1 Like
I was just trying to put it back to how I had it with the old CCH where you could control it within a theme.
@ObiKaiKenobi code worked so happy with this, thanks
1 Like
Unable to update to 1.1.0.
2019-12-20 04:22:10 ERROR (MainThread) [hacs] Tried to serve up '/config/www/community/custom-header/custom-header.js' but it does not exist
2019-12-20 04:23:02 ERROR (MainThread) [hacs.repository.plugin.maykar.custom-header] Download was not complete.
I see this now in the error logs:
local/lovelace/resources/custom-header.js?v=1.1.0:574:37682 TypeError: undefined is not an object (evaluating 'g.tabs[e].getBoundingClientRect')
hope anyone can shed some light what that means?
@VDRainer and I were pointing you to the page that explains that if you want to use it in a theme it would be ch-background: 'rgba(150, 150, 150, 0.1)' not custom_header-background: 'rgba(150, 150, 150, 0.1)'
1 Like
Doing css outside by CH would effect the whole menu element. You only want to do the single custom ha-icon element so you have to do it inline. I just tried 8px and it looks perfect
Did you change something to get rid of the “error”
Up to date now. Thank you.
I’ll look into this, but as far as making exceptions in the css for the ha-icon element: This was just an example of one of the many things you can do with templates. I can’t start making separate styles for everything that would be possible to do, so it’s better to do it with inline styles inside the template as you have done in your one example. This isn’t a vertical aligning issue that can just be fixed with one bit of CSS, this would be CSS added per element.
of course, and I understand and appreciate that.
It’s more that I think I see a general misalignment between the tabs on the left side of the option block, and the text/icons in the option block itself (left/right of the right chevron).
I managed to align the text and icon in that block correctly now, only need a few px and as the wind blew today, could see the middle line of the icon perfectly aligned with the dashes in the template output. Though admittedly, it now seems 1 px off again…
Nonetheless, my quest was now to bring left and right side in balance.
Don’t think that would be a thing of individual taste or local detail. I would think that to be a global CH setting, to center align by default?
btw, as mentioned, I did try to css style the option block (options_list_css), but nothing changed the outcome, not even giving it a color…
I probably need to adjust the styling of the “buttons” when they are a template or text, so that should be an easy enough fix. I’m on it, bigger fish to fry at the moment though. Latest update is another attempt at fixing remaining iOS issues (overlapping header on safari & app and active tab issues).
Some of those will need !important added to the end of the css, but I’ll look into that as well.