Looks great!!
Whats your config for the colors of the mini graph card?
Sure, just adjust the temperature tresholds to your liking:
type: horizontal-stack
cards:
- type: 'custom:mini-graph-card'
align_header: left
align_icon: left
animate: true
color_thresholds:
- color: '#00a1ff'
value: 0
- color: '#abe673'
value: 21
- color: '#fe9c67'
value: 23.5
- color: '#e0614c'
value: 24.5
entities:
- sensor.temperature_livingroom
hour24: true
name: Wohnen
points_per_hour: 0.5
show:
fill: false
- type: 'custom:mini-graph-card'
align_header: left
align_icon: left
animate: true
color_thresholds:
- color: '#00a1ff'
value: 0
- color: '#abe673'
value: 19.6
- color: '#fe9c67'
value: 21
- color: '#e0614c'
value: 21.5
entities:
- sensor.temperature_158d0001b7edda
hour24: true
name: Schlafen
points_per_hour: 0.5
show:
fill: false
Beautiful theme, thanks for sharing!
Thank you for this! I use it as a good base to try to simulate the dribble screenshot your theme is loosely inspired by. Whenever I’m ready I’ll post a screenshot.
Meanwhile, I have a couple of questions:
- The shadows on my cards are much more visible. How did you manage to make them more subtle? Or is one of the custom components responsible for this?
- In what cards did you use the button card exactly?
The last section in my theme controls the shadows by making them very subtle for elevation-2dp and copies that style to all elevations but 16dp.
I found 3 limits when trying to replicate the dribble screenshot:
- the card title color can not be set (just for custom cards…)
- cards cannot be made larger (I played with panel mode and layout-card: https://github.com/thomasloven/lovelace-layout-card but was not happy with the results)
- the header background color is also the color for links and section labels on cards (primary-color), therefore I had to used grey instead of white, but that looks not bad I think
.
Strange, because I used your styles, but still have more shadow…
Header background: indeed, not easy, but… let me just tease you 
That looks nice! I might steal your harmony card 
Header background in white is possible, but I guess you won’t see links and section titles now.
I just saw that the shadow rules do not work after update to version 0.88 
.
Nice work. Kinda doesn’t have the same fresh feel as the light version, but will be much better on my eyes, especially at night.
I’ll install it later and see how it goes. Can’t wait to try!!
Yes it CAN be done, but it’s a hack:
I added this one to my lovelace config:
resources:
- type: css
url: /local/styles.css?v=0.1
(the version is in case I update the css)
Then I created styles.css in local, and with this as content:
body {
--primary-color: white !important;
}
(It was after an evening of trial and error and bits of information here and there on the web)
About the Harmony card: thanks! It changes with the activity, so when the radio plays: this f.i. is shown:
… but I might just dump the cards with photos after all, to have a cleaner look…
@Nitram that looks great! What font are you using for your Automatisering card? I’ve managed to import Open Sans but I’m finding that line spacing is occasionally an issue
“Canary” (alarm) and some other standard cards seem to not care about custom fonts, I have to look into that…
Can you add a weblink or a section to an entities card and check if it’s readable?
You could use a markdown card, and a vertical or horizontal stack card, not sure if you can get closer to that than this. What do you want to do with it?
You can switch them with an automation after sunset. I just found no way to switch the background with an automation yet.
Is this how you managed to change the font globally as well?
I have the problem that these parts are all in primary-color, therefore I cannot set the primary-color to the same color as the card background without loosing the ability to use weblinks / section titles:
Yes, by adding this to the resources in the Lovelace config, it also changed the font on other places:
resources:
- type: css
url: 'https://fonts.googleapis.com/css?family=Raleway'
1 Like