Skip to content

Instantly share code, notes, and snippets.

@sstratoti

sstratoti/baby_buddy_buttons.yaml

Created February 7, 2021 17:54
Show Gist options
  • Save sstratoti/84f999eb8b77e8fdf86528516176d348 to your computer and use it in GitHub Desktop.
Save sstratoti/84f999eb8b77e8fdf86528516176d348 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
baby_buddy_buttons.yaml
- cards:
- color: black
color_type: icon
custom_fields:
color: |
[[[
return `<span style="color: var(--text-color-sensor);">${states['sensor.bb_last_diaper_change_color'].state}</span>`
]]]
dow: |
[[[
return `<span style="color: var(--text-color-sensor);">${states['sensor.bb_last_diaper_change_dow'].state}</span>`
]]]
time: |
[[[
return `<span style="color: var(--text-color-sensor);">${states['sensor.bb_last_diaper_change_time'].state}</span>`
]]]
type: |
[[[
return `<span style="color: var(--text-color-sensor);">${states['sensor.bb_last_diaper_change_type'].state}</span>`
]]]
entity: sensor.bb_last_diaper_change_time
icon: 'mdi:human-baby-changing-table'
name: Last Diaper Change
show_name: false
show_state: false
state:
- operator: template
styles:
custom_fields:
color:
- color: brown
value: |
[[[
return states['sensor.bb_last_diaper_change_color'].state == 'brown';
]]]
- operator: template
styles:
custom_fields:
color:
- color: green
value: |
[[[
return states['sensor.bb_last_diaper_change_color'].state == 'green';
]]]
- operator: template
styles:
custom_fields:
color:
- color: '#b3b300'
value: |
[[[
return states['sensor.bb_last_diaper_change_color'].state == 'yellow';
]]]
- operator: template
styles:
custom_fields:
color:
- color: black
value: |
[[[
return states['sensor.bb_last_diaper_change_color'].state == 'black';
]]]
styles:
custom_fields:
color:
- padding-bottom: 2px
- padding-right: 10px
- align-self: end
- justify-self: end
- font-size: .8em
- font-weight: bold
- text-transform: uppercase
dow:
- padding-top: 5px
- padding-right: 10px
- align-self: end
- justify-self: end
- font-size: .7em
time:
- padding-right: 10px
- align-self: end
- text-transform: uppercase
- justify-self: end
- font-weight: bold
type:
- padding-right: 10px
- align-self: end
- justify-self: end
- font-weight: bold
- font-size: 1.1em
grid:
- grid-template-areas: '"i type" "i color" "i time" "i dow"'
- grid-template-columns: 1fr 1fr
- grid-template-rows: 'repeat(4, 1fr)'
type: 'custom:button-card'
- color: black
color_type: icon
custom_fields:
duration: |
[[[
return `<span style="color: var(--text-color-sensor);">${states['sensor.bb_last_sleep_duration'].state}</span>`
]]]
how_long_ago: |
[[[
return `<span style="color: var(--text-color-sensor);">${states['sensor.bb_last_sleep_how_long_ago'].state}</span>`
]]]
entity: sensor.bb_last_sleep_end_time
icon: 'fas:bed'
name: Last Sleep
show_name: true
show_state: true
styles:
card:
- height: 100%
custom_fields:
duration:
- font-size: .8em
- font-weight: bold
- padding-right: 10px
- align-self: end
- justify-self: end
how_long_ago:
- padding-right: 10px
- align-self: end
- justify-self: end
- font-size: .8em
grid:
- grid-template-areas: '"i n" "i s" "duration duration" "how_long_ago how_long_ago"'
- grid-template-columns: 1fr 1fr
- grid-template-rows: 'repeat(4, 1fr)'
name:
- font-weight: bold
- padding-right: 10px
- align-self: end
- justify-self: end
state:
- font-weight: bold
- padding-right: 10px
- align-self: end
- justify-self: end
- font-size: 1em
type: 'custom:button-card'
type: horizontal-stack
- cards:
- color: black
color_type: icon
custom_fields:
count: |
[[[
return `<span style="color: var(--text-color-sensor);">${states['sensor.bb_todays_feeding_count'].state}</span>`
]]]
from: |
[[[
return `<span style="color: var(--text-color-sensor);">${states['sensor.bb_last_feeding_from'].state}</span>`
]]]
how_long: |
[[[
return `<span style="color: var(--text-color-sensor);">${states['sensor.bb_last_feeding_how_long_ago'].state}</span>`
]]]
time: |
[[[
return `<span style="color: var(--text-color-sensor);">${states['sensor.bb_last_feeding_time'].state}</span>`
]]]
type: |
[[[
return `<span style="color: var(--text-color-sensor);">${states['sensor.bb_last_feeding_type'].state}</span>`
]]]
entity: sensor.bb_last_feeding_time
icon: 'mdi:baby-bottle-outline'
name: Last Diaper Change
show_name: false
show_state: false
styles:
card:
- height: 100%
custom_fields:
count:
- padding-bottom: 2px
- padding-right: 10px
- align-self: end
- justify-self: end
- font-size: .8em
dow:
- padding-top: 5px
- padding-right: 10px
- align-self: end
- justify-self: end
- font-size: .7em
from:
- font-size: .7em
- padding-right: 10px
- align-self: end
- justify-self: end
- text-transform: uppercase
- font-weight: bold
how_long:
- padding-bottom: 2px
- padding-right: 10px
- align-self: end
- justify-self: end
- font-size: .8em
- font-weight: bold
time:
- padding-right: 10px
- align-self: end
- text-transform: uppercase
- justify-self: end
- font-weight: bold
type:
- padding-right: 10px
- align-self: end
- justify-self: end
- font-weight: bold
- text-transform: capitalize
grid:
- grid-template-areas: '"type type" "i time" "i from" "i how_long" "count count"'
- grid-template-columns: 1fr 1fr
- grid-template-rows: 'repeat(4, 1fr)'
type: 'custom:button-card'
- color: black
color_type: icon
custom_fields:
count: |
[[[
return `<span style="color: var(--text-color-sensor);">${states['sensor.bb_todays_tummytime_count'].state}</span>`
]]]
dow: |
[[[
return `<span style="color: var(--text-color-sensor);">${states['sensor.bb_last_tummytime_dow'].state}</span>`
]]]
duration: |
[[[
return `<span style="color: var(--text-color-sensor);">${states['sensor.bb_last_tummytime_duration'].state}</span>`
]]]
time: |
[[[
return `<span style="color: var(--text-color-sensor);">${states['sensor.bb_last_tummytime_time'].state}</span>`
]]]
entity: sensor.bb_last_tummytime_time
icon: 'fas:baby'
name: Last Tummy Time
show_name: true
show_state: false
styles:
card:
- height: 100%
custom_fields:
count:
- padding-bottom: 2px
- padding-right: 10px
- align-self: end
- justify-self: end
- font-size: .8em
dow:
- padding-top: 5px
- padding-right: 10px
- align-self: end
- justify-self: end
- font-size: .7em
duration:
- padding-bottom: 2px
- padding-right: 10px
- align-self: end
- justify-self: end
- font-size: .8em
- font-weight: bold
time:
- padding-right: 10px
- align-self: end
- text-transform: uppercase
- justify-self: end
- font-weight: bold
grid:
- grid-template-areas: '"n n" "i time" "i dow" "duration duration" "count count"'
- grid-template-columns: 1fr 1fr
- grid-template-rows: 'repeat(5, 1fr)'
name:
- font-weight: bold
- padding-bottom: 2px
- padding-right: 10px
- align-self: end
- justify-self: end
type: 'custom:button-card'
type: horizontal-stack
- cards:
- color: black
color_type: icon
entity: input_boolean.bb_timer_on
icon: 'fas:bed'
name: null
show_label: true
show_name: true
show_state: false
state:
- label: (Click to Start)
name: Timer Not Running
operator: template
styles:
grid:
- grid-template-areas: '"n" "l"'
- grid-template-columns: 1fr
- grid-template-rows: 'repeat(2, 1fr)'
label:
- font-weight: bold
name:
- font-weight: bold
value: |
[[[
return states['sensor.bb_timer_status'].state == 'NA';
]]]
- icon: 'mdi:timer-outline'
label: |
[[[
return `<span style="color: var(--text-color-sensor);">${states['sensor.bb_timer_status'].state}</span>`
]]]
name: Time Running
operator: template
styles:
grid:
- grid-template-areas: '"i n" "i l"'
- grid-template-columns: 1fr 1fr
- grid-template-rows: 'repeat(2, 1fr)'
label:
- font-weight: bold
- padding-bottom: 2px
- padding-right: 10px
- align-self: end
- justify-self: end
name:
- font-weight: bold
- padding-bottom: 2px
- padding-right: 10px
- align-self: end
- justify-self: end
value: |
[[[
return states['sensor.bb_timer_status'].state != 'NA';
]]]
styles:
card:
- height: 100%
type: 'custom:button-card'
type: horizontal-stack
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment