Open ildar170975 opened 2 years ago
Good work, Thomas!
I have tested it yesterday, and it still is (seemingly randomly) failing for me. Especially on first load, then after e.g. changing tabs or rotating my phone the styles are applied correctly.
@ildar170975 Did you test the latest version already? Did it solve everything for you? The reason I'm asking is that I'm wondering if I'm encountering a bug that is just very spicific to my personal configuration right now.
Not sure if it will help, but this is one of the configrations where I am encountering it: https://raw.githubusercontent.com/PronkMedia/Home-Assistant-Config/master/lovelace/views/home.yaml So in this file for example the rotation of the icons is not always applied on first load.
Did you test the latest version already?
Yes, right now I rechecked it with HA 2022.6.1 & card-mod 3.1.5. Win10x64, Chrome. Works OK.
iPhone 5S, iOS 12.5.5
iPad Air 2, iOS 15.4
Style is NOT applied after refresh.
Exactly what is described here:
My fault. Did not check it with iOS. Frankly speaking - iOS Companion App seems too buggy for me, do not use usually...
Many thanks for your quick reply @ildar170975! That case is indeed still failing for me too. So if a conditional row is/should be displayed on initial page load, the style is not applied for me. I can reproduce it on desktop (latest Chrome) with hard refreshing the page and on Android mobile browser (latest Chrome).
@thomasloven Could you please consider re-opening this issue? As it looks like this is not completely fixed.
Did not check it with iOS.
For the record:
type: vertical-stack
title: conditional row (Problem 142)
cards:
- type: entities
entities:
- input_boolean.test_boolean
- type: entities
entities:
- sun.sun
- type: conditional
conditions:
- entity: input_boolean.test_boolean
state: 'on'
row:
entity: sun.sun
icon: mdi:desk-lamp
name: Lamp
card_mod:
style:
hui-simple-entity-row $: |
hui-generic-entity-row {
text-indent: 45px;
color: red;
}
- entity: sun.sun
Please reopen. Still there are issues with a conditional element in Picture elements card (PE):
Here is a PE card has 1 conditional element.
Usually it looses its styling after a page refresh.
type: picture-elements
image: /local/images/test/white.jpg
elements:
- type: conditional
conditions:
- entity: input_boolean.test_boolean
state: 'on'
elements:
- type: state-label
entity: sun.sun
style:
top: 17%
left: 75%
card_mod:
style:
hui-state-label-element:
$: |
div {
color: red;
}
Observed in 2023.10.2 + card-mod 3.2.3: -- Win10+Chrome (118.0.5993.118); -- iOS Companion App (iOS 15.x).
Note that it happens when we need to go into shadowRoot. If we do not - the style is STABLE (but another problem occurs).
I think I'm see this issue in the entities card as well. Here is the card I have:
Here is the DOM structure:
I've tried using :host
, hui-conditional-row $
and hui-sensor-entity-row $
in the below code. Nothing seems to work to change the icon color:
- type: conditional
conditions:
- entity: sensor.cph50_charging_cable
state: "Plugged In"
row:
entity: sensor.cph50_charger_state
name: "Charging Status"
card_mod:
style:
hui-conditional-row$: |
hui-generic-entity-row {
--card-mod-icon-color: var(--blue-color);
}
row:
entity: sensor.cph50_charger_state
name: "Charging Status"
card_mod:
style:
hui-conditional-row$: |
Scroll up a bit for a working code with Conditional row.
--card-mod-icon-color
.@ildar170975 you were right, thanks for the help! I'm using this code and getting the results I want:
- type: conditional
conditions:
- entity: sensor.cph50_charging_cable
state: "Plugged In"
row:
entity: sensor.cph50_charger_state
name: "Charging Status"
card_mod:
style:
hui-sensor-entity-row $: |
hui-generic-entity-row {
{% if is_state('sensor.cph50_charger_state', 'Not Charging') or is_state('sensor.cph50_charger_state', 'In Use') %}
--card-mod-icon-color: var(--blue-color);
{% elif is_state('sensor.cph50_charger_state', 'Fully Charged') %}
--card-mod-icon-color: var(--success-color);
{% else %}
--card-mod-icon-color: var(--state-unavailable-color);
{% endif %};
}
@curtisbarnard Good, but check if that issue with "--card-mod-icon-color" is observed. Hopefully it had been fixed already.
I think I may be dealing with this bug also.
type: conditional
conditions:
- condition: state
entity: sensor.mealie_1_name
state_not: unknown
card:
type: custom:config-template-card
variables:
DAY: states['sensor.mealie_1_day'].state
TYPE: states['sensor.mealie_1_type'].state
ID: states['sensor.mealie_1_id'].state
entities:
- sensor.mealie_1_day
- sensor.mealie_1_type
- sensor.mealie_1_id
card:
type: picture-entity
show_state: true
show_name: true
camera_view: auto
entity: sensor.mealie_1_name
name: ${TYPE[0].toUpperCase() + TYPE.slice(1) + " " + DAY}
camera_image: camera.mealie_1_image
tap_action:
action: url
url_path: ${"https://foobar.com/g/home/r/" + ID}
card_mod:
style: |
ha-card {
max-height: 300px !important;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
}
My Home Assistant version: 2022.5.4 Chrome, Win10. Safary, OS X 10.15.1.
My lovelace configuration method (GUI or yaml): storage/yaml
What I am doing: Applying a style to conditional row inside Entities card.
What I expected to happen: The style is applied always.
What happened instead: The style sometimes is not applied.
The problem was also described in the Community card-mod thread:
Minimal steps to reproduce:
So far it should work fine. Now a problem part:
Error messages from the browser console: No.
By putting an X in the boxes ([]) below, I indicate that I:
[] Understand that this is a channel for reporting bugs, not a support forum (https://community.home-assistant.io/).
[] Have made sure I am using the latest version of the plugin.
[] Have followed the troubleshooting steps of the "Common Problems" section of https://github.com/thomasloven/hass-config/wiki/Lovelace-Plugins.
[] Understand that leaving one or more boxes unticked or failure to follow the template above may increase the time required to handle my bug-report, or cause it to be closed without further action.