Compass abbreviation not hiding and not colored

[Tom-ahawk]

Using the card for the sun and moon. When hiding the sun object and state the abbreviation is still displayed (SW). This becomes confusing when the sun goes down since the moon object and state is still up and displaying.

1. When state is hidden the abbreviation should also be hidden for that sensor.
2. The abbreviation value does not get the same color as the state value for a sensor. When more than one sensor this gets confusing.

->

  - type: custom:compass-card
    header:
      title:
        value: Sun and Moon
    indicator_sensors:
      - sensor: sun.sun
        attribute: azimuth
        indicator:
          type: circle
          color: orange
          show: false
          dynamic_style:
            sensor: sun.sun
            attribute: elevation
            bands:
              - from_value: 0
                show: true
      - sensor: sensor.moon_api
        attribute: moon_azimuth
        indicator:
          type: circle
          color: black
          show: false
          dynamic_style:
            sensor: sensor.moon_api
            attribute: moon_altitude
            bands:
              - from_value: 0
                show: true
    value_sensors:
      - sensor: sun.sun
        attribute: azimuth
        units: °
        state_value:
          show: false
          dynamic_style:
            sensor: sun.sun
            attribute: elevation
            bands:
              - from_value: 0
                show: true
                color: orange
      - sensor: sensor.moon_api
        attribute: moon_azimuth
        units: °
        state_value:
          show: false
          dynamic_style:
            sensor: sensor.moon_api
            attribute: moon_altitude
            bands:
              - from_value: 0
                show: true
                color: gray
    compass:
      circle:
        color: '#4169E1'
        background_opacity: null
      north:
        show: true
        color: red
      east:
        show: true
      west:
        show: true
      south:
        show: true

[tomvanswam]

The bug is more in the readme, as it does not specifically state that only the first value indicator sensor is used to display the abbreviation of. However, having the first shown indicator sensor also show its abbreviation is not a bad idea.

[heinemannj]

I fully agree that the actual abbreviation logic is really confusing, if you have multiple sensor definitions.

• When state is hidden the abbreviation should also be hidden for that sensor.
• The abbreviation value does not get the same color as the state value for a sensor. When more than one sensor this gets confusing.

Maybe a configuration parameter to hide the compass abbreviation make sense. At least the abbreviation color should match to the sensor color.

[tomvanswam]

Maybe a configuration parameter to hide the compass abbreviation make sense. At least the abbreviation color should match to the sensor color.

This is possible, in maybe a less ideal fashion.

  - sensor: sun.sun
    attribute: azimuth
    indicator:
      type: circle
    state_abbreviation:
      show: false

Should hide the abbreviation and you could add the same dynamic_style to the state_abbreviation as the indicator sensor, making it color the same way.

[heinemannj]

Thanks for pointing me into the right direction - now it works in a sufficient way:

• hide option on both indicator_sensors is working
• color option too
• styling via card_mod was painful but also possible

card_mod:
  style: |
    ha-card {
      height: 160px;
    }
    .indicator-sensors {
      font-size: 12px !important;
      line-height: 1em !important;
    }
    .sensor-0 {
      height: 1em !important;
    }
    .sensor-0 .value {
      font-size: 12px !important;
      height: 1em !important;
    }
    .sensor-1 {
      height: 1em !important;
    }
    .sensor-1 .value {
      font-size: 12px !important;
      height: 1em !important;
    }

type: custom:compass-card
indicator_sensors:
  - sensor: sun.sun
    attribute: azimuth
    indicator:
      type: circle
      color: orange
      show: false
      dynamic_style:
        sensor: sun.sun
        attribute: elevation
        bands:
          - from_value: -10
            show: true
    state_abbreviation:
      color: orange
      show: false
      dynamic_style:
        sensor: sun.sun
        attribute: elevation
        bands:
          - from_value: -10
            show: true
  - sensor: sensor.astroweather_moon_azimuth
    indicator:
      type: circle
      color: gray
      show: false
      dynamic_style:
        sensor: sensor.astroweather_moon_altitude
        bands:
          - from_value: -10
            show: true
    state_abbreviation:
      color: gray
      show: false
      dynamic_style:
        sensor: sensor.astroweather_moon_altitude
        bands:
          - from_value: -10
            show: true
value_sensors:
  - sensor: sun.sun
    attribute: elevation
    decimals: 1
    units: °
    state_value:
      show: false
      dynamic_style:
        sensor: sun.sun
        attribute: elevation
        bands:
          - from_value: -10
            show: true
            color: orange
  - sensor: sensor.astroweather_moon_altitude
    units: °
    decimals: 1
    state_value:
      show: false
      dynamic_style:
        sensor: sensor.astroweather_moon_altitude
        bands:
          - from_value: -10
            show: true
            color: gray
compass:
  circle:
    background_opacity: null
    dynamic_style:
      sensor: sensor.current_uv_index
      bands:
        - from_value: 3
          color: yellow
        - from_value: 6
          color: orange
        - from_value: 8
          color: red
        - from_value: 11
          color: purple
  north:
    show: true
    offset: 221
    dynamic_style:
      sensor: sensor.current_uv_index
      bands:
        - from_value: 3
          color: yellow
        - from_value: 6
          color: orange
        - from_value: 8
          color: red
        - from_value: 11
          color: purple
  east:
    show: true
    dynamic_style:
      sensor: sensor.current_uv_index
      bands:
        - from_value: 3
          color: yellow
        - from_value: 6
          color: orange
        - from_value: 8
          color: red
        - from_value: 11
          color: purple
  west:
    show: true
    dynamic_style:
      sensor: sensor.current_uv_index
      bands:
        - from_value: 3
          color: yellow
        - from_value: 6
          color: orange
        - from_value: 8
          color: red
        - from_value: 11
          color: purple
  south:
    show: true
    dynamic_style:
      sensor: sensor.current_uv_index
      bands:
        - from_value: 3
          color: yellow
        - from_value: 6
          color: orange
        - from_value: 8
          color: red
        - from_value: 11
          color: purple
tap_action:
  entity: sun.sun
language: de