Compte a rebours

Entraide Home Assistant
1

Bonjour,

Mon problème

Nous partons en croisière au mois de mai et je cherche a faire un compte a rebours avant le départ mais je n’y arrive pas. Est ce que l’un d’entre vous aurait quelque chose pour me mettre sur la bonne voie?

Amicalement

2

Regarde ici :

3

Et quelque chose comme ça ?
rianadon/timer-bar-card: A progress bar display for Home Assistant timers

4

Merci c’est bien ca a premiere vu. :slight_smile:

5

C’est ok pour le code. Par contre je veux mettre une image de fond et la, c’est le drame.

type: markdown
style: |
  ha-card {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/7/78/MSC_Opera.jpg');
    background-size: cover;
    background-position: center;
    color: white;
    padding: 20px;
    height: 200px;  # Ajuste la hauteur si nécessaire
  }
content: |
  {% set end_date = as_timestamp(strptime('2025-05-04 12:00', '%Y-%m-%d %H:%M')) %}
  {% set today = as_timestamp(now()) %}
  {% set difference = (end_date - today) %}
  {% set days = (difference // 86400) %}
  {% set hours = ((difference % 86400) // 3600) %}
  {% set minutes = ((difference % 3600) // 60) %}
  Il me reste {{ days }} jours, {{ hours }} heures et {{ minutes }} minutes
6

Bonjour,
il te manque card_mod:.

image
image1010×477 107 KB

type: markdown
content: |
  {% set end_date = as_timestamp(strptime('2025-05-04 12:00', '%Y-%m-%d %H:%M')) %}
  {% set today = as_timestamp(now()) %}
  {% set difference = (end_date - today) %}
  {% set days = (difference // 86400) %}
  {% set hours = ((difference % 86400) // 3600) %}
  {% set minutes = ((difference % 3600) // 60) %}
  Il me reste {{ days }} jours, {{ hours }} heures et {{ minutes }} minutes
card_mod:
  style: |
    ha-card {
      background-image: url('https://upload.wikimedia.org/wikipedia/commons/7/78/MSC_Opera.jpg');
      background-size: cover;
      background-position: center;
      color: white;
      padding: 20px;
      height: 200px;  # Ajuste la hauteur si nécessaire
    }
7

Merci Mr…

Derniere question, comment bouger le texte de droite ou gauche?

8

Tu peux utiliser text-align.
tu as en choix:

text-align: left;
text-align: right;
text-align: center;
text-align: justify;
text-align: justify-all;
text-align: start;
text-align: end;
text-align: match-parent;

ou tu peux utiliser margin-left ou margin-right avec une valeur en px.

exemple:

card_mod:
  style:
    ha-markdown$: |
      ha-markdown-element>p {
        text-align: center;
      }
    .: |
      ha-card {
        background-image: url('https://upload.wikimedia.org/wikipedia/commons/7/78/MSC_Opera.jpg');
        background-size: cover;
        background-position: center;
        color: white;
        padding: 20px;
        height: 200px;  # Ajuste la hauteur si nécessaire
      }
9

Merci beaucoup pour votre aide.