mod2

mod2

type: entities
title: Rozmiar
card_mod:
  style: |
    ha-card .card-header {
      font-size: 35px;
      color: red;
    }
entities:
  - entity: sun.sun
    name: Standardowy rozmiar
    secondary_info: last-changed
  - entity: sun.sun
    name: Rozmiar dla całego rzędu
    secondary_info: last-changed
    card_mod:
      style: |
        :host {
          font-size: 25px;
          color: red;
        }
  - entity: sun.sun
    name: Rozmiar dla imienia i informacji drugorzędnych
    secondary_info: last-changed
    card_mod:
      style:
        hui-generic-entity-row:
          $: |
            .info.pointer {
              font-size: 10px;
              color: red;
            }
  - entity: sun.sun
    name: Rozmiar dla imienia i informacji_dodatkowych (inne)
    secondary_info: last-changed
    card_mod:
      style:
        hui-generic-entity-row:
          $:
            .info.pointer: |
              .secondary ha-relative-time {
                color: green;
                font-size: 25px;
              }
            .: |
              .info.pointer {
                color: red;
                font-size: 8px;
              }
  - entity: sun.sun
    name: Rozmiar tylko dla nazwy
    secondary_info: last-changed
    card_mod:
      style:
        hui-generic-entity-row:
          $:
            .info.pointer: |
              .secondary ha-relative-time {
                color: orange;
                font-size: var(--mdc-typography-body1-font-size, 1rem);
              }
            .: |
              .info.pointer {
                color: red;
                font-size: 8px;
              }
  - entity: sun.sun
    name: Rozmiar za wartość
    secondary_info: last-changed
    card_mod:
      style:
        hui-generic-entity-row $: |
          .text-content {
            font-size: 10px;
            color: red;
          }
  - entity: sun.sun
    name: '!!!! Rozmiar dla wartości (bez sec_info) !!!!'
    card_mod:
      style:
        hui-generic-entity-row $: |
          .text-content.pointer:not(.info) {
            font-size: 10px;
            color: red;
          }
  - entity: sun.sun
    name: Rozmiar dla informacji_dodatkowych
    secondary_info: last-changed
    card_mod:
      style:
        hui-generic-entity-row:
          $:
            .info.pointer .secondary: |
              ha-relative-time {
                font-size: 20px;
                color: green !important;
              }
  - entity: sun.sun
    name: swinging
    icon: mdi:bell
    style:
      hui-generic-entity-row:
        $: |
          state-badge {
            color: red;
            animation: wobbling 1s linear infinite alternate;
          }
          @keyframes wobbling {
            0% {
              transform: rotate(-45deg);
            }
            100% {
              transform: rotate(+45deg);
            }
          }
  - entity: sun.sun
    name: coloring
    style:
      hui-generic-entity-row:
        $: |
          state-badge {
            animation: coloring 8s linear infinite alternate;
          }
          @keyframes coloring {
            0% {
              color: red;
            }
            17% {
              color: orange;
            }
            34% {
              color: yellow;
            }
            51% {
              color: green;
            }
            68% {
              color: lightblue;
            }
            85% {
              color: blue;
            }
            100% {
              color: violet;
            }
          }
  - entity: sun.sun
    name: resizing
    icon: mdi:radio-tower
    style:
      hui-generic-entity-row:
        $: |
          state-badge {
            animation: resizing 1s linear infinite alternate;
          }
          @keyframes resizing {
            0% {
              --mdc-icon-size: 10px;
            }
            25% {
              --mdc-icon-size: 15px;
            }
            50% {
              --mdc-icon-size: 20px;
            }
            75% {
              --mdc-icon-size: 26px;
            }
            100% {
              --mdc-icon-size: 32px;
            }
          }
  - entity: sun.sun
    name: stretching 1
    icon: mdi:bus-side
    style:
      hui-generic-entity-row:
        $: |
          state-badge {
            animation: stretching 1s linear infinite alternate;
          }
          @keyframes stretching {
            0% {
              transform: scaleX(0.5);
            }
            100% {
              transform: scaleX(2.0);
            }
          }
  - entity: sun.sun
    name: stretching 2
    icon: mdi:human-handsup
    style:
      hui-generic-entity-row:
        $: |
          state-badge {
            animation: stretching 1s linear infinite alternate;
          }
          @keyframes stretching {
            0% {
              transform: scaleY(0.5);
            }
            100% {
              transform: scaleY(2.0);
            }
          }
  - entity: sun.sun
    name: flipping
    icon: mdi:timer-sand
    style:
      hui-generic-entity-row:
        $: |
          state-badge {
            animation: flipping 1s linear infinite;
          }
          @keyframes flipping {
            0% {
              transform: rotateX(0deg);
            }
            100% {
              transform: rotateX(360deg);
            }
          }
  - entity: sun.sun
    name: shifting
    icon: mdi:arrow-left-right
    style:
      hui-generic-entity-row:
        $: |
          state-badge {
            animation: shifting 1s linear infinite alternate;
          }
          @keyframes shifting {
            0% {
              transform: translate(-5px,0);
            }
            100% {
              transform: translate(5px,0);
            }
          }
  - entity: sun.sun
    name: jumping
    icon: mdi:arrow-up-down
    style:
      hui-generic-entity-row:
        $: |
          state-badge {
            animation: jumping 1s linear infinite alternate;
          }
          @keyframes jumping {
            0% {
              transform: translate(0,-5px);
            }
            100% {
              transform: translate(0,5px);
            }
          }
  - entity: sun.sun
    name: blinking
    style:
      hui-generic-entity-row:
        $: |
          state-badge {
            animation: disappear 1s linear infinite alternate;
          }
          @keyframes disappear {
            0% {
              opacity: 0;
            }
            100% {
              opacity: 1;
            }
          }
  - entity: cover.blinds_curtain
    card_mod:
      style: |
        :host {
          color: green;
        }
  - entity: cover.blinds_curtain
    card_mod:
      style: |
        :host {
          --paper-item-icon-color: cyan;
        }
  - entity: cover.blinds_curtain
    card_mod:
      style:
        hui-generic-entity-row:
          $: |
            state-badge {
              color: yellow;
            }
  - entity: cover.blinds_curtain
    card_mod:
      style:
        hui-generic-entity-row ha-cover-controls:
          $: |
            .state ha-icon-button {
              color: orange;
            }
  - entity: cover.blinds_curtain
    card_mod:
      style:
        hui-generic-entity-row ha-cover-controls:
          $: |
            .state ha-icon-button:nth-child(1) {
              color: orange;
            }
            .state ha-icon-button:nth-child(2) {
              color: red;
            }
            .state ha-icon-button:nth-child(3) {
              color: magenta;
            }
  - entity: cover.blinds_curtain
    card_mod:
      style:
        hui-generic-entity-row ha-cover-controls:
          $: |
            .state ha-icon-button:nth-child(1) {
              color: orange;
            }
            .state ha-icon-button:nth-child(2) {
              color: red;
            }
            .state ha-icon-button:nth-child(3) {
              color: magenta;
            }
        .: |
          :host {
            --paper-item-icon-color: cyan;
            color: green;
          }