Forgive me my novice question. Is it possible with card-mod to completely hide the sidebar? Iām trying to substitute the CH somehow. There is a div named "contentContainer"
outside <partial-panel-resolver>
which should be hidden.
Custom Header doesnāt do anything with sidebars. It might be possible if you know more about :host
than me.
I think top
should be changed to bottom
I feel so stupid. I tried that a while ago, figured use logic. But that didnāt work. Now I tried it again and had the genious idea to actually put the card on the bottom in lovelace as well (tried before with the one at the top )
Works! This is great, opens up lots of possibilities :)!
edit: @KTibow is it possible to force the card to be at the bottom of the display (perhaps something with 100vh). Right now, itās at the bottom, but then the lovelace view has few items, the card is the final card, but is not at the bottom of the screen. I try to sticky it at the bottom of the display.
I would love to have something like that. I am using a couple of icons with popup card connected to them for things I always want to have in sight.
This is my current layout wit CH:
My CSS skills are lacking, so I Googled a bit. So it turns out this is the standard behaviour of sticky items: https://css-tricks.com/couple-takes-sticky-footer/
However, there are ways to go around this by using flexbox. See this: https://stackoverflow.com/questions/4575826/how-to-push-a-footer-to-the-bottom-of-page-when-content-is-short-or-missing
I copied some code mentioned there and applied it, but that didnāt work. I think other things need to be set up first in order for the css code to work. I have no idea if this is even supported with card mod.
@thomasloven care to chime in your thoughts/experience on this, if you have the time?
In trying to put a border around a badge-card, I think Iāve lost my mind.
I see that if I open the editor and add
border: solid 1px #DEDEDE;
to #badges, I get the desired effect. So, I am trying to inject this code where the red line is in the picture below.
- type: custom:badge-card
badges:
-entity....
style:
$: |
"#badges div":
#badges {
border: solid 1px #DEDEDE;
}
Iām lost. Thanks for any help.
Badge-card doesnāt have a ha-card element, and thus canāt be styled without mod-card.
Thank you for the reply and the awesome tools you provide. Iāll try using mod-card.
Can anyone tell me why the black color of the icon is displayed in lovelance?
Looks like the template isnāt evaluating, I think you need to put quotes around the entityās name:
states(sensor.heating_activated)
states('sensor.heating_activated'
)
When in doubt, check the template section of HA dev tools.
The side bar can also be disabled in the user settings / profile. No need for card mod.
Thanks for the suggestion.
I am trying the following configuration but the icon is always yellow (active), even though the condition is not met. Do I have invalid syntax?
- entity: sensor.heating_activated
style: |
:host {
--paper-item-icon-color:
{% if states(config.entity) , 'on' %}
var(--state-icon-active-color)
{% else %}
var(--state-icon-color)
{% endif %}
;
}
{% if states(āconfig.entityā, āonā) %}
Iāve tried it before too, but in this form I have a black icon
Check the state in dev-tools when it in on. It is case sensitive. Might be On not on. Also check what happens in the template editor using the real entity.
{% if states(āconfig.entityā) == āonā %}
Change states
to is_state
Yeah either will workā¦