Hi Ryan,
I was wondering if we could set a generic active tab color, while respecting color settings for some individual tabs/icons set in the tabs_color:
thanks for having a look.
You can do this:
custom_header:
tabs_css:
0: 'color:green !important;'
active_tab_color: 'blue'
Active tab color will be blue, but not when tab 0 is active. It will remain green.
thanks!
this seems to work also:
active_tab_color: black
tab_indicator_color: black
tabs_color:
phones_tablets: >-
{{state_attr('sensor.family_home','icon_color')}}
both active tab icon and indicator are black, except for the tabs color phones_tablets, which follows the template.
FR: allow the indicator to be set as the tabs_color, so it would follow suit:
the naming of the options is a bit unsystematic as it is, might need some careful re-wording
Is it possible to show both the view icon and view name with CH?
could this be the cause of the frequent and spontaneous refocussing of the header? As of late, my header keeps refocussing, seemingly without any obvious reason.
as a consequence, the browser (safari) started to warn again for high power usage. Only thing I can think of is the change in the CH in its iteration 1.1.5
Default tab triggers once so I do not believe this would cause any issues with memory. Even when using templates Custom Header only runs code when an entity in that template has changed or, if using a clock, once every minute. Aside from that it will run some styling when switching tabs or going into and out of configure ui mode. From my tests Custom Header takes very little resources to run.
Ok thanks for explaining. Ive updated to the 1.1.7 version now, and it seems to be much more stable. The constant moving about of the icons in the header is gone completely so it seems! which feels really very nice indeed.
Only thing I still see, and it was that way in CCH too, is when navigating from a badge or other card/entity to a tab that is out of view, it scrolls there alright, and then move the focus tab 1 out go view…
Does this happen when chevrons are turned off?
No I have chevrons on. Its a bit difficult to make a gif, because I use split mode…
which reminds me:
2019-12-30 16:19:42 ERROR (MainThread) [frontend.js.latest.201912041] https://redacted/local/lovelace/resources/custom-header.js?v=1.1.7:576:38185 TypeError: undefined is not an object (evaluating 'e.split_mode')
keeps showing in the log
For some reason, following exception snippet not showing one tab (6) on my phone. Other tabs (0,1,4) show up fine. When I add additional tab (7th) then 6th tab shows up.
{% else %} 0,1,4,6,7
What am I missing here?
There are no errors in the dev console.
exceptions:
- conditions:
query_string: kiosk
config:
kiosk_mode: true
- conditions:
user_agent: Android
config:
disable_sidebar: false
compact_mode: true
reverse_tab_direction: true
indicator_top: true
hide_tabs: >
{% if is_state('sensor.house_mode','Night') %}4
{% endif %}
show_tabs: >
{% if is_state('sensor.house_mode','Darkhouse') %}0,1,2,4,6
{% else %} 0,1,4,6
{% endif %}
footer_mode: true
chevrons: false
menu_dropdown: true
button_text:
options: >-
<ha-icon icon='mdi:weather-{{
states.weather.dark_sky.state }}'></ha-icon> {{
states.weather.dark_sky.attributes.temperature }}°
Hi,
I may have been pushing the CH config somewhat, but ever since using the templates in the CH for the header text (marquee) and options button text with the weather icon and time, I notice worse system responsiveness, and see the Hue lights go unavailable again (which has become a warning signal for system timing issues …)
I’ve reverted to a rather basic setup again, with a few templated button icons and colors, and taken out split mode too, since that gives many errors (reported above)
I also noticed that because of the templates changing states (which is what they are supposed to do of course) the frontend needs to reload and the CH changes focus/position on these changes. It is rather difficult to describe scientifically, but easy to see, when one simply stays put on the page and have time do its thing.
Must experiment more to be able to up the ante here in precision feedback, but maybe you could have a look?
Another question: using default_tab_on_refresh: false the browser still navigates to the homepage on a refresh, while I hoped this would make it stay on the tab on which the refresh is pulled down (iPhone)? Isn’t that what this setting is for?
Hope you can have a look.
thanks!
Custom Header only operates on the front end and while adding more custom elements to the front end can slow the interface, Custom Header only updates on entity changes (ones used in CH templates) and/or every minute if you’re using a clock. These updates generally take milliseconds and would never have any effect on your Hue Lights.
When these changes happen while using the entirely unsupported feature of adding HTML to Custom Header text, you will notice that those animations restart/refresh (every minute if using a clock and on every entity change for entities used in CH templates). Otherwise the template info would never update.
Disable Custom Header and I think you’ll find that the same thing happens when using the iOS app. I cannot override this.
I was asking if this is still an issue if you turn chevrons off to help me track down the issue.
I’m aware of the error, but just don’t have the time to work on Custom Header at the moment. Will be back at it soon.
Can you try:
show_tabs: >-
{% if is_state('sensor.house_mode','Darkhouse') %}0,1,2,4,6
{% else %}0,1,4,6
{% endif %}
How do I enable time and date in header??
I would suggest reading through the docs.
Adding header text is explained here and provides an example for a clock in header text, adding text to buttons is explained here and includes an example of a clock/date in button’s text, the templates section explains how to customize these things and also includes an example for a clock, found here.
Ah, darn that white space character. From yesterday, first tab (0) is not showing up when I browse on mobile.
I am not sure if CCH is causing this or button card.
I have this entry in my config.
split_mode: false
From Dev Console:
Start from this solution and play around the variables.
O sorry, I totally missed that… really embassed here now. Will disable them and see what happens.
Ok, thanks. But what then does the setting do, if not override the default behavior?
Well, that might be true in theory, but practice has learned differently before. When I still was on a rpi3, refreshing Lovelace systematically caused Hue to loose the connection and have all Lights reconnect, rendering logic based on their state useless. Reported that in several threads in the community and Github, and was well discussed. Has everything to do with the implementation of the Hue integration and the Api that requires HA to poll the Hue hub, instead of the Hue hub pushing state to HA.
In the current case though, I might have jumped to conclusions… As it stands, in the same edit of the config where I added the templates and marquees to the CH config, I added a package for discovering and reporting unknown entities. The automations that are triggered in that scenario (keep checking every few minutes when still sensing unknown entities) apparently causes issues in the timing of HA instance, making Hue signal that with the lost connection. I’ve turned off those automations now, and the system seems to have stabilized.
All in all I owe you an apology for that quick jump…
cool, take all the time you need, just glad you recognize it and have it on the radar.
cheers!
default_tab_on_refresh: false will prevent lovelace from returning to the tab set with default_tab: when the page is refreshed. This will work in most browsers, but the iOS app behaves differently and will always return to the first tab on refresh. Outside of the iOS app lovelace will return to the tab you were viewing when refreshed, this is the default behavior of lovelace without Custom Header.
It’s important to note here that Custom Header is not “refreshing” lovelace. If a template in Custom Header is causing issues with your backend then it’s likely you would also have issues with displaying any template sensor, or any entity really, in a default entities card.