Huh, guess I missed that. I use YAML so I can use the code like in the docs. Thanks!
dont think I see it, where is the jinja variable āuser
ā in that specific link?
Ctrl/Command+F: we can also make the clock conditional to a specific user
was that an answer to my question Kendell?, cause we seem to be miscommunicationā¦ I asked where we can use the user variable in the jinja templates, like you said above. Seems not to be possible.
You can use the user
template pretty much everywhere, except in the template testing part from what I could tell
that would be frontend (hence only in markdown and custom cards supporting jinja) then, not backend template maybe?
I tried often to use the {{user}} variable as template. Doesnāt work.
Now, I use that in a markdown card which seem to be the only location, where it works.
I forgot to add it in the WTH thread as request.
I can not understand, why only in markdown.
How is this related to card-mod themeing? It works in card-mod theming and thatās all that matters right?
Please donāt advertise. If you want your feature request for the frontend to be heard, anyway it should be here:
https://github.com/home-assistant/frontend/discussions/new
sorry for that - and thanks for the link - i have just done.
Any idea how to replicate Custom Headers fit_tabs
feature?
I would like the tabs to be evenly spaced and not left-justified.
My CSS skills are failing meā¦
This wonāt work because itās based on a flex
layout. Try using flex
properties for it.
Does anyone know how to get the titles next to the icons in the header tabs?
Used to do this with the following in custom_header:
tab_icons_and_text: true
Thanks
You can use a ::before
for each one manually set.
Requesting some help from the community. I am trying to change the color of the selected tab bar based on the status of water leak sensors or smoke detectors. Tried to do so with the following:
card-mod-theme: "my_dark_theme"
header-height: 48px
card-mod-root-yaml: |
.: |
ha-tabs {
{% if is_state(binary_sensor.all_leak_sensors_group, 'on') or +
is_state(sensor.main_garage_protect_smoke_co2_group, 'Emergency') or +
is_state(sensor.ecolink_firefighter_smoke_co2_group, 'Emergency') %}
--paper-tabs-selection-bar-color: var(--leak_detected_color) !important;
{% elif is_state(sensor.main_garage_protect_smoke_co2_group, 'Warning') %}
--paper-tabs-selection-bar-color: var(--lux_hi) !important;
{% else %}
--paper-tabs-selection-bar-color: var(--accent) !important;
{% endif %}
}
paper-tab[aria-selected=true] {
color: var(--accent) !important;
}
Selected tab icon color successfully sets to āāaccentā color but the selected tab bar stays at default white color. Is it even possible to do this?
Any inputs and/or suggestions are highly appreciated.
Are you sure you set those colors in your theme? Iām pretty sure you canāt use underscores in CSS.
Yep, the colors are set in the theme.
Same {% if ā¦ elif ā¦ else ā¦ endif %} construct and variables were being used in custom header, and working. The fact that earlier construct was in lovelace.yaml while this one is part of theme definition, could this be causing an issue? Is it ok to refer to sensor state in theme.yaml?
Thanks for your help, Kendell.
I have 2 questions to @KTibow
Is it possible to have compact header
aligned to the center?
As I do not have activated Almond and the mic icon is still there is there any other way how to disable it?
Edit:
Already managed the mic disappeared
Kendell, checked whether use of underscores in theme color names was causing issues. Used the following simple construct to test it, and it worked successfully. The selected tab bar color was set to --leak_detected_color
.
Any suggestions to further narrow down the problem?
card-mod-theme: "my_dark_theme"
header-height: 48px
card-mod-root-yaml: |
.: |
ha-tabs {
--paper-tabs-selection-bar-color: var(--leak_detected_color) !important;
}
paper-tab[aria-selected=true] {
color: var(--accent) !important;
}