Geez, my bad. Thank you.
card-tools
Here’s something for you other plugin developers out there!
It’s kind of my secret cookbook, a bunch of convenient functions packed together and reusable.
I plan to make most of my plugins depend on this over the next few days or so.
Unfortunately, I can no longer edit the first posts of this thread to add plugins to the list, or update descriptions of changed ones.
Does anyone have any thoughts on the best course of action?
I’m thinking perhaps I should start over with a new thread and ask a moderator to add a link in the (now locked) top post to the new one…
Either that, or trying to split the thread again, making one thread for each plugin.
Or perhaps move to an entirely different medium.
What do you think?
Edit: This issue has been resolved
ask a dev to give you the rights to change the first posts.
i know its possible, i saw today that they did it for someone with another project.
I just pushed an update to layout-card that I believe should fix this.
The updated version also requires card-tools to be installed.
I’ve got a problem using card-modder
. I have some cards that have background as part of the card, so I’m not using card-modder
to add a background. The problem I have is that when using border-radius
for a rounder corner card, the background overlays the border and is not trimmed off, so the card still looks like it has square edges.
Any ideas?
I’d have to look at the specific cards to be able to say…
This is what I have.
- id: 5e9c3cb535134b9e9192d8f07bde03d8 # Automatically created id
type: custom:card-modder
card:
type: custom:mini-media-player
entity: media_player.chromecast3206
name: Chromecast
artwork: cover
hide_power: true
hide_volume: true
show_source: false
show_progress: true
scroll_info: true
consider_idle_after: 10
background: "/local/lovelace/devices/chromecast2.jpg"
style:
border-radius: 10px
border: solid 1px rgba(100,100,100,0.3)
box-shadow: 3px 3px rgba(0,0,0,0.4)
and this is what I see. You can see the corners where the rounded border it, but the image overlays it.
and a close-up of another card.
After checking the code, it seems the author of mini-media-player chose to add the background as an image floating on top of the card rather than as an actual card background. Not much that card-modder can do about this, unfortunately…
Hmm. What am I looking for to find where it’s floated? I couldn’t work it out in the code, but may have overlooked it.
Well… it’s not really floating as such… but it’s a separate div https://github.com/kalkih/mini-media-player/blob/master/mini-media-player.js#L177
card-modder tries to style to ha-card
element, and anything that’s on top of it will go unmodified. Setting the background using card-modder instead should work.
Or you could modify the source and add a border radius here too: https://github.com/kalkih/mini-media-player/blob/master/mini-media-player.js#L829-L836
Thanks mate. Not sure about modifying mini-media-player
, I think I’ll contact the developer, but for my own card I made, I edited my CSS file and moved the background image to ha-card {background: url(bkg.jpg);}
and has fixed it up.
Thanks mate.
Oh, thank you very much. You’re my lucky star.
While working on making my cards leverage the many benefits of card-tools, I realized I could add the templating from useful-markdown-card to card-modder…
- type: custom:card-modder
style:
background-image: "url(http://www.place[[ input_select.background.state ]].com/500/250)"
card:
type: entities
entities:
- input_select.background
...
thank you!, that’s what I was looking for hence my feature request enable templates on style ? · Issue #7 · thomasloven/lovelace-card-modder · GitHub
Makes it so much more flexible, cool.
cheers!
Create a light group…
Just because I’m so happy about how well this is working - here’s the results of remaking fold-entity-row to use card-tools:
The source code is now about 30% shorter, has more safety checks, better error messages and a better structure. And at least three known bugs were fixed with almost no extra work.
fold-entity-row card error after update to version: b895b8
Oops. Sorry about that.
I forgot to add the check that card-tools is installed. It should tell you to install it in a more informative error message.
A new update has been pushed to github.
HI Thomas,
would this be the correct way to change background depending on state?
- type: custom:card-modder
style:
#background-image: url("/local/lovelace/images/weather-background-day.png")
background-image: url("/local/lovelace/images/weather-background-[[sun.sun.state]].png")
i have the 2 files
/local/lovelace/images/weather-background-above_horizon.png
/local/lovelace/images/weather-background-below_horizon.png
but the backgrounds don’t show yet. Please have a look?