fix: style for icon[loc=right]

[ildar170975]

When a name is hidden and align_icon: right, we can see an icon left-aligned:

  - type: custom:mini-graph-card
    entities:
      - sensor.xxx
    show:
      name: false
    align_icon: right

After the fix:

[akloeckner]

While this seems a straightforward fix, I'm wondering why align_icon: state also right-aligns but uses a different CSS. Should this be consistent? Or is there a reason, it's different?

[ildar170975]

While this seems a straightforward fix, I'm wondering why align_icon: state also right-aligns but uses a different CSS. Should this be consistent? Or is there a reason, it's different?

@akloeckner
Sorry for a long delay.

What we have now:

align_icon: state

align_icon: left

align_icon: right

The align_icon: state case places an icon into the same container as a state.
Note that in align_icon: left/right cases the icon is placed into the same container as a name (which may be missing).
And if a state is missing with align_icon: state - then the icon is not shown at all:

I would say that this is normal that an icon is not shown - because we explicitly "bound" it to a state - which we decided not to show.

Also note that in RTL for align_icon: state an icon will be in a left, a state will be in a right side.

As for align_icon: left/right cases, they should be modified for RTL, this should be a different additional fix.