It appears to be.
From developer tools of Chrome:
<ha-icon id="icon" style="color: rgb(255, 255, 194); width: 40%; position: relative; filter: drop-shadow(rgb(255, 255, 194) 0px 0px 20px) contrast(1.7); transition: all 1s ease 0s;"></ha-icon>
Continued in PM.
1 Like
Hi, guys.
I´m trying to put brightness inside off button like this:
But without sucess:
My code:
light_button_card:
default:
- size: 30%
- lock: false
- color: auto
- spin: false
- show_state: true
- show_label: true
- show_last_changed: false
- tap_action: toggle
- hold_action: more-info
- aspect_ratio: 1/1
card:
type: custom:button-card
name: '[[name]]'
icon: 'mdi:[[icon]]'
size: '[[size]]'
color: '[[color]]'
lock: '[[lock]]'
aspect_ratio: '[[aspect_ratio]]'
entity: '[[entity]]'
show_state: '[[show_state]]'
show_label: '[[show_label]]'
show_last_changed: '[[show_last_changed]]'
tap_action:
action: '[[tap_action]]'
haptic: light
hold_action:
action: '[[hold_action]]'
haptic: success
styles:
custom_fields:
area: '[[area]]'
label: >
[[[
if (typeof(entity) === 'undefined') return;
if ('brightness' in entity.attributes)
{
if (entity.attributes
&& (entity.attributes.brightness <= 255)) {
var bri = Math.round(entity.attributes.brightness / 2.55);
return (bri ? bri : '0') + '%';
}
}
]]]
card:
- border-radius: 12px
- --paper-card-background-color: var(--homekit-white)
label:
- color: gray
- font-size: 11px
- font-family: Helvetica
- padding: 0px 10px
- justify-self: start
state:
- font-size: 11px
- font-family: Helvetica
- padding: 0px 10px
- justify-self: start
- text-transform: capitalize
- font-weight: bold
- padding-left: 10px
grid:
- grid-template-areas: '"i i" "n n" "area area" "s l"'
- grid-template-columns: 1fr lfr
- grid-template-rows: 1fr min-content min-content min-content
img_cell:
- align-self: start
- text-align: start
- margin-right: 60px
name:
- justify-self: start
- padding-left: 10px
- font-weight: bold
- font-family: Helvetica
- font-size: 13px
state:
- value: "on"
spin: '[[spin]]'
styles:
name:
- color: black
state:
- color: gray
lock:
- color: black
- value: "off"
styles:
card:
- opacity: 0.4
icon:
- color: gray
name:
- color: gray
state:
- color: gray
lock:
- color: black
- value: "unavailable"
styles:
card:
- opacity: 0.2
icon:
- color: gray
state:
- color: gray
name:
- color: gray
any input please?
Do a browser inspect + screenshot?
I haven’t touched my Home Assistant instance in a while and just upgraded from 0.106.x to 0.114.1 and all of the custom components I’m using as well. So, layout-card, button-card, etc. are all on the latest version.
The following buttons used to be the exact same size, but now on mobile (iPhone) the middle buttons are for some reason a bit smaller. It doesn’t matter if there are 3 or 4 buttons, the second and third button are always smaller. The first and fourth are the correct size. If I only have 2 buttons next to each other they are the same size.
This is the button template:
---
room_light:
size: 25%
aspect_ratio: 1/1
show_state: true
deep_press: true
tap_action:
action: toggle
haptic: light
styles:
card:
- box-shadow: none
- border-radius: 12px
grid:
- grid-template-areas: '"i" "n" "s"'
- grid-template-columns: 1fr
- grid-template-rows: 1fr min-content min-content
img_cell:
- justify-content: start
- align-items: start
icon:
- padding: 10px 10px
- height: 50%
name:
- justify-self: start
- padding: 5px 0 0 10px
- font-weight: bold
- font-size: 13px
label:
- justify-self: start
- padding: 0 10px 5px
- font-size: 11px
state:
- justify-self: start
- padding: 0 10px 5px
- font-size: 11px
state:
- value: 'unavailable'
styles:
card:
- filter: opacity(50%)
This is the card I’m using in the view:
- type: custom:mod-card
style: |
layout-card {
padding: 0 10px;
}
card:
type: custom:layout-card
layout: horizontal
justify_content: start
min_columns: 4
cards:
{% for light in room.lights %}
- type: custom:button-card
template: room_light
entity: {{ light.entity }}
icon: {{ light.icon }}
name: {{ light.name }}
label: "{{ light.label | default(' ') }}"
hold_action:
!include
- ../popups/light.yaml
- entity: {{ light.entity }}
{% endfor %}
- type: custom:button-card
color_type: blank-card
aspect_ratio: 1/1
- type: custom:button-card
color_type: blank-card
aspect_ratio: 1/1
- type: custom:button-card
color_type: blank-card
aspect_ratio: 1/1
I’m not sure whether this is an issue with button-card, layout-card or anything else. Did something cause this since 0.106? Does anyone know?
I think it’s lay-out card. I use lay-out card on my mobile view in vertical mode with a max width in order to have paddings to the sides. I used to have set that to 98%, however one of the latest updates (I think the one that came with HA 112) was suddenly wider at 98%. So I changed everything to 96%, to have the same results as before.
Perhaps there have been more changes with layout card, that causes your issue.
I gotta ask though: why do you use lay-out card to achieve that view? Wouldn’t is be easier to use the built in horizontal-stack and vertical-stack (which is what I use). Or maybe I’m just not understanding your code.
Thanks for mentioning that, going to look into what exactly changed in layout-card around that period. @thomasloven would you maybe be able to point me to the issue immediately without me going into all of the changes?
About using layout-card instead of the core components… I’m using layout-card on other views for more complexity. It kind of became my go to layout component and haven’t been using the core ones at all except for the most outer container. I guess it just became a habit. I chose to show this page here because it is fairly simplistic to show the issue and cutting away all of the complexity of all the other views I have.
I´m trying to use your code, but i got this message:
any input? thanks
That’s a problem of decluttering card, not button card.
This is my decluttering …
room:
card:
custom_fields:
icon1: |
[[[
if (states['[[icon1_ent]]'].state == '[[icon1_state1]]')
return '<ha-icon icon="mdi:[[icon1_icon1]]" style="width: 20px; height: 20px;"></ha-icon>';
if (states['[[icon1_ent]]'].state == '[[icon1_state2]]')
return '<ha-icon icon="mdi:[[icon1_icon2]]" style="width: 20px; height: 20px;"></ha-icon>';
else
return '<ha-icon icon="mdi:[[icon1_icon3]]" style="width: 20px; height: 20px;"></ha-icon>';
]]]
icon2: |
[[[
if (states['[[icon2_ent]]'].state == '[[icon2_state1]]')
return '<ha-icon icon="mdi:[[icon2_icon1]]" style="width: 20px; height: 20px;"></ha-icon>';
if (states['[[icon2_ent]]'].state == '[[icon2_state2]]')
return '<ha-icon icon="mdi:[[icon2_icon2]]" style="width: 20px; height: 20px;"></ha-icon>';
else
return '<ha-icon icon="mdi:[[icon2_icon3]]" style="width: 20px; height: 20px;"></ha-icon>';
]]]
icon3: |
[[[
if (states['[[icon3_ent]]'].state == '[[icon3_state1]]')
return '<ha-icon icon="mdi:[[icon3_icon1]]" style="width: 20px; height: 20px;"></ha-icon>';
if (states['[[icon3_ent]]'].state == '[[icon3_state2]]')
return '<ha-icon icon="mdi:[[icon3_icon2]]" style="width: 20px; height: 20px;"></ha-icon>';
else
return '<ha-icon icon="mdi:[[icon3_icon3]]" style="width: 20px; height: 20px;"></ha-icon>';
]]]
icon4: |
[[[
if (states['[[icon4_ent]]'].state == '[[icon4_state1]]')
return '<ha-icon icon="mdi:[[icon4_icon1]]" style="width: 20px; height: 20px;"></ha-icon>';
if (states['[[icon4_ent]]'].state == '[[icon4_state2]]')
return '<ha-icon icon="mdi:[[icon4_icon2]]" style="width: 20px; height: 20px;"></ha-icon>';
else
return '<ha-icon icon="mdi:[[icon4_icon3]]" style="width: 20px; height: 20px;"></ha-icon>';
]]]
icon5: |
[[[
if (states['[[icon5_ent]]'].state == '[[icon5_state1]]')
return '<ha-icon icon="mdi:[[icon5_icon1]]" style="width: 20px; height: 20px;"></ha-icon>';
if (states['[[icon5_ent]]'].state == '[[icon5_state2]]')
return '<ha-icon icon="mdi:[[icon5_icon2]]" style="width: 20px; height: 20px;"></ha-icon>';
else
return '<ha-icon icon="mdi:[[icon5_icon3]]" style="width: 20px; height: 20px;"></ha-icon>';
]]]
icon6: |
[[[
if (states['[[temp_ent]]'].state == "heat")
return '<ha-icon icon="mdi:fire" style="width: 20px; height: 20px;"></ha-icon>';
if (states['[[temp_ent]]'].state == "cool")
return '<ha-icon icon="mdi:snowflake" style="width: 20px; height: 20px;"></ha-icon>';
else
return '<ha-icon icon="mdi:[[icon]]" style="width: 20px; height: 20px;"></ha-icon>';
]]]
stat1: |
[[[
return `<ha-icon
icon="mdi:[[stat1_icon]]"
style="width: 15px; height: 15px; color: steelblue;">
</ha-icon><span>[[stat1_pre]]<span style="color: var(--text-color-sensor);">${states['[[stat1_ent]]'].state}[[stat1_suf]]</span></span>`
]]]
stat2: |
[[[
return `<ha-icon
icon="mdi:[[stat2_icon]]"
style="width: 15px; height: 15px; color: steelblue;">
</ha-icon><span>[[stat2_pre]]<span style="color: var(--text-color-sensor);">${states['[[stat2_ent]]'].state}[[stat2_suf]]</span></span>`
]]]
entity: '[[entity]]'
name: '[[name]]'
show_icon: false
show_label: false
show_state: false
size: 70%
state:
- styles:
custom_fields:
icon6:
- animation: blink 2s ease infinite
- color: crimson
value: heat
- styles:
custom_fields:
icon6:
- animation: blink 2s ease infinite
- color: lightblue
value: cool
styles:
card:
- font-size: 12px
- padding: 5px 3px 5px 3px
custom_fields:
icon1:
- padding: 0px 0px 0px 0px
- animation: |
[[[
if (states["[[icon1_ent]]"].state == '[[icon1_state1]]') return "[[icon1_animate]]";
else return null;
]]]
- color: |
[[[
if (states["[[icon1_ent]]"].state == '[[icon1_state1]]') return "[[icon1_color1]]";
if (states["[[icon1_ent]]"].state == '[[icon1_state2]]') return "[[icon1_color2]]";
if (states["[[icon1_ent]]"].state == '[[icon1_state3]]') return "[[icon1_color3]]";
else return null;
]]]
icon2:
- padding: 0px 0px 0px 0px
- animation: |
[[[
if (states["[[icon2_ent]]"].state == '[[icon2_state1]]') return "[[icon2_animate]]";
else return null;
]]]
- color: |
[[[
if (states["[[icon2_ent]]"].state == '[[icon2_state1]]') return "[[icon2_color1]]";
if (states["[[icon2_ent]]"].state == '[[icon2_state2]]') return "[[icon2_color2]]";
if (states["[[icon2_ent]]"].state == '[[icon2_state3]]') return "[[icon2_color3]]";
else return null;
]]]
icon3:
- padding: 0px 0px 0px 0px
- animation: |
[[[
if (states["[[icon3_ent]]"].state == '[[icon3_state1]]') return "[[icon3_animate]]";
else return null;
]]]
- color: |
[[[
if (states["[[icon3_ent]]"].state == '[[icon3_state1]]') return "[[icon3_color1]]";
if (states["[[icon3_ent]]"].state == '[[icon3_state2]]') return "[[icon3_color2]]";
if (states["[[icon3_ent]]"].state == '[[icon3_state3]]') return "[[icon3_color3]]";
else return null;
]]]
icon4:
- padding: 0px 0px 0px 0px
- animation: |
[[[
if (states["[[icon4_ent]]"].state == '[[icon4_state1]]') return "[[icon4_animate]]";
else return null;
]]]
- color: |
[[[
if (states["[[icon4_ent]]"].state == '[[icon4_state1]]') return "[[icon4_color1]]";
if (states["[[icon4_ent]]"].state == '[[icon4_state2]]') return "[[icon4_color2]]";
if (states["[[icon4_ent]]"].state == '[[icon4_state3]]') return "[[icon4_color3]]";
else return null;
]]]
icon5:
- padding: 0px 0px 0px 0px
- animation: |
[[[
if (states["[[icon5_ent]]"].state == '[[icon5_state1]]') return "[[icon5_animate]]";
else return null;
]]]
- color: |
[[[
if (states["[[icon5_ent]]"].state == '[[icon5_state1]]') return "[[icon5_color1]]";
if (states["[[icon5_ent]]"].state == '[[icon5_state2]]') return "[[icon5_color2]]";
if (states["[[icon5_ent]]"].state == '[[icon5_state3]]') return "[[icon5_color3]]";
else return null;
]]]
icon6:
- padding: 0px 0px 0px 0px
stat1:
- justify-self: start
- padding: 0px 0px 0px 0px
- '--text-color-sensor': |
[[[
if (states["[[stat1_ent]]"].state < 20) return "lightblue";
if (states["[[stat1_ent]]"].state >= 20 && states["[[stat1_ent]]"].state < 28) return "mediumaquamarine";
else return "tomato";
]]]
stat2:
- justify-self: start
- padding: 0px 0px 0px 0px
- '--text-color-sensor': |
[[[
if (states["[[stat2_ent]]"].state < 30) return "lightblue";
if (states["[[stat2_ent]]"].state >= 30 && states["[[stat2_ent]]"].state < 55) return "mediumaquamarine";
else return "tomato";
]]]
grid:
- grid-template-areas: >-
". n n n n icon6 ." ". stat1 stat1 stat1 stat1 stat1 ." ". stat2
stat2 stat2 stat2 stat2 ." ". icon1 icon2 icon3 icon4 icon5 ."
- grid-template-columns: 1fr 5fr 5fr 5fr 5fr 5fr 1fr
- grid-template-rows: 2fr 1fr 1fr 3fr
- padding: 0px 0px 0px 0px
icon:
- place-self: center
- padding: 0px 0px 3px 0px
name:
- justify-self: start
- font-size: 16px
- padding: 0px 0px 0px 3px
tap_action:
action: call-service
service: browser_mod.popup
service_data:
card:
cards:
- cards:
- cards:
- cards:
- color_type: '[[pu_light1_colortype]]'
dbltap_action:
action: more-info
entity: '[[pu_light1_ent]]'
hold_action:
action: more-info
name: '[[pu_light1_name]]'
show_last_changed: true
show_state: false
size: 40%
styles:
card:
- height: 70px
- padding: 0px 0px 0px 0px
grid:
- grid-template-areas: '"i ." "i n" "i l" "i ."'
- grid-template-columns: 2fr 3fr
- grid-template-rows: 1fr 3fr 1fr 1fr
icon:
- padding: 4px 0px 8px 10px
label:
- font-size: 11px
- padding: 0px 25px 20px 0px
- justify-self: right
- color: '#7babf7'
- align-self: start
name:
- font-size: 20px
- justify-self: right
- padding: 0px 25px 0px 0px
- align-self: start
tap_action:
action: toggle
type: 'custom:button-card'
- color_type: '[[pu_light2_colortype]]'
dbltap_action:
action: more-info
entity: '[[pu_light2_ent]]'
hold_action:
action: more-info
name: '[[pu_light2_name]]'
show_last_changed: true
show_state: false
size: 40%
styles:
card:
- height: 70px
- padding: 0px 0px 0px 0px
grid:
- grid-template-areas: '"i ." "i n" "i l" "i ."'
- grid-template-columns: 2fr 3fr
- grid-template-rows: 1fr 3fr 1fr 1fr
icon:
- padding: 4px 0px 8px 10px
label:
- font-size: 11px
- padding: 0px 25px 20px 0px
- justify-self: right
- color: '#7babf7'
- align-self: start
name:
- font-size: 20px
- justify-self: right
- padding: 0px 25px 0px 0px
- align-self: start
tap_action:
action: toggle
type: 'custom:button-card'
type: horizontal-stack
type: 'custom:vertical-stack-in-card'
type: horizontal-stack
- cards:
- color_type: '[[icon1_colortype]]'
entity: '[[icon1_ent]]'
hold_action:
action: '[[icon1_holdaction]]'
icon: 'mdi:[[icon1_icon2]]'
name: '[[icon1_name]]'
show_last_changed: true
show_state: false
size: 70%
state:
- icon: 'mdi:[[icon1_icon1]]'
styles:
icon:
- color: '[[icon1_color1]]'
- animation: '[[icon1_animate]]'
value: '[[icon1_state1]]'
styles:
card:
- height: 120px
icon:
- color: null
label:
- font-size: 9px
- color: '#7babf7'
tap_action:
action: '[[icon1_tapaction]]'
type: 'custom:button-card'
- color_type: '[[icon2_colortype]]'
entity: '[[icon2_ent]]'
hold_action:
action: '[[icon2_holdaction]]'
icon: 'mdi:[[icon2_icon2]]'
name: '[[icon2_name]]'
show_last_changed: true
show_state: false
size: 70%
state:
- icon: 'mdi:[[icon2_icon1]]'
styles:
icon:
- color: '[[icon2_color1]]'
- animation: '[[icon2_animate]]'
value: '[[icon2_state1]]'
styles:
card:
- height: 120px
icon:
- color: null
label:
- font-size: 9px
- color: '#7babf7'
tap_action:
action: '[[icon2_tapaction]]'
type: 'custom:button-card'
- color_type: '[[icon3_colortype]]'
entity: '[[icon3_ent]]'
hold_action:
action: '[[icon3_holdaction]]'
icon: 'mdi:[[icon3_icon2]]'
name: '[[icon3_name]]'
show_last_changed: true
show_state: false
size: 70%
state:
- icon: 'mdi:[[icon3_icon1]]'
styles:
icon:
- color: '[[icon3_color1]]'
- animation: '[[icon3_animate]]'
value: '[[icon3_state1]]'
styles:
card:
- height: 120px
icon:
- color: null
label:
- font-size: 9px
- color: '#7babf7'
tap_action:
action: '[[icon3_tapaction]]'
type: 'custom:button-card'
- color_type: '[[icon4_colortype]]'
entity: '[[icon4_ent]]'
hold_action:
action: '[[icon4_holdaction]]'
icon: 'mdi:[[icon4_icon2]]'
name: '[[icon4_name]]'
show_last_changed: true
show_state: false
size: 70%
state:
- icon: 'mdi:[[icon4_icon1]]'
styles:
icon:
- color: '[[icon4_color1]]'
- animation: '[[icon4_animate]]'
value: '[[icon4_state1]]'
styles:
card:
- height: 120px
icon:
- color: null
label:
- font-size: 9px
- color: '#7babf7'
tap_action:
action: '[[icon4_tapaction]]'
type: 'custom:button-card'
- color_type: '[[icon5_colortype]]'
entity: '[[icon5_ent]]'
hold_action:
action: '[[icon5_holdaction]]'
icon: 'mdi:[[icon5_icon2]]'
name: '[[icon5_name]]'
show_last_changed: true
show_state: false
size: 70%
state:
- icon: 'mdi:[[icon5_icon1]]'
styles:
icon:
- color: '[[icon5_color1]]'
- animation: '[[icon5_animate]]'
value: '[[icon5_state1]]'
styles:
card:
- height: 120px
icon:
- color: null
label:
- font-size: 9px
- color: '#7babf7'
tap_action:
action: '[[icon5_tapaction]]'
type: 'custom:button-card'
type: horizontal-stack
- color_type: '[[pu_therm_colortype]]'
custom_fields:
cardy:
card:
entity: '[[pu_climate_ent]]'
hide:
state: true
icon:
cool: 'mdi:snowflake'
heating: 'mdi:fire'
'off': 'mdi:stop-circle-outline'
modes:
cool: null
heating: null
'off': null
name: Thermostat
sensors:
- attribute: hvac_action
entity: '[[pu_climate_ent]]'
name: Currently
- entity: '[[pu_climate_hum]]'
name: Humidity
type: 'custom:simple-thermostat'
entity: light.curtis
show_icon: false
show_name: false
styles:
grid:
- grid-template-areas: '"cardy"'
- grid-template-columns: 1fr
- grid-template-rows: 1fr
type: 'custom:button-card'
- cards:
- align_header: left
align_icon: left
animate: true
entities:
- color: '#f2ab48'
entity: '[[pu_climate_temp]]'
index: 0
name: LR
font_size: 80
hours_to_show: 48
name: Temperature - 48h
points_per_hour: 0.25
show:
fill: false
labels: true
points: hover
type: 'custom:mini-graph-card'
- align_header: left
align_icon: left
animate: true
entities:
- color: '#57a5f2'
entity: '[[pu_climate_hum]]'
index: 0
name: LR
font_size: 80
hours_to_show: 48
name: Humidity - 48h
points_per_hour: 0.25
show:
fill: false
labels: true
points: hover
type: 'custom:mini-graph-card'
type: horizontal-stack
type: 'custom:vertical-stack-in-card'
deviceID:
- this
large: false
title: '[[pu_title]]'
triggers_update:
- '[[icon1_ent]]'
- '[[icon2_ent]]'
- '[[icon3_ent]]'
- '[[icon4_ent]]'
- '[[icon5_ent]]'
- '[[icon6_ent]]'
- '[[stat1_ent]]'
- '[[stat2_ent]]'
- '[[pu_light1_ent]]'
- '[[pu_light2_ent]]'
type: 'custom:button-card'
Just as a follow-up. As this doesn’t seem to be an issue in Button Card, but with Layout Card instead, I posted my issue and new findings in that thread here (just informing here in case someone has the same issue).
1 Like
Having an issue that seems to have started after updating to 0.114 but hard to say exactly. I am using several different configurations of button cards. The have two stacks that use the homekit style configuration. These cards are not showing when inactive in Chrome on Windows or Fully Kiosk on Android. They are still showing as expected on iOS Companion app and Fully Kiosk for Fire Tablets.
When the buttons are inactive the stack looks like this:
When a button is activated, the stack shows as normal:
Once the sensor or switch is off, the card looks normal until the next refresh when it goes blank again:
Also, when the page is rendering after a refresh the cards show as normal but then go blank when the rendering finishes.
I am using a template, but here is the code:
# Homekit type buttons
switch_homekit:
color: var(--google-yellow)
show_state: true
styles:
card:
- border-style: solid
- border-width: 2px
- border-color: var(--primary-color)
- height: 100px
- width: 100px
grid:
- grid-template-areas: '"i" "n" "s"'
- grid-template-columns: 1fr
- grid-template-rows: 1fr min-content min-content
icon:
- margin-top: '-5%'
- padding-left: 10px
img_cell:
- justify-content: start
- text-align: start
name:
- font-size: 14px
- font-weight: bold
- justify-self: start
- padding-left: 10px
state:
- font-size: 14px
- justify-self: start
- padding-left: 10px
- text-transform: lowercase
state:
- value: 'off'
styles:
card:
- filter: opacity(50%)
icon:
- filter: grayscale(100%)
- value: 'closed'
styles:
card:
- filter: opacity(50%)
icon:
- color: "#636466"
- filter: grayscale(100%)
- value: 'unavailable'
styles:
card:
- filter: opacity(50%)
icon:
- color: 'rgb(194, 27, 44)'
cards:
- name: Doors
template: title_centered
type: 'custom:button-card'
- cards:
- color_type: blank-card
styles:
card:
- width:
type: 'custom:button-card'
- entity: binary_sensor.door_basement
name: Basement
state:
- color: 'rgb(194, 27, 44)'
operator: template
styles:
card:
- border-color: 'rgb(194, 27, 44)'
value: >
[[[ return states['binary_sensor.warning_door_basement'].state === 'on' ]]]
template: switch_homekit
tap_action:
action: more-info
type: 'custom:button-card'
- entity: cover.garage_door
name: Garage
state:
- color: 'rgb(194, 27, 44)'
icon: 'mdi:garage-alert'
operator: template
styles:
card:
- border-color: 'rgb(194, 27, 44)'
value: >
[[[ return states['input_boolean.garage_warning'].state === 'on' ]]]
- color: var(--google-yellow)
value: open
template: switch_homekit
tap_action:
action: toggle
type: 'custom:button-card'
- color_type: blank-card
styles:
card:
- width:
type: 'custom:button-card'
type: horizontal-stack
keep:
background: true
border_radius: true
margin: true
type: 'custom:stack-in-card'
I’m also having the same problem. But instead of nothing, the entity icon is showing when inactive.
Hi @ffeingol, can you please confirm that your code does work well?
I try with light script, but it stay black even after having press the button. Thnaks
Mind sharing your config?
What happens if you open devtools, choose the pointer in the upper left, hover over where the buttons should be, and click? See any odd HTML/CSS? Screenshots welcome.
@deliwyn It stopped working again after the latest updates. I have to dig further, but I don’t think my script stays ‘on’ once it’s triggered, so the button changes color, then goes back. I need to dig into it more, but it’s not on the top of my list right now.
1 Like
I’m not really sure what I should even be looking for. I’m not really familiar with html/css syntax