Hi,
First you need to install the: browser_mod.popup
you should read it how to, because you need to refresh sometimes the page ect.
for the grafiek, i made a input_numer:so you can change the time-span of the graph with 24hours. to a max of 744 hours.
this input number i did make:
temperature_graph_hours:
name: grafiek
initial: 24
min: 24
max: 744
mode: box
step: 24
the code of just he garage:
- type: horizontal-stack
cards:- type: custom:vertical-stack-in-card
horizontal: true
cards:- type: custom:mushroom-template-card
secondary: >-
{{ states.sensor.garage_temperature.state }} °C / {{
states.sensor.garage_humidity.state }} %
icon: mdi:car-back
icon_color: blue
multiline_secondary: true
primary: Garage
tap_action:
action: fire-dom-event
browser_mod:
service: browser_mod.popup
data:
title: Garage
content:
type: custom:vertical-stack-in-card
horizontal: false
cards:
- type: custom:config-template-card
entities:
- input_number.temperature_graph_hours
card:
type: horizontal-stack
cards:
- type: custom:config-template-card
entities:
- input_number.temperature_graph_hours
card:
type: custom:mini-graph-card
entities:
- sensor.garage_temperature
hours_to_show: >-
${states[“input_number.temperature_graph_hours”].state}
points_per_hour: 1
line_width: 4
font_size: 70
line_color: lightblue
align_state: center
show:
name: false
average: true
extrema: true
labels_secondary: false
- type: custom:config-template-card
entities:
- input_number.temperature_graph_hours
card:
type: custom:mini-graph-card
entities:
- sensor.garage_humidity
hours_to_show: >-
${states[“input_number.temperature_graph_hours”].state}
points_per_hour: 1
line_width: 4
font_size: 70
align_state: center
show:
name: false
average: true
extrema: true
- type: custom:mushroom-light-card
entity: light.garage
fill_container: false
use_light_color: false
show_brightness_control: true
primary_info: none
show_color_temp_control: false
layout: horizontal
- type: entities
show_header_toggle: false
entities:
- entity: input_number.temperature_graph_hours
type: custom:numberbox-card
icon: mdi:poll
unit: h - type: custom:mushroom-light-card
entity: light.garage
primary_info: none
fill_container: true
use_light_color: true
show_brightness_control: true
show_color_temp_control: false
show_color_control: false
layout: horizontal
- type: custom:mushroom-template-card
- type: custom:vertical-stack-in-card