@Ildar_Gabdullin thanks for all the work on trying to get people to help customize the card
Would you know (I think legend is the way to go here, but struggling to keep them in one line) how to put the Min and Max to the right of the current temp to use the div row?
I read through the thread on "mini-graph-card" & "history-graph": using a decluttering template - #16 by Ildar_Gabdullin but didn’t find anything exactly like it
Current
would like
Code
type: vertical-stack
cards:
- type: custom:mini-graph-card
name: Temperature
icon: mdi:temperature-celsius
decimals: 1
line_width: 2
hours_to_show: 24
points_per_hour: 1
hour24: true
show:
labels: true
icon: false
name: false
entities:
- entity: sensor.gr_sensor_1_temperature
name: Inside
show_points: false
color_thresholds:
- value: 16
color: '#251ab9'
- value: 17
color: '#0f28e5'
- value: 18
color: '#007eff'
- value: 19
color: '#00aaf9'
- value: 20
color: '#00cc9e'
- value: 22
color: '#59E442'
- value: 21
color: '#7fd206'
- value: 23
color: '#97bf00'
- value: 24
color: '#aaac00'
- value: 25
color: '#b89700'
- value: 26
color: '#c18200'
- value: 27
color: '#c86c00'
- value: 28
color: '#ca5400'
- value: 29
color: '#c93905'
- value: 30
color: '#c4161e'
card_mod:
style: |
.header {
padding-bottom: 0px;
}
.graph__legend {
margin-top: -45px;
justify-content: end;
}
ha-card {
border-radius: var(--ha-card-border-radius, 4px) var(--ha-card-border-radius, 4px) 0px 0px ;
}
- type: history-graph
hours_to_show: 24
refresh_interval: 0
entities:
- entity: sun.sun
card_mod:
style: |
.content {
padding: 0px !important;
margin-left: -20px;
margin-top: -35px
}
ha-card {
overflow: hidden;
margin-top: -8px;
border-radius: 0px 0px var(--ha-card-border-radius, 4px) var(--ha-card-border-radius, 4px);
}
card_mod:
style: |
ha-card {
overflow: visible !important;
}
Thanks in advance!