# \[CARTE\] text-divider-row - Titre pour vos Carte

**URL:** <https://forum.hacf.fr/t/carte-text-divider-row-titre-pour-vos-carte/4921>\
**Category:** Interface / Lovelace / Thème / Custom Card\
**Created:** [Mai 29, 2021, 7:50 UTC](https://forum.hacf.fr/t/carte-text-divider-row-titre-pour-vos-carte/4921 "2021-05-29T19:50:31Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Felix62](https://forum.hacf.fr/user_avatar/forum.hacf.fr/felix62/32/7858_2.png) [@Felix62](https://forum.hacf.fr/u/Felix62)\
**Post date:** [Mai 29, 2021, 7:50 UTC](https://forum.hacf.fr/t/carte-text-divider-row-titre-pour-vos-carte/4921/1 "2021-05-29T19:50:31Z")

</div>

Bonjour à toutes et à tous,

Je partager aujourd'hui un petit bout de code réaliser récemment avec cette ce Frontend

> **[GitHub - iantrich/text-divider-row: 🗂 Text Divider Row](https://github.com/iantrich/text-divider-row)**
>
> 🗂 Text Divider Row

**Option 1: utiliser Declutering-card (que j'ai présenter ici)**

> [@\[CARTE\] Decluttering-card (reduire ses lignes de code lovelace)](https://forum.hacf.fr/t/carte-decluttering-card-reduiser-vos-lignes-de-code-lovelace/4580):
>
> Bonjour à tous, Je suis nouveau depuis quelques jours sur ce forum et lors d’un échange on m’a invité à partager une astuce pour organiser ou dépoussiérer fichier lovelace.yaml. Nous sommes beaucoup à vouloir découper notre configuration et à repartir proprement dans un dossier a part. exemple: #configuration.yaml group: !include\_dir\_merge\_named group/ automation: !include automations.yaml scene: !include\_dir\_merge\_list scene/ sensor: !include\_dir\_merge\_list sensor/ zone: !include zone/zones.…

```auto
###################################
#### DIVIDER ###
###################################
divider:
  card:
    type: entities
    card_mod:
      style: |
        ha-card {
        background: none;
        box-shadow: none;
        margin-top: -30px;
        margin-bottom: -30px;
        }  
        .card-content {
         padding: 0 0 0 0px;
         margin: 0 0 0 0px;
         box-shadow: none;
         }
    show_header_toggle: false
    entities:
      - type: 'custom:text-divider-row'
        text: '[[text]]'
        card_mod:
          style: |
            :host {
            font-size: 17px;
            text-primary-color: 'var(--primary-text-color)' 
            }   
            .text-divider {
            padding: 0 0 0 0px;
            margin: -5 0 -5 0px;
            box-shadow: none;
            height: 17px;
            }   

```

Dans ce cas il vous suffira simplement de coller dans vos lovelace:

```auto

          - type: custom:decluttering-card
            template: divider
            variables:
              - text: CALENDRIER FAMILIAL #a remplacer par le Titre que vous souhaité.

```

**Option 2:** coller ce code dans votre lovelace.yaml la ou vous souhaiter avoir un titre

```auto
    type: entities
    card_mod:
      style: |
        ha-card {
        background: none;
        box-shadow: none;
        margin-top: -5px;
        margin-bottom: -5px;
        }  
        .card-content {
         padding: 0 0 0 0px;
         margin: 0 0 0 0px;
         box-shadow: none;
        }
        h2.text-divider {
        overflow: inherit;
        margin-top: 0px;
        margin-bottom: 0px;
        }
    show_header_toggle: false
    entities:
      - type: 'custom:text-divider-row'
        text: '[[text]]'
        card_mod:
          style: |
            :host {
            font-size: 17px;
            text-primary-color: 'var(--primary-text-color)' 
            overflow: inherit;
            }   
            h2.text-divider {
            overflow: inherit;
            }
            .text-divider {
            padding: 0 0 0 0px;
            margin: -5 0 -5 0px;
            box-shadow: none;
            overflow: inherit;
            }       
            #states > div > * {
            overflow: inherit;
            }
            h2.text-divider {
            overflow: inherit;
            margin-top: 0px;
            margin-bottom: 0px;
            height: 20px;
            }          

```

Voici un exemple en image:

 ![titre exemple](https://forum.hacf.fr/uploads/default/original/2X/5/50c36cb93fa1f238a7dd47de090d1b4929fb4414.jpeg)

---

<div class="post-metadata">

**Author:** ![barto\_95](https://forum.hacf.fr/user_avatar/forum.hacf.fr/barto_95/32/172_2.png) [@barto\_95](https://forum.hacf.fr/u/barto_95)\
**Post date:** [Mai 31, 2021, 9:23 UTC](https://forum.hacf.fr/t/carte-text-divider-row-titre-pour-vos-carte/4921/2 "2021-05-31T09:23:16Z")

</div>

Merci pour le partage

---

<div class="post-metadata">

**Author:** ![Felix62](https://forum.hacf.fr/user_avatar/forum.hacf.fr/felix62/32/7858_2.png) [@Felix62](https://forum.hacf.fr/u/Felix62)\
**Post date:** [Juin 2, 2021, 9:20 UTC](https://forum.hacf.fr/t/carte-text-divider-row-titre-pour-vos-carte/4921/3 "2021-06-02T21:20:41Z")

</div>

J’ai corrigé quelque erreurs de style non visible au premier regard mais qui peuvent décaler certaines card.

Bonne journée 🙂

---

<div class="post-metadata">

**Author:** ![Schumi](https://forum.hacf.fr/user_avatar/forum.hacf.fr/schumi/32/21330_2.png) [@Schumi](https://forum.hacf.fr/u/Schumi)\
**Post date:** [Juillet 30, 2021, 1:27 UTC](https://forum.hacf.fr/t/carte-text-divider-row-titre-pour-vos-carte/4921/4 "2021-07-30T13:27:49Z")

</div>

Super, merci pour le partage…

Puis-je te demander les infos pour ta page de gauche… ca m’interesse fortement. Les explications ou code pour faire la carte (carte - sensors - etc…)  
j’aimerais tellement avoir ces info en tete de ma pas principale. (date - meteo - anniversaire - fete - etc…)

merci a toi pour les infos !! Bon boulot !

---

<div class="post-metadata">

**Author:** ![Schumi](https://forum.hacf.fr/user_avatar/forum.hacf.fr/schumi/32/21330_2.png) [@Schumi](https://forum.hacf.fr/u/Schumi)\
**Post date:** [Juillet 30, 2021, 2:00 UTC](https://forum.hacf.fr/t/carte-text-divider-row-titre-pour-vos-carte/4921/5 "2021-07-30T14:00:59Z")

</div>

Mille excuses, j’avais pas vu ton autre post. j’ai trouver Merci a toi.

seul truc, c’est pour la fete du jour, la page ne fonctionne pas ! probleme de lien http je suppose.  
si tu as une mise a jour de ce coté la, je suis prenneur !

Encore mille merci !

---

<div class="post-metadata">

**Author:** ![Felix62](https://forum.hacf.fr/user_avatar/forum.hacf.fr/felix62/32/7858_2.png) [@Felix62](https://forum.hacf.fr/u/Felix62)\
**Post date:** [Juillet 30, 2021, 4:45 UTC](https://forum.hacf.fr/t/carte-text-divider-row-titre-pour-vos-carte/4921/6 "2021-07-30T16:45:26Z")

</div>

J’ai arrêter le lien http et j’utilise désormais le code en python présenter dans mon dashboard 🙂

---

<div class="post-metadata">

**Author:** ![Schumi](https://forum.hacf.fr/user_avatar/forum.hacf.fr/schumi/32/21330_2.png) [@Schumi](https://forum.hacf.fr/u/Schumi)\
**Post date:** [Juillet 31, 2021, 10:25 UTC](https://forum.hacf.fr/t/carte-text-divider-row-titre-pour-vos-carte/4921/7 "2021-07-31T10:25:37Z")

</div>

J’ai bien installer l’add-on python et copien le fichier .py dans le bon dossier, mais ma question est:

Comment va tu chercher les info de ton script python pour l’afficher sur ton dashboard ?  
je n’ai pas encore tout compris.  
Merci a toi pour les info et oups, bonne vacances…

---

<div class="post-metadata">

**Author:** ![Felix62](https://forum.hacf.fr/user_avatar/forum.hacf.fr/felix62/32/7858_2.png) [@Felix62](https://forum.hacf.fr/u/Felix62)\
**Post date:** [Août 31, 2021, 12:59 UTC](https://forum.hacf.fr/t/carte-text-divider-row-titre-pour-vos-carte/4921/8 "2021-08-31T12:59:04Z")

</div>

MAJ du code titre pour vos cartes effectué ce jour 🙂