How to globally reduce line spacing between entities in all entity cards?

Configuration Frontend
1

I am currently able to explicitly specify line spacing between entities in entity cards by adding a card_mod style to each entity like below (thanks to this post)

  - type: entities
    entities:
      - type: attribute
        entity: sensor.threadfin_status
        name: Active streams
        card_mod: &ref_0
          style: |
            hui-generic-entity-row {
              height: 25px;
            }
        attribute: streams.active
      - type: attribute
        entity: sensor.threadfin_status
        card_mod: *ref_0
        name: All streams
        attribute: streams.all
      - type: attribute
        entity: sensor.threadfin_status
        card_mod: *ref_0
        name: XEPG streams
        attribute: streams.xepg
    title: Threadfin

How do I globally change line spacing for ALL my entity cards via my custom Lovelace theme? I tried appending the hui-generic-entity-row mod to the last part of my theme code below… however, it’s not making any difference to the way my cards look. What am I missing?

mycustomtheme.yaml

.
.
.
  card-mod-theme: mycustomtheme
  header-height: 56px 
  card-mod-root: |
    .edit-mode, app-header, app-toolbar {
      background: var(--app-header-background-color) !important;
      color: var(--primary-text-color) !important;
    }
    ha-tabs {
      --paper-tabs-selection-bar-color: var(--primary-color) !important;
    }
    paper-tab[aria-selected=true] {
      color: var(--primary-color) !important;
    }
    hui-generic-entity-row {
      height: 25px;
    }
2

This is a wrong place for this definition.
You placed it inside “card-mod-root”, but it must be inside “card-mod-row-yaml” (or “card-mod-row”):

  card-mod-row-yaml: |
    .: |
      hui-generic-entity-row {
        height: 25px;
      }

But it may not work for custom rows like template-entity-row.

1 Like
3

IMHO discussing these things in a dedicated already present card-mod theme thread is a better way.