Szybkie wybieranie kolorów dla LED RGB

[artpc (artur)]

Karta szybkiego wyboru kolorów LED.
Wymagany: custom:rgb-light-card z HACS

Zmiana border-radius: 20%; na 20%

Kod:

entities:
  - colors:
      - hs_color:
          - 0
          - 100
      - hs_color:
          - 26
          - 100
      - hs_color:
          - 52
          - 100
      - hs_color:
          - 78
          - 100
      - hs_color:
          - 95
          - 100
      - hs_color:
          - 140
          - 100
      - hs_color:
          - 170
          - 100
      - hs_color:
          - 182
          - 100
      - hs_color:
          - 208
          - 100
      - hs_color:
          - 234
          - 100
      - hs_color:
          - 260
          - 100
      - hs_color:
          - 286
          - 100
      - hs_color:
          - 312
          - 100
      - hs_color:
          - 338
          - 100
    debug_cardmod: true
    entity: light.downlight_z_komputer
    justify: center
    size: 13
    style:
      rgb-light-card:
        $:
          wrapper:
            $: |
              :host {
                padding: 0px;
                width: 30px;
              }
    type: custom:rgb-light-card
style:
  .: |
    ha-card {
      background-color: rgba(0,0,0,0);
    }
  rgb-light-card:
    $:
      .: >
        .wrapper { cursor: auto; display: flex; flex-wrap: wrap; transition:
        box-shadow 0.15s ease-in-out; box-shadow: 0 3px 1px -2px rgba(0,0,0,.2),
        0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);} 

        .color-circle { border-radius: 0%; cursor: pointer; transition:
        box-shadow 0s ease-in-out; box-shadow: 0 0px 0px 0px rgba(0,0,0,0), 0
        0px 0px 0 rgba(0,0,0,0), 0 0px 0px 0 rgba(0,0,0,0); } 

        .color-circle:hover { box-shadow: none; } 
      .wrapper:
        style: |
          .wrapper { justify-content: center; margin-bottom: -2.25px; } 
          .wrapper.hidden { display: none; } 
          .color-circle { width: 20px; height: 20px; margin: 0px; } 
type: entities

Manipulacja wyglądem:

.color-circle { border-radius: 10%; cursor: pointer; transition:
        box-shadow 0s ease-in-out; box-shadow: 0 0px 0px 0px rgba(0,0,0,0), 0
        0px 0px 0 rgba(0,0,0,0), 0 0px 0px 0 rgba(0,0,0,0); }