AmoebeLabs / AmoebeLabs/flex-horseshoe-card

Icon not show on mobile app if horseshow are in conditional card

Ouverte
#76 6 commentaires 0 réactions 0 personnes assignées Voir sur GitHub
Langage dominant
JavaScript
Étoiles
397
Forks
66
Merge moyen
7 min
PR mergées (30 j)
81

Description

**Home Assistant**: 2023.9.3
**Frontend**: 20230911.0
**Home Assistant Mobile App**: 2023.4

I created a condition card with the horseshow card nested.
In the mobile app the icon is not displayed, however in the desktop browser it works correctly.

Ex.
The card is not working properly (the icon does not appear in the mobile app):
```type: conditional
conditions:
- entity: binary_sensor.pdc_visibile
state: 'on'
card:
type: custom:flex-horseshoe-card
entities:
- entity: sensor.potenza_pdc
decimals: 0
name: ' '
area: Esterno
unit: W
tap_action:
action: more-info
- entity: switch.pdc_interruttore_raw
name: PdC
icon: hass:water-boiler
tap_action:
action: call-service
service: switch.toggle
service_data:
entity_id: switch.pdc_interruttore_raw
- entity: group.ts
name: info
icon: hass:information-outline
tap_action:
action: more-info
animations:
entity.1:
- state: 'on'
circles:
- animation_id: 11
styles:
- fill: var(--light-primary-color);
- animation: jello 1s ease-in-out both;
- transform-origin: center;
icons:
- animation_id: 0
styles:
- color: var(--secondary-background-color);
- state: 'off'
circles:
- animation_id: 11
reuse: true
styles:
- transform-origin: center;
- animation: zoomOut 1s ease-out both;
icons:
- animation_id: 0
styles:
- color: var(--light-primary-color);
show:
horseshoe_style: lineargradient
layout:
states:
- id: 0
entity_index: 0
xpos: 50
ypos: 28
uom_font_size: 1.5
styles:
- font-size: 2.5em;
- opacity: 1.0;
names:
- id: 0
entity_index: 0
xpos: 50
ypos: 100
styles:
- font-size: 1.2em;
- opacity: 0.7;
- id: 1
entity_index: 1
xpos: 50
ypos: 95
styles:
- font-size: 1.6em;
- opacity: 0.8;
icons:
- id: 0
animation_id: 0
xpos: 50
ypos: 55
entity_index: 1
icon_size: 3.5
- id: 1
animation_id: 1
xpos: 92
ypos: 12
entity_index: 2
icon_size: 3
styles:
- color: var(--secondary-background-color);
circles:
- id: 0
animation_id: 0
xpos: 50
ypos: 50
radius: 35
styles:
- fill: var(--secondary-background-color);
- id: 1
animation_id: 11
xpos: 50
ypos: 50
radius: 30
entity_index: 1
horseshoe_scale:
min: 0
max: 3000
color: var(--secondary-background-color)
color_stops:
'0': var(--primary-background-color)
'3000': var(--light-primary-color)
horseshoe_state:
width: 12

```

The card works correctly (icon also visible in the mobile app):
```
type: custom:flex-horseshoe-card
entities:
- entity: sensor.potenza_totale_luci
decimals: 0
name: ' '
area: Esterno
unit: W
tap_action:
action: more-info
- entity: light.tutte_le_luci
name: Luci
icon: hass:lightbulb
tap_action:
action: call-service
service: light.toggle
service_data:
entity_id: light.tutte_le_luci
- entity: group.ts
name: info
icon: hass:information-outline
tap_action:
action: more-info
animations:
entity.1:
- state: 'on'
circles:
- animation_id: 11
styles:
- fill: var(--light-primary-color);
- animation: jello 1s ease-in-out both;
- transform-origin: center;
icons:
- animation_id: 0
styles:
- color: var(--secondary-background-color);
- state: 'off'
circles:
- animation_id: 11
reuse: true
styles:
- transform-origin: center;
- animation: zoomOut 1s ease-out both;
icons:
- animation_id: 0
styles:
- color: var(--light-primary-color);
show:
horseshoe_style: lineargradient
layout:
states:
- id: 0
entity_index: 0
xpos: 50
ypos: 28
uom_font_size: 1.5
styles:
- font-size: 2.5em;
- opacity: 1.0;
names:
- id: 0
entity_index: 0
xpos: 50
ypos: 100
styles:
- font-size: 1.2em;
- opacity: 0.7;
- id: 1
entity_index: 1
xpos: 50
ypos: 95
styles:
- font-size: 1.6em;
- opacity: 0.8;
icons:
- id: 0
animation_id: 0
xpos: 50
ypos: 55
entity_index: 1
icon_size: 3.5
- id: 1
animation_id: 1
xpos: 92
ypos: 12
entity_index: 2
icon_size: 3
styles:
- color: var(--secondary-background-color);
circles:
- id: 0
animation_id: 0
xpos: 50
ypos: 50
radius: 35
styles:
- fill: var(--secondary-background-color);
- id: 1
animation_id: 11
xpos: 50
ypos: 50
radius: 30
entity_index: 1
horseshoe_scale:
min: 0
max: 1500
color: var(--secondary-background-color)
color_stops:
'0': var(--primary-background-color)
'1500': var(--light-primary-color)
horseshoe_state:
width: 12

```
SX: icon not visible - DX: icon visibile
![WhatsApp Image 2023-09-29 at 17 11 02](https://github.com/AmoebeLabs/flex-horseshoe-card/assets/7837288/78581ec0-503a-484a-9855-06c65f92b5b1)

Guide de contribution

Aucun guide de contribution indexé pour ce dépôt

Évaluation

Cette issue n'a pas encore été évaluée.

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.