Yes I will update with a fix.
Updated to fix the not readable dark texts. You will need at least home assistant 0.103 for this.
Perfect, thanks for all your work!
Hey @naofireblade, in the latest version I noticed that the badge text had become a bit hard to read:
Because I figured I’ve been bothering you too much already I tried to mod it myself, and ended up adding this to your theme:
label-badge-text-color: 'var(--primary-text-color)'
Which made it much more readable, though perhaps a bit too bright:
It’ll do though, thought I’d let you know.
Hi,
I get the following on screen after installing the Home Assistant version 0.107.1 for the new media cards (redesigned in this new version)
When I revert to the default theme, we see:
Regards,
I will look into this in the next few days.
I also have the same issue with media control cards being way too light. On the iOS app, the very top status bar is the same color.
Any ideas which theme elements control these colors?
I found that both the media control card and iOS status bar can be changed with ‘primary-color’ but obviously that changes a ton of others also.
Hello. Excuse the question. I bet it might sound dumb to you guys but. When you say: Save the background image to home-assistant/www/night.jpg
where is that location?
Hey Ellery,
its the ‘www’ folder inside your config folder.
In other words: In the folder with your yaml files is a subfolder named ‘www’. If not, just create a new folder and rename it as ‘www’.
Alright! Thank you so much. All this is new to me. Really cool and useful but I have a lot to learn. . Thank you so much for replying.
Thats not fixable at the moment, because the media-control card uses the primary color as background-color: https://github.com/home-assistant/frontend/blob/7c6ba1a78299df4114b0161c940c9dd1a9c1e8bd/src/panels/lovelace/cards/hui-media-control-card.ts#L782
Thanks! Fixed in newest version
That needs to be fixed in the mobile app. The app currently does not use the new variable app-header-background-color to determine the status bar color.
Thanks for the very nice theme!
Who may assist - I would like to have the icons on the picture-elements card blink when activated.
This is my ui-lavelace.yaml:
- entity: switch.testswitch2
type: state-icon
icon: 'mdi:window-closed'
tap_action:
action: more-info
style: |
@keyframes blink {
50% {
:host {
--primary-color: red;
}
}
}
ha-card {
animation: {% if is_state('switch.testswitch2', 'on') %} blink 1.5s steps(1) infinite {% endif %};
}
Unfortunately the icon won’t change its color.
layout-card, card-mod and custom-header are installed and working.
Any hints?
I’m having the same issue, but I’m more annoyed by the lack of Media Controls I was used to having before. I recall being able to control the volume and other things without having to press the three dots up right.
I have tried uninstalling the theme and other related components to no avail.
These are two different problems you are experiencing. #1 is the problem evb
mentioned, the other one, #2 is with the media controls. This is something you should check at the documentation or the corresponding thread for the media-control card.
or you could try this custom_card:
Afternoon All,
I’m trying to figure out why a specific colour is being used for certain icons when using this theme. As far as I can tell this colour isn’t called for in the theme. I can’t find it in the clear-dark.yaml, but I can find it in the custom:mini-graph-card-bundle.js, and I am using this card nested in this vertical stack. Is that somehow influencing the theme?
cards:
- cards:
- entity: scene.q7jxkjtkcfji1nw4
icon: 'mdi:radiator'
name: Heat
state_color: true
tap_action:
action: call-service
service: ifttt.trigger
service_data:
event: ds_split_heat
type: 'custom:button-card'
- entity: scene.0bur1u8q55wflghv
icon: 'mdi:snowflake'
name: Cool
state_color: true
tap_action:
action: call-service
service: ifttt.trigger
service_data:
event: ds_split_cool
type: 'custom:button-card'
- entity: scene.7dmi62dwiietujdn
icon: 'mdi:fan'
name: Fan
state_color: true
tap_action:
action: call-service
service: ifttt.trigger
service_data:
event: ds_split_fan
type: 'custom:button-card'
- entity: scene.ostredmlwuzldksy
icon: 'mdi:toggle-switch-off'
name: 'Off'
state_color: true
tap_action:
action: call-service
service: ifttt.trigger
service_data:
event: ds_split_off
type: 'custom:button-card'
type: horizontal-stack
- color_thresholds:
- color: '#5989fe'
value: 12
- color: '#59a9fe'
value: 14
- color: '#59ddfe'
value: 16
- color: '#59fee0'
value: 18
- color: '#59feb3'
value: 20
- color: '#59fe7c'
value: 22
- color: '#6Dfe59'
value: 24
- color: '#9dfe59'
value: 26
- color: '#cffe59'
value: 28
- color: '#cffe59'
value: 30
- color: '#fec059'
value: 32
- color: '#fe8b59'
value: 34
- color: '#fe5959'
value: 36
entities:
- sensor.downstairs_temp
hours_to_show: 24
icon: 'mdi:thermometer'
line_width: 2
name: 24 Hours
points_per_hour: 1
show:
extrema: true
fill: false
icon: true
icon_adaptive_color: true
labels: false
labels_secondary: false
name: true
points: true
smoothing: true
type: 'custom:mini-graph-card'
- cards:
- entity: sensor.downstairs_humidity
name: Humidity
type: entity
- entity: sensor.downstairs_battery
name: Sensor Life
type: entity
type: horizontal-stack
title: Downstairs
type: vertical-stack