Excellent job! I’m already using it in my settings and it works great!
Thanks, that is working great!
Is it possible to add a default value for entities other than user as well?
I have a device_tracker with multiple states and would like to switch between state home and default to all other states (away, work, etc).
I try to enlarge the picture, but I can not. Here is my code:
The image is: /local/lovelace/home/xiaomi_vacuum_03.jpg
- id: 9 # Automatically created id
icon: mdi:robot-vacuum-variant
background: center / cover no-repeat url("/local/lovelace/background/back01.jpg") fixed
type: custom:layout-card
layout: horizontal
cards:
- type: custom:card-modder
card:
type: picture-elements
image: /local/lovelace/home/xiaomi_vacuum_03.jpg
elements:
- type: icon
icon: mdi:bell-ring
tap_action: call-service
entity: vacuum.xiaomi_vacuum_cleaner
service: vacuum.locate
style:
top: 93%
left: 80%
color: '#ffffff'
- type: icon
icon: mdi:crosshairs
tap_action: call-service
entity: vacuum.xiaomi_vacuum_cleaner
service: vacuum.clean_spot
style:
top: 93%
left: 65%
color: '#ffffff'
- type: icon
tap_action: call-service
icon: mdi:home
entity: vacuum.xiaomi_vacuum_cleaner
service: vacuum.return_to_base
style:
top: 93%
left: 50%
color: '#ffffff'
- type: icon
icon: mdi:stop
tap_action: call-service
entity: vacuum.xiaomi_vacuum_cleaner
service: vacuum.stop
style:
top: 93%
left: 35%
color: '#ffffff'
- type: icon
icon: mdi:play
tap_action: call-service
entity: vacuum.xiaomi_vacuum_cleaner
service: vacuum.start
style:
top: 93%
left: 20%
color: '#ffffff'
- type: state-label
entity: sensor.vacuum_operation
style:
top: 10%
left: 1%
color: rgb(255, 255, 255)
transform: translate(0%,-50%)
pointer-events: none
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
- type: state-label
entity: sensor.vacuum_accessories
style:
top: 10%
right: 1%
color: rgb(255, 255, 255)
transform: translate(0%,-50%)
pointer-events: none
font-family: Trebuchet MS
font-size: 90%
font-weight: bold
- type: state-label
tap_action: more-info
entity: vacuum.xiaomi_vacuum_cleaner
style:
top: 10%
right: 43%
color: rgb(255, 255, 255)
transform: translate(0%,-50%)
font-family: Trebuchet MS
font-size: 150%
font-weight: bold
- type: state-label
entity: sensor.vacuum_cleanmainbrush
style:
top: 33%
right: 2%
color: '#ffffff'
transform: translate(0%,-50%)
pointer-events: none
font-family: Trebuchet MS
font-size: 76%
font-weight: bold
- type: state-label
entity: sensor.vacuum_cleansidebrush
style:
top: 40%
right: 0%
color: '#ffffff'
transform: translate(0%,-50%)
pointer-events: none
font-family: Trebuchet MS
font-size: 76%
font-weight: bold
- type: state-label
entity: sensor.vacuum_cleanfilter
style:
top: 57%
right: 3%
color: '#ffffff'
transform: translate(0%,-50%)
pointer-events: none
font-family: Trebuchet MS
font-size: 76%
font-weight: bold
opacity: 0.8
- type: state-label
entity: sensor.vacuum_sensordirtyleft
style:
top: 74%
right: 5%
color: '#ffffff'
transform: translate(0%,-50%)
pointer-events: none
font-family: Trebuchet MS
font-size: 76%
font-weight: bold
- type: state-label
entity: sensor.vacuum_status
style:
top: 33%
left: 2%
color: '#ffffff'
transform: translate(0%,-50%)
pointer-events: none
font-family: Trebuchet MS
font-size: 80%
font-weight: bold
- type: state-label
entity: sensor.vacuum_battery
style:
top: 54%
left: -1%
color: '#ffffff'
transform: translate(0%,-50%)
pointer-events: none
font-family: Trebuchet MS
font-size: 80%
font-weight: bold
- type: state-label
entity: sensor.vacuum_fan_speed
style:
top: 65%
left: 1%
color: '#ffffff'
transform: translate(0%,-50%)
pointer-events: none
font-family: Trebuchet MS
font-size: 80%
font-weight: bold
- type: state-label
entity: sensor.vacuum_cleaned_area
prefix: "Area:"
style:
top: 25%
left: 26%
color: '#ffffff'
transform: translate(0%,-50%)
pointer-events: none
font-family: Trebuchet MS
font-size: 80%
font-weight: bold
- type: state-label
entity: sensor.vacuum_cleaning_time
prefix: "Time:"
style:
top: 25%
left: 60%
color: '#ffffff'
transform: translate(0%,-50%)
pointer-events: none
font-family: Trebuchet MS
font-size: 80%
font-weight: bold
style:
border-radius: 15px
border: solid 1px rgba(100,100,100,0.3)
box-shadow: 3px 3px rgba(0,0,0,0.4)
- type: custom:layout-card
layout: horizontal
cards:
- type: custom:card-modder
card:
type: glance
entities:
- entity: input_boolean.disable_dustbin_notification
name: Disable Notification
- entity: input_boolean.disable_daily_vacuum
name: Disable Daily Cleanup
style:
background-image: url("/local/lovelace/background/cardbackK.png")
background-repeat: no-repeat
background-color: rgba(50,50,50,0.3)
background-size: 100% 150px
border-radius: 15px
border: solid 1px rgba(100,100,100,0.3)
box-shadow: 3px 3px rgba(0,0,0,0.4)
- type: custom:card-modder
card:
type: entities
entities:
- input_select.vacuum_room
style:
background-image: url("/local/lovelace/background/cardbackK.png")
background-repeat: no-repeat
background-color: rgba(50,50,50,0.3)
background-size: 100% 150px
border-radius: 15px
border: solid 1px rgba(100,100,100,0.3)
box-shadow: 3px 3px rgba(0,0,0,0.4)Try it and see what happens.
Spoiler alert: It works.
I did try it and it didn’t work.
Will try again to see what went wrong 
Edit
Just tried some settings but can’t get it to work. Any hints are appreciated.
This is my ui-lovelace
- type: vertical-stack
cards:
- type: custom:state-switch
entity: device_tracker.gerard
default: default
states:
home:
type: vertical-stack
cards:
- [cards here]
default:
type: vertical-stack
cards:
- [cards here]
Love the new rework of slider-entity-row and the new state-switch card.
Would love to see them in core HA in the future.
Thanks for sharing!
Is there a way to get icons to render in your markdown card? I’m doing a super condensed view and would love to not have labels for the rows.
Oh darn! You’re right. Sorry about that.
Should be fixed now.
Yes it works now 
thanks!
Afraid not, but I think you can include pictures.
1 Like
I’ve heard some people have had problems with some of my cards and the custom_updater.
If you have a problem and are using the fold-entity-row, make sure it’s entered correctly in your resources section. I renamed the card a while ago from folding-group-entity-row.js to fold-entity-row.js.
So, if your resources section says folding-group-entity-row.js try changing it to fold-entity-row.js and also rename the file. Then press update.
1 Like
To give a bit of history I started off with two glance card b/c I wanted to see how the temperature and humidity was trending around the house, as we have a young baby and want to keep it more comfortable.
The problem with the glace cards is they take up a lot of space and I don’t care for the duplication of icons (wasted screen realestate IMHO).
So, I switched to the mark-down card to just make a simple table.
- type: custom:useful-markdown-card
content: >
| | DS | Outside | 2nd | 1st | Base |
| -----|---------|------|-----|-----|-----|
| 
| [[weather.dark_sky.attributes.temperature]][[sensor.weather_temperature.attributes.unit_of_measurement]]
| [[sensor.weather_temperature.state]][[sensor.weather_temperature.attributes.unit_of_measurement]]
| [[sensor.ms2_temp_sensor_63.state]][[sensor.weather_temperature.attributes.unit_of_measurement]]
| [[sensor.house_thermostat_temperature.state]][[sensor.weather_temperature.attributes.unit_of_measurement]]
| [[sensor.ms1_temp_sensor_54.state]][[sensor.weather_temperature.attributes.unit_of_measurement]]
|
| 
| [[weather.dark_sky.attributes.humidity]][[sensor.weather_humidity.attributes.unit_of_measurement]]
| [[sensor.weather_humidity.state]][[sensor.weather_humidity.attributes.unit_of_measurement]]
| [[sensor.ms2_humidity_sensor_65.state]][[sensor.weather_humidity.attributes.unit_of_measurement]]
| [[sensor.house_thermostat_humidity.state]][[sensor.weather_humidity.attributes.unit_of_measurement]]
| [[sensor.ms1_humidity_sensor_56.state]][[sensor.weather_humidity.attributes.unit_of_measurement]]
|
The current problem is that the mark-down card must report as some giant size and the column ordering of the default algorithm doesn’t look nice. But I continue to use it as it handles the switch between mobile to desktop better.
Also DS is Darksky and Outside is the sun.sun temperature. I find that DS is more accurate for my location for whatever reason.
Where I finally landed was making a single view using layout-card with 4 columns and the mini-graph. So this is only good for tablet and up, which is sufficient for my needs. And mobile I can use the mark-down version.
Sorry for the 110% answer.
1 Like
@thomasloven First of all thanks for you plugins, I’m using a few of them already.
There’s something I can’t get to work and as far as I can see in this Github issue it should work or I misunderstood that issue. What I’m trying to do is have a slider-entity-row for a light group.
This is my config:
- type: section
label: Entrance
- type: custom:slider-entity-row
entity: group.entrance
- type: custom:slider-entity-row
entity: light.entrance_1
- type: custom:slider-entity-row
entity: light.entrance_2
- type: custom:slider-entity-row
entity: light.entrance_3
However this doesn’t work, since I’m getting an ‘Unsupported entity domain: group’ error. Just double checking here… is this supposed to work? Did you mean that in that Github issue?
If I can get a light group to show up with a slider, I would actually love to use it as a ‘head’ for a fold-entity-row, so that I can place the 3 lights that make up the group as items folded under it. If the above is possible… am I able to do this as well?
I tried to use fold-entity-row and I can have the light group as the head of the folded group and the lights underneath, but again there is no slider for the group in the head.
can someone help please?
Yeah, that’s what I tried. This was the config that I used:
- type: section
label: Entrance
- type: custom:fold-entity-row
head:
type: custom:slider-entity-row
entity: group.entrance
group_config:
type: custom:slider-entity-row
secondary_info: last-changed
And this is the result:
As you can see… it does create a folded group with the individual lights hidden away. I can’t however make the group show up as a slider as well. It does work when it doesn’t use slider-entity-row, but than it shows only a toggle and I want to control the entire group with a single slider (like you would normally do in the more-info dialog).
card-modder can be used to change what size a card reports to the layout functions.
- type custom:card-modder
report_size: 1
card:
type: markdown
... etc
The default behavior of the markdown card is to report about 50 pixels per line of code in its definition, which I guess are a lot in your case…
1 Like
Thanks! Do you have the code for the markdown card?