Feature request: Option to hide AQI value over picture

[gabrymed]

It is possible to add an option to hide the brown card with AQI value over picture?

[Tockerz]

I would also like this feature to further compact the card, e.g. to look like this:

[gabrymed]

I would also like this feature to further compact the card, e.g. to look like this:

For this, i think you can try compact_view: true

[Tockerz]

I would also like this feature to further compact the card, e.g. to look like this:

For this, i think you can try compact_view: true

Compact view only gets you to this view (e.g. AQI or the text box still in place):

[MarkRMonaco]

I would also like to hide AQI as well. Compact Mode doesn't hide it.

[caohuongls]

I'm using a little bit trick is that using lovelace card mod and add code as below which not have to modify file and receive update as normally.

card_mod:
  style: |
    ha-card > div.preview > div.controls > div >div { 
      visibility: hidden
    }

[gabrymed]

I'm using a little bit trick is that using lovelace card mod and add code as below which not have to modify file and receive update as normally.

card_mod:
  style: |
    ha-card > div.preview > div.controls > div >div { 
      visibility: hidden

Thanks for the advice

[Tockerz]

I'm using a little bit trick is that using lovelace card mod and add code as below which not have to modify file and receive update as normally.

card_mod:
  style: |
    ha-card > div.preview > div.controls > div >div { 
      visibility: hidden

Doesn't seem to have worked for me.

[caohuongls]

I'm using a little bit trick is that using lovelace card mod and add code as below which not have to modify file and receive update as normally.

card_mod:
  style: |
    ha-card > div.preview > div.controls > div >div { 
      visibility: hidden

Doesn't seem to have worked for me. Here is how I add them. Sorry for missing "}". I have edit it. Or you can try to find css of this card fot more detail.

[Tockerz]

Thanks for that. I realise now that it only works if compact mode is set to false. What I am really trying to do is remove that panel altogether as with my edited pic on Jan 7th.

[xbavnu]

Thanks for that. I realise now that it only works if compact mode is set to false. What I am really trying to do is remove that panel altogether as with my edited pic on Jan 7th.

Have you found a solution to hide it?

[Shagon94]

You can use https://github.com/thomasloven/lovelace-card-mod with the above CSS, confirmed it works.

[karolx91]

Thanks for that. I realise now that it only works if compact mode is set to false. What I am really trying to do is remove that panel altogether as with my edited pic on Jan 7th.

With card-mod you can hide every part of data. First you must conifgure card-mod (https://github.com/thomasloven/lovelace-card-mod). I hide PM2,5 and slider with this code:

card_mod: style: | ha-card > div.preview > div.controls > div > div { visibility: hidden} ha-card > div.preview > div.controls > div.slider > round-slider { visibility: hidden}

[Tockerz]

With card-mod you can hide every part of data. First you must conifgure card-mod (https://github.com/thomasloven/lovelace-card-mod). I hide PM2,5 and slider with this code:

As with my previous post, this works fine in normal mode, but not in compact mode which is what I am trying to run. WIth compact mode set to true, the card-mod hiding does not work - the AQI remains.

[karolx91]

With card-mod you can hide every part of data. First you must conifgure card-mod (https://github.com/thomasloven/lovelace-card-mod). I hide PM2,5 and slider with this code:

As with my previous post, this works fine in normal mode, but not in compact mode which is what I am trying to run. WIth compact mode set to true, the card-mod hiding does not work - the AQI remains.

In compact mode also works.

ha-card > div.preview > div.controls > div.current-aqi { visibility: hidden}

[Tockerz]

Yes that works to hide AQI for me (thanks!!) but does not remove the dead space unfortunately. Don't suppose that is something card_mod can handle?

[hflocki]

card_mod: style: | ha-card > div.preview > div.controls > div > div { visibility: hidden}

I use it like this to minimize the gap

card_mod:
  style: |
    ha-card > div.preview > div.controls {
    visibility: hidden; height: 0px}

[Tockerz]

I use it like this to minimize the gap

card_mod:
  style: |
    ha-card > div.preview > div.controls {
    visibility: hidden; height: 0px}

This is the solution for me - thanks so much!

[github-actions[bot]]

There hasn't been any activity on this issue recently. This issue has now been marked as stale and will be closed if no further activity occurs. Please, update to the latest version and check if that solves the issue. Thank you for your contributions!

[github-actions[bot]]

This issue was closed because it has been stalled for 30 days with no activity. Please open a new issue if the issue is still relevant, linking to this one.