Nitram
(Martin Vereecken)
February 22, 2019, 10:46am
21
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:
Nitram
(Martin Vereecken)
February 22, 2019, 10:47am
22
… but I might just dump the cards with photos after all, to have a cleaner look…
ajoyce
(Al)
February 22, 2019, 10:53am
23
@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
Nitram
(Martin Vereecken)
February 22, 2019, 10:55am
24
1 Like
Nitram
(Martin Vereecken)
February 22, 2019, 10:56am
25
“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?
Nitram
(Martin Vereecken)
February 22, 2019, 11:07am
27
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.
ajoyce
(Al)
February 22, 2019, 11:10am
29
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:
Nitram
(Martin Vereecken)
February 22, 2019, 11:54am
31
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
Nitram
(Martin Vereecken)
February 22, 2019, 12:03pm
32
Ok, sorry, I misunderstood the question!
Tried a link in a card, and it’s also white and unreadable. It looks like a challenge
ajoyce
(Al)
February 22, 2019, 12:14pm
33
OK, I’m not quite getting the same result as you -
Note on the left menu, my text is still coming up in Roboto whilst yours appears in Raleway.
Have tried a few methods - in Lovelace:
- url: /local/styles.css?v=0.05
type: css
- url: 'https://fonts.googleapis.com/css?family=Raleway'
type: css
And in /config/www/styles.css:
@import url('https://fonts.googleapis.com/css?family=Raleway');
body {
font-family: Raleway !important;
}
paper-icon-item span {
font-family: Raleway !important;
}
Plus deleting caches and refreshing etc - there’s some elements that always seem to be overridden, not sure how to get past that…
Nitram
(Martin Vereecken)
February 22, 2019, 12:25pm
34
I don’t think the styles.css has any value here. The only thing I did, was adding the resource to Lovelace and changed the font there. But maybe you didn’t set it everywhere in the theme, like this?
primary-font-family: 'Raleway,sans-serif'
paper-font-common-base_-_font-family: "var(--primary-font-family)"
paper-font-common-code_-_font-family: "var(--primary-font-family)"
paper-font-body1_-_font-family: "var(--primary-font-family)"
paper-font-subhead_-_font-family: "var(--primary-font-family)"
paper-font-headline_-_font-family: "var(--primary-font-family)"
paper-font-caption_-_font-family: "var(--primary-font-family)"
paper-font-title_-_font-family: "var(--primary-font-family)"
Nitram
(Martin Vereecken)
February 22, 2019, 12:25pm
35
Btw, nice work. Some good ideas here, like the Recycle Bin days!
ajoyce
(Al)
February 22, 2019, 12:41pm
36
Thanks! It was a battle to get that working because my council has no API and the results are all generated in-line by javascript - see here: https://community.home-assistant.io/t/bash-scripting-torquay-refuse-collection-sensor/100376/2
I also have a dark theme but it’s not quite as refined as @naofireblade ’s:
I totally forgot to add the fonts to my theme in config.yaml though, will give that a go now! Thanks!
Thank you!
Can you also share your config for your presence card at the top right?
That one also has a button to open a text field where I can enter a reminder for a person and this person get’s a notification as soon has she comes home.
You first have to set up a device tracker for each person: https://www.home-assistant.io/components/device_tracker/
After that you can include the card.
The Card
type: horizontal-stack
title: Familie
cards:
- type: glance
columns: 2
entities:
- device_tracker.iphone_user1
- input_text.reminder_user1
show_name: false
- type: glance
columns: 2
entities:
- device_tracker.iphone_user2
- input_text.reminder_user2
show_name: false
Configuration for Input Field
input_text:
reminder_user1:
name: "Reminder"
reminder_user2:
name: "Reminder"
Automation for Reminder
- alias: Reminder for User 1
trigger:
- platform: state
entity_id: device_tracker.iphone_user1
to: home
condition: []
action:
- service: notify.ios_iphone_user1
data:
title: Reminder
message: "{{ states.input_text.reminder_user1.state }}"
- service: input_text.set_value
data_template:
entity_id: input_text.reminder_user1
value: ''
- alias: Reminder for User 2
trigger:
- platform: state
entity_id: device_tracker.iphone_user2
to: home
condition: []
action:
- service: notify.ios_iphone_user2
data:
title: Reminder
message: "{{ states.input_text.reminder_user2.state }}"
- service: input_text.set_value
data_template:
entity_id: input_text.reminder_user2
value: ''
2 Likes
kophinos
(kophinos)
February 25, 2019, 2:32am
40
Is there another way to call the background image into Lovelace? I use an automation to select my theme based on day/night mode and I want to be able to automagically switch between clear light and clear dark with their associated backgrounds. If I put “background: center / cover no-repeat url(”/local/background.jpeg") fixed" into the Lovelace config it will apply to ALL themes.