big thanks to @aFFekopp, now my UI looks way more intuitive.
Before:
After:
4 Likes
nice! took you a month 
how do you show multiple values in a row? (internet card, and the 3 radiator lines) would you be willing to share the configs for these?
could be a nice replacement for the extra badges I have been missing from custom-ui since ages…
This is the multiple-entity-row card: https://github.com/benct/lovelace-multiple-entity-row
Attached the config (the style applied is for the three dots that match the graph colors):
- type: entities
style:
.: |
ha-card {
border: solid 1px var(--border-color);
font-family: Raleway;
}
"#states div":
"multiple-entity-row":
$: |
div:nth-of-type(2) span::before {
content: '';
display: inline-block;
width: 10px;
height: 10px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
background-color: #57a0ee;
margin-right: 5px;
}
div:nth-of-type(3) span::before {
content: '';
display: inline-block;
width: 10px;
height: 10px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
background-color: #00b59d;
margin-right: 5px;
}
div:nth-of-type(4) span::before {
content: '';
display: inline-block;
width: 10px;
height: 10px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
background-color: #ffa700;
margin-right: 5px;
}
entities:
- entity: sensor.speedtest_ping_int
name: 1&1
icon: mdi:speedometer
hide_state: true
type: custom:multiple-entity-row
primary:
entity: sensor.speedtest_download_int
name: 'Download'
unit: 'm/s'
secondary:
entity: sensor.speedtest_upload_int
name: 'Upload'
unit: 'm/s'
tertiary:
entity: sensor.speedtest_ping_int
name: 'Ping'
2 Likes
thanks, very welcome card indeed! nice config also 
1 Like
Do you mean the badges that were at the top? If yes this is still possible with lovelace.
no, I meant the extra_badge setup made possible by custom-ui, and of which I had a full setup…like here: Lights: no more color_temp and rgb_color together? or Multiple extra_badges in custom_ui?
Andrey added that in the mentioned future release and it gave us great options, which Lovelace has taken out again…
this multiple-entity-row re-instates that to some degree, so happy here!
Ah I see yeah kinda looks cool haha. Wouldn’t it be possible to create one with a lovelace template card? (There are quite a few on HACS). Never tried one though.
well, no more need… this is what the mentioned GitHub - benct/lovelace-multiple-entity-row: Show multiple entity states and attributes on entity rows in Home Assistant's Lovelace UI does now!
Ah alright 
Wow your UI is awesome, really nice work 
!!!
Can’t wait for u to post your config, especially for the dark themed version. 
1 Like
Much like @Tobi0892 - @aFFekopp’s Theme has inspired me to make a few changes to my lovelace
My Config is on GitHub:
5 Likes
Continuing the discussion from Share your Lovelace Projects (specifically ios/android versions):
Maybe you can share your theme through HACS. That way we all can easily track changes on the theme and update with a single click of a button
I have created a github for my theme, although I don’t think my theme is anything special (lots of similar themes available)
I have also created a pull request for it to be added to hacs (I hope pretty new to this github stuff)
2 Likes
Hello everyone! 
@Vasco, @NotYourAverageAl and @Xan83
I have finally finished my Github!
I’ve also started a thread here:
Thanks! 
and Happy 2020!! 
1 Like
Hey @N-I1, your theme looks great!
How did you make your icons look like plain images?
I tried to apply some styling on mine, replacing icon: with image: or entity_picture in customize.yaml, but it keeps on applying an awful border radius I can’t seem to remove.
Thanks @pedrovsky!
Hum… I used entity_picture as well. Maybe your icons are too big. Try shrinking them down or maybe use the icons on icons8.com (the ones I used) 
@N-l1 this set up is amazing, and i’m sorry but I copied the whole thing and replaced my entire previous set up with yours
I do wonder if you can help me with 1 thing:
I am trying to make the text “Lights” and the text below clickable, so that will navigate me to the lights page, and at the same time the icon itself would function as a switch to toggle all lights.
Now I have tried multiple settings, but I am unable to make it work.
The closest I came was by using a button card, however I seem to be unable to switch the text alignment to the left, as a button standard centers it.
Do you have any ideas on how to keep the same look and feel, but make the text part clickable/navigable while maintaining a different tap function for the icon.
Thanks @Heijt771!
I don’t think tap action is possible with the markdown card.
You could potentially replace the markdown card with a button card, but that would just be really hard to configure. I think the best idea is to use the tap action on the big icon button to toggle your lights and use the hold action to navigate to your lights page.
We also have a dedicated thread here 
hi @jimz011
Looking at this dogpage…
How did you do the bottom?
“Dierenarts” part?
it links to phone? and whats the website for?
How do you link phonenumber?
I am looking for this of sort integraton for a long time but to use as Medicine automations. Can you please share your code or which integration is that?
I need to have a button on hass, when you pressed it it should be register that and then show the information when it was. Just under that information i need a “enable switch” and also an another option set “after hours xxx reminder” (which you can give after how many time you will be reminded )