frontend
frontend copied to clipboard
Grid card not compatible with sections
Checklist
- [X] I have updated to the latest available Home Assistant version.
- [ ] I have cleared the cache of my browser.
- [ ] I have tried a different browser to see if it is related to my browser.
- [ ] I have tried reproducing the issue in safe mode to rule out problems with unsupported custom resources.
Describe the issue you are experiencing
The grid card doesn't accept the layout_options:
argument (see my yaml below: all gauges should be 1x1).
(These are way too big)
Describe the behavior you expected
(This is my expected output: it's a screenshot of 1x1 gauges that aren't in a grid)
If I try forcing the whole grid card to be 3x2, I get an output that is still not the right size and doesn't fit in a 3x2:
Steps to reproduce the issue
Using this code, I would expect the grid to be constituted of 1x1 gauges but they're much bigger.
square: false
type: grid
cards:
- type: gauge
entity: sensor.ozone_clermont_ferrand
name: O₃
min: 0
max: 7.5
segments:
- from: 0
color: transparent
- from: 0.5
color: "#50F0E6"
- from: 1.5
color: "#50CCAA"
- from: 2.5
color: "#F0E641"
- from: 3.5
color: "#FF5050"
- from: 4.5
color: "#960032"
- from: 5.5
color: "#872181"
- from: 6.5
color: "#888888"
label: "!!!"
needle: true
layout_options:
grid_columns: 1
grid_rows: 1
- type: gauge
entity: sensor.dioxyde_d_azote_clermont_ferrand
name: NO₂
min: 0
max: 7.5
segments:
- from: 0
color: transparent
- from: 0.5
color: "#50F0E6"
- from: 1.5
color: "#50CCAA"
- from: 2.5
color: "#F0E641"
- from: 3.5
color: "#FF5050"
- from: 4.5
color: "#960032"
- from: 5.5
color: "#872181"
- from: 6.5
color: "#888888"
label: "!!!"
needle: true
layout_options:
grid_columns: 1
grid_rows: 1
- type: gauge
entity: sensor.dioxyde_de_soufre_clermont_ferrand
name: SO₂
min: 0
max: 7.5
segments:
- from: 0
color: transparent
- from: 0.5
color: "#50F0E6"
- from: 1.5
color: "#50CCAA"
- from: 2.5
color: "#F0E641"
- from: 3.5
color: "#FF5050"
- from: 4.5
color: "#960032"
- from: 5.5
color: "#872181"
- from: 6.5
color: "#888888"
label: "!!!"
needle: true
layout_options:
grid_columns: 1
grid_rows: 1
- type: gauge
entity: sensor.pm10_clermont_ferrand
name: PM10
min: 0
max: 7.5
segments:
- from: 0
color: transparent
- from: 0.5
color: "#50F0E6"
- from: 1.5
color: "#50CCAA"
- from: 2.5
color: "#F0E641"
- from: 3.5
color: "#FF5050"
- from: 4.5
color: "#960032"
- from: 5.5
color: "#872181"
- from: 6.5
color: "#888888"
label: "!!!"
needle: true
layout_options:
grid_columns: 1
grid_rows: 1
- type: gauge
entity: sensor.pm25_clermont_ferrand
name: PM25
min: 0
max: 7.5
segments:
- from: 0
color: transparent
- from: 0.5
color: "#50F0E6"
- from: 1.5
color: "#50CCAA"
- from: 2.5
color: "#F0E641"
- from: 3.5
color: "#FF5050"
- from: 4.5
color: "#960032"
- from: 5.5
color: "#872181"
- from: 6.5
color: "#888888"
label: "!!!"
needle: true
layout_options:
grid_columns: 1
grid_rows: 1
What version of Home Assistant Core has the issue?
2024.10.1
What was the last working version of Home Assistant Core?
No response
In which browser are you experiencing the issue with?
Chrome Version 129.0.6668.60
Which operating system are you using to run this browser?
Windows 10
State of relevant entities
Supervisor 2024.10.0
Operating System 13.1
Frontend 20241002.2