Mise en forme input_text

Bonjour à tous

Je cherche à afficher une information texte que j’ai stocké dans un input_text pour le moment via un flow Node Red.
Vous pouvez voir l’affichage que je fais aujourd’hui sur la vue PC

la vue téléphone donne ceci par contre

On voit clairement sur la vue téléphone que le texte est « mangé »

Le code de la carte pour afficher ceci est le suivant :

type: custom:button-card
entity: input_text.piscine_heure_filtrations
name: |
  [[[ return states['input_text.piscine_heure_filtrations'].state ]]]
styles:
  name:
    - font-size: 18px
    - font-weight: bold
    - color: var(--text_on)
    - justify-self: start
    - height: 25px
  card:
    - font-family: Avenir
    - height: 35px
    - padding: 01%
    - border-radius: 0px
    - line-height: 100%
    - '--ha-card-border-width': 0px
style:
  .: |
    ha-card {
        --ha-card-background: none !important;
        box-shadow: none !important;
        font-family: Avenir
        border-width: 0px
    }

Ma question est :

  • Comment peut faire pour passer le texte à la ligne par exemple après le « et »

euh en fait c’est mes questions :slight_smile:

  • Comment faire de la mise en forme ?
  • Quel carte est la plus appropriée pour afficher jutse de l’info texte comme ceci ?

As tu essayé de mettre le texte dans une markdown card ?

Pas du tout tester je sais même pas si j’ai ce type de carte :slight_smile:

Bon je viens de mettre ceci :

<font size="4">
{% if is_state('switch.pc_piscine_filtration', 'on') %}
  La pompe de filtration est à l'arrêt.
{% else %}
  La pompe de filtration est en marche.
{% endif %}
{{ states('input_text.piscine_heure_filtrations') }}
T° = {{ states('sensor.temp_piscine_temperature') }} °C
</center></font>

Mais en fait mon input_text reçoit les valeurs suivantes directement :
La piscine ne fonctionne plus !

  • Filtration de 8h00 à 12h00 et de 13h00 à 19h00
  • Filtration de 9h00 à 12h00 et de 13h00 à 17h00
  • Filtration de 10h00 à 12h00 et de 13h00 à 16h00
  • Filtration de 8h00 à 12h00

Donc finalement il faudrait avec ta proposition que je mette mes heures dans des champs texte

  • heure_debut_matin
  • heure_fin_matin
  • heure_debut_apresmidi
  • heure_fin_apresmidi

Et que je fasse une mise en page avec une markdown card ?
Du coup ma question suivante c’est quand le champ est null ou vide comme pour le dernier cas par exemple peut on faire en sorte que rien ne s’affiche plutôt que « none » ?

Oui il faut faire une mise en page, mais le mardown est basique : c’est le format d’édition que l’on utilise pour nos posts dans discoursehub.

Plus d’infos ici sur la carte :

Elle supporte les templates, pas besoin de mettre les infos dans des input_text, juste mettre les infos dans un template dans la carte, sous content. Tu peux même mettre le texte en couleur avec une balise ha-alert ! Elle doit être aussi responsive et supporter le wrap sur un mobile (a tester).

Pour avoir un message vide, en cas de pb, tu peux toujours mettre juste un espace ou un point, mais je ne pense pas que ce soit nécessaire.

Merci pour les infos
Bon faut que je revisite le flow Node Red pour voir les infos sur j’envoie à HA du coup.

Là j’envoie la phrase entière mais faut que j’envoie juste les heures et je fais la mise en forme avec cette carte via template et balise.

Je vais voir ça

Tu doit surcharger cette propriété quelque part,…

overflow: "";
white-space: wrap;

Mais j’avou que créer une entité text pour ça c’est un poil toomuch.
Mais on peut pas mettre des titre sur les Grid card ou row card ?

Alors je ne veux pas mettre de titre
Je veux juste avoir une info texte de l’état dans lequel se trouve la pompe et sur quelle plage horaire surtout

D’accord, du coup maintenant tu connais les 2 propriétés css qu’il te faut changer qui empêche le retour a la ligne

@Uowis
Je n’ai pas compris ton dernier post !

Je ne veux pas empêcher le retour à la ligne, je veux justement envoyer à la ligne mon texte présent dans l’input_text.

J’ai par exemple dans l’input_text = Filtration de 08h00 à 12h00 et de 13h00 à 19h00

et je veux en affichage que cela s’écrive sur deux ligne par exemple voir 3 :µ

Filtration de 08h00 à 12h00

et de 13h00 à 19h00

ou

Filtration de

08h00 à 12h00

et de

13h00 à 19h00

Par exemple

ce que j’ai compris c’est qu’il valait peut être mieux que je récupère les infos sous 4 entrées heures afin de faire un peu ce que je veux (ce que je peux :wink: ) avec la markdown card

Et ça ça ne fonctionne pas :
image ?

ah et bien même pas pensé à ça :slight_smile:
Pas de dextérité sur le codage :frowning: pas les réflexes

image

reste à centrer sur la carte et modifier la source de cette input_text et cela devrait faire l’affaire

oui oui c’est ce que te disais :
il faut surcharger cette propriétés css qui empêche le retour a la ligne quelque part sur ton élément de texte :

white-space: nowrap;

par :

white-space: normal;

Alors c’est très gentil de me donner la propriété !
Mais là c’est comme si tu me parlais chinois je ne vois pas où je dois jouer avec ça dans mon bout de carte
Il va falloir que je creuse un peu

desolé je pensais que tu savais ce que tu faisait avec le css dans ta carte :stuck_out_tongue: :


type: custom:button-card
entity: input_datetime.energy_viewer
name: qqssdfsdfsdfsdfsdfsdfsdfsdfsdfsdfsd df sdfsdf qsdf sdf qsdfqsdfqsdfq
styles:
  name:
    - font-size: 18px
    - font-weight: bold
    - color: var(--text_on)
    - justify-self: start
    - height: auto
  card:
    - font-family: Avenir
    - height: auto
    - padding: 01%
    - border-radius: 0px
    - line-height: 100%
    - '--ha-card-border-width': 0px
style:
  .: |
    ha-card {
        --ha-card-background: none !important;
        box-shadow: none !important;
        font-family: Avenir
        border-width: 0px
    }
    ha-card .ellipsis {
      white-space: normal;
    }

pense a changer les height en auto sur les deux éléments