Initial hallway UI. Button refactoring.

This commit is contained in:
2020-12-07 23:08:33 +02:00
parent 74337a6100
commit e404605127
20 changed files with 449 additions and 139 deletions
@@ -1,18 +0,0 @@
ac_button_card:
card:
type: custom:button-card
template: default
entity: climate.toshiba_ac
name: AC
state:
- value: 'off'
operator: '!='
styles:
card:
- background-color: var(--primary-color)
- color: black
icon:
- color: black
tap_action:
action: call-service
service: script.toshiba_ac_toggle_cool
@@ -1,55 +0,0 @@
brita_water_card:
card:
type: custom:button-card
template: [default, with_state_indicator]
name: Brita water
entity: script.brita_pour_water
custom_fields:
remaining_liters: "[[[ return states['input_number.brita_remaining_liters'].state ]]]"
tap_action:
action: toggle
styles:
card:
- background: >
[[[
const remaining = states['input_number.brita_remaining_liters'].state;
const percent = 100 - (remaining / 150 * 100);
const gradient = [
'180deg',
'var(--paper-card-background-color) 0%',
`var(--paper-card-background-color) ${percent}%`,
`var(--primary-color) ${percent}%`
]
return `linear-gradient(${gradient.join(',')})`;
]]]
- color: white
name:
- color: >
[[[
const remaining = states['input_number.brita_remaining_liters'].state;
const percent = 100 - (remaining / 150 * 100);
return percent < 75 ? 'black' : 'white';
]]]
icon:
- color: >
[[[
const remaining = states['input_number.brita_remaining_liters'].state;
const percent = 100 - (remaining / 150 * 100);
return percent < 25 ? 'black' : 'white';
]]]
custom_fields:
remaining_liters:
- position: absolute
- top: 8px
- right: 5px
- font-size: 12px
variables:
state_indicator_id: binary_sensor.brita_should_change_filter
state_indicator_size: 5px
state_indicator_off_size: 0px
state_indicator_on_color: var(--color-red)
state_on_indicator_on_color: var(--color-red)
@@ -1,23 +0,0 @@
radiator_button_card:
default:
- name: "Radiator"
card:
type: custom:button-card
template: default
entity: "[[entity_id]]"
name: "[[name]]"
icon: mdi:radiator
state:
- value: 'off'
operator: '!='
styles:
card:
- background-color: var(--primary-color)
- color: black
icon:
- color: black
tap_action:
action: call-service
service: script.toggle_radiator
service_data:
entity_id: "[[entity_id]]"