Estilizando o HA com Gifs e Imagens

Tutoriais
,
#1

Fala galera blz?
Um tutorialzinho para deixar o HA mais estiloso, usando gifs e imagens com/sem condições.
Mostrei alguns exemplos de possibilidades, mas da para fazer muito mais!

Bom passatempo pro feriado rsrsrs

Compartilhem o de vcs caso façam =)

5 curtidas
#2

Testando aqui…

SmartSelect_20220907_165507_Home Assistant

3 curtidas
#3

Parabéns!
FIcou mto topppp

#4

@Nilson compartilha o conteúdo por favor…obrigado

#5

Códigos estão na descrição do vídeo manin, só alterar para suas necessidades…
Qualquer coisa posta ae!

1 curtida
#6

Meu Vídeo2

Fiz nas temperaturas aqui, se ficar acima de x temperatura muda pro ícone de calor.

1 curtida
#7

Dei uma atualizada nos ícones aqui também

imagem
imagem828×1792 144 KB

1 curtida
#8

Passa o layout desses cards ai pls =) hahah

*O dos cômodos

#9

Não sei qual a melhor forma de postar aqui, mas segue:

type: custom:stack-in-card
cards:

  • type: custom:mushroom-template-card
    primary: Suíte
    secondary: ‘& Closet’
    picture: >-
    {{ ‘/local/images/cama.png’ if is_state(entity, ‘on’) else
    ‘/local/images/camabw.png’ }}
    entity: light.grupo_suite
    tap_action:
    action: navigate
    navigation_path: suite
    hold_action:
    action: toggle
    fill_container: true
    layout: horizontal
    multiline_secondary: false
    card_mod:
    style: |
    :host([dark-mode]) {
    background: rgba(var(–rgb-primary-background-color), 0.2);
    }
    :host {
    background: rgba(var(–rgb-primary-text-color), 0.025);
    –mush-icon-size: 76px;
    height: 66px;
    margin-left: -18px !important;
    }
  • type: custom:mushroom-chips-card
    chips:
    • type: entity
      entity: media_player.tv_quarto
      icon: mdi:television-classic
      content_info: none
      icon_color: lime
      tap_action:
      action: more-info
    • type: entity
      entity: light.grupo_suite
      icon_color: lime
      icon: mdi:lightbulb
      content_info: none
      tap_action:
      action: toggle
      alignment: end
      card_mod:
      style: |
      ha-card {
      –chip-box-shadow: none;
      –chip-background: none;
      –chip-spacing: 0;
      }
      card_mod:
      style: |
      ha-card {
      height: 102px;
      }
1 curtida
#11

Obrigado por compartilhar

#12

Como você consegue pegar essa informação do dia da semana e data? :grimacing:

#13

Segue

type: custom:mushroom-title-card
title: >-
  {% if now().strftime("%H")|int < 12 %}Bom dia, {% elif
  now().strftime("%H")|int < 18 %}Boa tarde, {% else %}Boa noite, {% endif
  %}{{user}}! 👋🏼
subtitle: >-
  {% set weekday =
  ['segunda-feira','terça-feira','quarta-feira','quinta-feira','sexta-feira','sábado','domingo']
  %}

  {% set months =
  ["Janeiro","Fevereiro","Março","Abril","Maio","Junho","Julho","Agosto","Setembro","Outubro","Novembro","Dezembro"]
  %}

  {% set dt = strptime (now().strftime('%Y-%m-%d  %H:%M:%S',), "%Y-%m-%d 
  %H:%M:%S") %}


  Hoje é {{weekday[dt.weekday()]}}, {{ dt.day}} de {{months[dt.month-1]}} de {{
  dt.year}}.
1 curtida
#14

Cola ali e compartilha a URL que fica filé :slight_smile: