The toggles are fixed.
I also added back the hide_when_off option, but - serious question - can anyone tell me why you’d want that? Do you only want to be able to adjust brightness, and to turn it off? Never on again? Never on directly to a defined value?
Well, it turns on with the last set value and then i can adjust it.
I like the slider hidden when it’s off.
THANKS for it and fixing the toggles.
For me I have quite a few lights that I rarely control manually, they’re timed to come on and go off.
But when they are on I like to see the brightness level/percent (make sure they’re working as they should). Also, hiding the sliders when they’re off looks cleaner, and doesn’t take up as much space.
I rarely use the sliders, which is why I enquired about just showing the brightness value/percentage below the lights previously 
I really like the layout card. Is there a way I can make it different for the mobile response point. The 5 columns I want is for tablet-desktop. It would be nice to do more for wide screen.
Thanks
I use that because it’s easy to accidentally move the slider when swiping on the phone. If the light is on that doesn’t matter as much but if it’s off it might be worse to turn it on by accident. If I want to turn a light on to a certain brightness when off I just bring up the more info dialog.
I like the conditional card and its ability to dynamically change the interface a bit, but if you want to switch between two different cards, you need to add two conditional cards… And if you want even more it quickly grows.
So I made state-switch which allows you to switch in a card based on a dictionary of entity states.
- type: custom:state-switch
entity: device_tracker.my_phone
states:
home:
[definition of one card]
work:
[definition of another card]
not_home:
[and yet another]
While I use this in my own configuration, I almost decided against releasing it publicly beacuse the same thing can also be done with conditional… but then I realized something… I could easily make it switch depending on user name instead.
- type: custom:state-switch
entity: user
default: all_other
states:
admin:
type: entity-button
entity: switch.self_destruct
all_other:
type: markdown
content: >
## You're not supposed to be here!
Wonderful to not have to have a thousand conditional to get different cards to show up! And also the user bit… Lovely!
Hi @thomasloven,
Thanks very much for what you’re doing, state-switch rocks !
A couple of questions:
Cheers 
Making it work with views would be much harder, but I guess official support for that isn’t far away.
The words “on” and “off” have special meaning in yaml. Try using quotes
"on":
...
"off":
...
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.
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.
