Lovelace - Design de Card´s

Dashboard
,
#1

Estou tentando melhor a estéticas dos meus Cartões. Já uso o Custom Buttons algum tempo e hoje resolvi melhorar uns detalhes, aí veio algumas duvidas:

  • Gostaria de aumentar o espaço entre os botões;
  • Queria que o contorno do botão somente mudasse a cor quando o mesmo estive ligado.

Como está minha tela agora:

Tela%20Botoes
Tela%20Botoes773×705 157 KB

o código do card abaixo:

- entity: switch.sonoff_1000467XXX
                show_state: false
                name: Tomada S26
                show_state:
                state:
                  - styles:
                      card:
                        - filter: opacity(95%)
                      state:
                        - color: '#616161'
                    value: 'off'
                  - styles:
                      card:
                        - filter: opacity(40%)
                        - color: '#5D4037'
                    value: unavailable
                  - styles:
                      state:
                        - color: var(--secondary-text-color)
                    value: 'on'
                styles:
                
                  card:
                    - -webkit-box-shadow: 0px 0px 9px 3px var(--button-card-light-color)
                    - box-shadow: 0px 0px 9px 3px var(--button-card-light-color)
                    
                    - height: 150px
                    - width: 250px
                  name:
                    - font-weight: 500
                    - font-size: 14px
                  state:
                    - font-size: 12px
                style: |
                  ha-card {
                  border-radius: 20px;
                  background: rgba(11, 11, 11, 0.6);
                  }    
                type: 'custom:button-card'  
                
                          
            type: horizontal-stack  
        type: vertical-stack

Obs: não coloquei ainda o “contorno” em todos os botoes e ainda não sei se vou deixar quadrado ou boleado.

1 curtida
#2

Uma das perguntas que fiz, consegui resolver. Somente “acender” o contorno do botão quando estiver ligado.

#3

Olá tinha como o amigo colocar todos os código completo de toda a configuração desse card. Grato!

Valeuuu.

#4

Pessoal, sou novo tanto no HA quanto no fórum, então não sei se aqui seria a melhor forma de compartilhar minha dificuldade, pois acredito que não consigo criar um tópico ainda.

Mas dizendo do problema em si, sou somente eu que estou tendo problemas com o custom button-card? Percebi que ele na nova atualização do HA parou de funcionar. Então fiz um downgrade pra versão anterior esperando uma atualização do button-card. Porém, estou com atualizações pendentes e já parou de funcionar novamente. Percebi tb que no chrome dava erro e no opera não tinha problema. Depois o Opera tb ficou com o mesmo problema. E no safari, que acesso via tablet e celular, estão ok. Tem algo que posso fazer? Estou quase desistindo do button-card… abraços a todos e desde já agradeço!