Unfortunately no answer. But finally I have found a solution by myself.
type: custom:mod-card
style:
hui-vertical-stack-card$: |
.card-header {
font-size: 18px !important;
margin-top: -20px !important;
margin-bottom: -15px !important;
margin-left: -10px !important;
}
card:
type: vertical-stack
title: Scene
cards:
- type: horizontal-stack
cards:
- type: custom:button-card
entity: switch.sonoff_1000a09dd3
name: Lamps
size: 40%
state:
- value: 'on'
color: rgb(223, 218, 0)
icon: mdi:lamps
styles:
card:
- background-color: ivory
- box-shadow: 0px 0px 20px 2px rgb(240, 194, 9)
- value: 'off'
icon: mdi:lamps-outline
styles:
card:
- height: 80px
- border-radius: 10%
- padding: 10%
- font-size: 10px
- type: custom:button-card
entity: switch.sonoff_1000a09295
name: TV light
size: 40%
state:
- value: 'on'
color: rgb(223, 218, 0)
icon: mdi:television
styles:
card:
- background-color: ivory
- box-shadow: 0px 0px 20px 2px rgb(240, 194, 9)
- value: 'off'
icon: mdi:television-off
styles:
card:
- height: 80px
- border-radius: 10%
- padding: 10%
- font-size: 10px
- type: custom:button-card
entity: switch.sonoff_1000a088ef
name: Garden lights
size: 40%
state:
- value: 'on'
color: rgb(223, 218, 0)
icon: mdi:alarm-light-outline
styles:
card:
- background-color: ivory
- box-shadow: 0px 0px 20px 2px rgb(240, 194, 9)
- value: 'off'
icon: mdi:alarm-light-off-outline
styles:
card:
- height: 80px
- border-radius: 10%
- padding: 10%
- font-size: 10px
- type: custom:button-card
entity: switch.sonoff_10011887bc
name: Kitchen lights
size: 40%
state:
- value: 'on'
color: rgb(223, 218, 0)
icon: mdi:track-light
styles:
card:
- background-color: ivory
- box-shadow: 0px 0px 20px 2px rgb(240, 194, 9)
- value: 'off'
icon: mdi:track-light-off
styles:
card:
- height: 80px
- border-radius: 10%
- padding: 10%
- font-size: 10px
- type: horizontal-stack
cards:
- type: custom:button-card
name: Gate
entity: binary_sensor.garage_door_opening_detector_device_36
color: rgb(64, 114, 164)
size: 40%
state:
- value: 'on'
color: rgb(255, 124, 128)
icon: mdi:gate-open
styles:
card:
- background-color: lightpink
- box-shadow: 0px 0px 20px 2px rgb(255, 124, 128)
- value: 'off'
icon: mdi:gate
tap_action:
action: call-service
service: script.toggle
service_data:
entity_id: script.brana_otevrit_zavrit
styles:
card:
- '--mdc-ripple-color': green
- '--mdc-ripple-press-opacity': 0.7
- height: 80px
- border-radius: 10%
- padding: 10%
- font-size: 10px
- type: custom:button-card
name: Gate entrance
icon: mdi:gate-arrow-right
color: rgb(64, 114, 164)
size: 40%
tap_action:
action: call-service
service: script.toggle
service_data:
entity_id: script.brana_pruchod
styles:
card:
- '--mdc-ripple-color': green
- '--mdc-ripple-press-opacity': 0.7
- height: 80px
- border-radius: 10%
- padding: 10%
- font-size: 10px
- type: custom:button-card
name: Garage door (W)
entity: binary_sensor.garage_door_opening_detector_device_9
color: rgb(64, 114, 164)
size: 40%
state:
- value: 'on'
color: rgb(255, 124, 128)
icon: mdi:garage-open-variant
styles:
card:
- background-color: lightpink
- box-shadow: 0px 0px 20px 2px rgb(255, 124, 128)
- value: 'off'
icon: mdi:garage-variant
tap_action:
action: call-service
service: script.toggle
service_data:
entity_id: script.vrata_zapad_otevrit_zavrit_2
styles:
card:
- '--mdc-ripple-color': green
- '--mdc-ripple-press-opacity': 0.7
- height: 80px
- border-radius: 10%
- padding: 10%
- font-size: 10px
- type: custom:button-card
name: Garage door (E)
entity: binary_sensor.garage_door_opening_detector_device_8
color: rgb(64, 114, 164)
size: 40%
state:
- value: 'on'
color: rgb(255, 124, 128)
icon: mdi:garage-open-variant
styles:
card:
- background-color: lightpink
- box-shadow: 0px 0px 20px 2px rgb(255, 124, 128)
- value: 'off'
icon: mdi:garage-variant
tap_action:
action: call-service
service: script.toggle
service_data:
entity_id: script.vrata_zapad_otevrit_zavrit
styles:
card:
- '--mdc-ripple-color': green
- '--mdc-ripple-press-opacity': 0.7
- height: 80px
- border-radius: 10%
- padding: 10%
- font-size: 10px