HI all.
I have a this situation.
The button “3 Fascia” must be non-clickable unless the “2 Fascia” button is active.
I have used a conditional card in order to obtain this
- type: conditional
conditions:
- entity: input_boolean.zone1_onofftime2
state: "off"
card:
type: custom:button-card
entity: input_boolean.zone1_onofftime3
name: "Fascia"
icon: mdi:numeric-3-box-outline
template: timeslot_off
- type: conditional
conditions:
- entity: input_boolean.zone1_onofftime2
state: "on"
card:
type: custom:button-card
entity: input_boolean.zone1_onofftime3
name: "Fascia"
icon: mdi:numeric-3-box-outline
template: timeslot_onoff
The problem appears when the second condition card is true.
In this case, the button appears shifted to the right and not aligned
The two template are identical except pointer-events: none and colors
timeslot_onoff:
# template: irrigation_common
show_state: false
show_name: false
styles:
grid:
- grid-template-areas: '"i n"'
- grid-template-columns: 20% 80%
icon:
- width: 40%
name:
- text-align: initial
- place-self: initial
state:
- value: "on"
styles:
icon:
- "--paper-item-icon-active-color": orange
name:
- color: orange
timeslot_off:
# template: irrigation_common
show_state: false
show_name: false
styles:
card:
- pointer-events: none
grid:
- grid-template-areas: '"i n"'
- grid-template-columns: 20% 80%
name:
- text-align: initial
- place-self: initial
- color: grey
icon:
- color: grey
- width: 40%
Not margin, padding or other is present.
Does anyone know how to fix this?
Regards