mirror of
https://github.com/GeorgeSG/sarah.git
synced 2026-06-15 17:12:59 +00:00
58 lines
1.8 KiB
YAML
58 lines
1.8 KiB
YAML
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)
|