AmoebeLabs / AmoebeLabs/flex-horseshoe-card

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

Đang mở
#76 6 bình luận 0 reaction 0 người được giao Xem trên GitHub
Ngôn ngữ chính
JavaScript
Star
397
Fork
66
Merge trung bình
7 phút
Pull request đã merge (30 ngày)
81

Mô tả

**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)

Hướng dẫn đóng góp

Chưa lập chỉ mục được hướng dẫn đóng góp cho kho mã nguồn này

Đánh giá

Issue này chưa được đánh giá.

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.