🔹 fold-entity-row - Hide away stuff in entities cards

dimab0 · January 17, 2021, 10:59pm

I think I’m doing everything correctly, but unable to confirm - if “head” is an entity, then am I correct to say that options can not be provided to it? Such as different icon, different state_color, etc. The only workaround seems to be to make head a section or an element card?

Example, I’m trying to set state_color for the head, but has no impact:

type: entities
entities:
  - type: 'custom:fold-entity-row'
    head: group.front_yard_lights
    state_color: true
    entities:
      - entity: light.exterior_front_porch
        icon: 'hass:lightbulb'
      - entity: light.exterior_front_front_door_overhead
      - entity: light.exterior_front_pathway_lights
      - entity: light.exterior_front_mudroom_sconce
      - entity: switch.exterior_front_landscape_lights
        state_color: true
      - entity: switch.exterior_front_driveway_light
        state_color: true
title: Frontyard Test
state_color: true

mkanet · January 21, 2021, 4:45am

Thank you. I’ll give it another shot soon. I just presumed that was a bug.

mkanet · January 21, 2021, 8:34pm

This screenshot should explain the issue. After recreating the entire card from scratch, I was able to reproduce this issue again. Hopefully, it’s something I’m doing wrong. I also tried changing the padding to a greater value (example: padding: 5); however, it still looks the same.

In case, I’m doing something wrong, please let me know how to fix this issue. Otherwise, I’ve opened the issue below:

Mariusthvdb · January 21, 2021, 10:41pm

let me try it with this config:

type: custom:stack-in-card
title: Custom header settings
cards:

  - type: entities
    style: |
      ha-card {
        margin: -16px 0px -16px 0px;
      }
    entities:
     - input_boolean.ch_disabled_mode

  - type: conditional
    conditions:
      - entity: input_boolean.ch_disabled_mode
        state: 'off'
    card:
      type: entities
      entities:
        - type: custom:fold-entity-row
          head:
            type: section
            label: Main options
          padding: 0
          entities:
            - input_boolean.ch_compact_mode
            - input_boolean.ch_footer_mode
            - input_boolean.ch_split_mode
            - input_boolean.ch_chevrons
            - input_boolean.ch_shadow
            - input_boolean.ch_indicator_top
            - input_boolean.ch_hidden_tab_redirect

shows like this:

that’s the way you want it I guess?

not sure about your config, but I guess you didn’t write that manually… give the screenshot

the order is somewhat confusing, and there’s the use of the null which is new for me. please try to rewrite this in the right order of things, and see what gives.

the style of the top entities card only handles the top and bottom margins of that card, so has no influence in your config.

btw this is only a section of a larger card, and they’re all done the same way, showing perfectly.:

so your issue in the repo will (should) be closed, since there’s no bug there, probably a user (config) error

mkanet · January 22, 2021, 7:30pm

Thanks. Yes, I did the whole code by hand since I wasn’t sure how to do it using the GUI. I’ll try changing the order of things and removing NULL. I’ll use your example code as a starting point. I’ll post back my results.

mkanet · January 22, 2021, 11:03pm

@Mariusthvdb, I was able to finally get the code right. It a lot of trial and error before it finally worked for me. Below, is the code that finally worked. I really appreciate your help!

Example2

Mariusthvdb · January 23, 2021, 9:04am

Great. You can even leave out the mode: vertical as that is default

deluxestyle · March 4, 2021, 2:48pm

with the last update (20.0.0) I have now a space on the right side if I use the section type (see screenshot) and as well I have to click the arrow. Before it worked as well on the label

grafik

thomasloven · March 4, 2021, 3:21pm

The space has been fixed in 20.0.1.

Unfortunately, the method for making the fold open and close by clicking on the row has grown unmaintainable and that functionality had to be scrapped.

deluxestyle · March 4, 2021, 3:23pm

thanks for the quick reply.

Mariusthvdb · March 4, 2021, 4:39pm

thanks for the fix Thomas, you were quick! too bad we need to be precise now…
or… can we downgrade.

(asking because I am not sure what the new features/benefits are, and the card didn’t seem to cause any trouble.)

thomasloven · March 4, 2021, 10:15pm

Know what?
I figured out a way.

Look for the new `clickable´ option in 20.0.2.
But the initial guess should be pretty good too, so you probably don’t need it.

@deluxestyle

Mariusthvdb · March 4, 2021, 10:23pm

wow (~~can’t film the actual click, but you’ll~~ see what happens)
thanks!
Mar-04-2021 23-22-33

deluxestyle · March 5, 2021, 8:08am

great. thank you so much

Ildar_Gabdullin · March 17, 2021, 9:31pm

I realized that a vertical spacing between rows is less than a spacing in a Entities card:

Here is a code:

type: horizontal-stack
cards:
  - type: entities
    entities:
      - entity: sun.sun
        secondary_info: last-changed
      - entity: sun.sun
        secondary_info: last-changed
      - entity: sun.sun
        secondary_info: last-changed
      - entity: sun.sun
        secondary_info: last-changed
      - entity: sun.sun
        secondary_info: last-changed
      - entity: sun.sun
        secondary_info: last-changed
  - type: entities
    entities:
      - type: 'custom:fold-entity-row'
        head:
          entity: sun.sun
          secondary_info: last-changed
        padding: 10
        open: true
        clickable: true
        entities:
          - entity: sun.sun
            secondary_info: last-changed
          - entity: sun.sun
            secondary_info: last-changed
          - entity: sun.sun
            secondary_info: last-changed
          - entity: sun.sun
            secondary_info: last-changed
          - entity: sun.sun
            secondary_info: last-changed

I can fix this by card-mod:

        style:
          '#items':
            hui-text-entity-row:
              $: |
                hui-generic-entity-row {
                  margin: 8px 0px;
                }

Now it looks better:

But I would be happy if these margins will be fixed in the card itself )).

The whole code with card-mod:

type: horizontal-stack
cards:
  - type: entities
    entities:
      - entity: sun.sun
        secondary_info: last-changed
      - entity: sun.sun
        secondary_info: last-changed
      - entity: sun.sun
        secondary_info: last-changed
      - entity: sun.sun
        secondary_info: last-changed
      - entity: sun.sun
        secondary_info: last-changed
      - entity: sun.sun
        secondary_info: last-changed
  - type: entities
    entities:
      - type: 'custom:fold-entity-row'
        head:
          entity: sun.sun
          secondary_info: last-changed
        padding: 10
        open: true
        clickable: true
        entities:
          - entity: sun.sun
            secondary_info: last-changed
          - entity: sun.sun
            secondary_info: last-changed
          - entity: sun.sun
            secondary_info: last-changed
          - entity: sun.sun
            secondary_info: last-changed
          - entity: sun.sun
            secondary_info: last-changed
        style:
          '#items':
            hui-text-entity-row:
              $: |
                hui-generic-entity-row {
                  margin: 8px 0px;
                }

Update (20.11.21):
The “tight vertical spacing” problem is solved in fold-entity-row ver. 2.0.12

Mariusthvdb · March 17, 2021, 9:54pm

don’t see that difference here:
left fold-entity-row, right core entities

Ildar_Gabdullin · March 17, 2021, 10:28pm

Really strange.
I see the difference also with old version of fold-entity-row used when I made this post about card-mod.
Here is a pic from that post:

It was w/o a margin even 20.12.20.

May it depend on a theme? I am using stock theme.

farstreet · March 22, 2021, 10:45pm

I am having the same issue, the color of the icon of the head won’t change based on the state.
Were you able to solve this meanwhile? Or has this been identified as a missing feature yet?

Example, the below doesn’t work:

     - type: custom:fold-entity-row
        head: binary_sensor.template_someone_in_bed
        icon: 'mdi:bed'
        name: Bed Occupancy
        state_color: true                     <<< this doesn't work
        entities:
          - domain.name1
          - domain.name2
          - etc

DavidFW1960 · March 23, 2021, 1:04am

padding: 0 will get rid of the margin

Ildar_Gabdullin · March 23, 2021, 4:41am

Wrong.
Second time I am hearing about “padding: 0”…
There is no margin for “padding: 0” & “padding: 10”.

And why these two different things can be connected - left padding & margin between rows?