Bonjour,
Est ce que quelqu’un saurait me dire la largeur (et la hauteur de base éventuellement) en pixels d’une vue section dans HA ?
Bonjour,
Voici les valeurs par default de la vue section:
- Max width of a section:
ha-view-sections-column-max-width(default:500px) - Min width of a section:
ha-view-sections-column-min-width(default:320px) - Horizontal gap between sections:
ha-view-sections-column-gap(default:32px) - Vertical gap between sections:
ha-view-sections-row-gap(default:8px) - Horizontal gap between cards within a section:
ha-section-grid-column-gap(default:8px) - Vertical gap between cards within a section:
ha-section-grid-row-gap(default:8px)
1 « J'aime »
Merci @WarC0zes , je regarde ça car mes cartes se placent d’une façon que je n’ai pas encore comprise.
A quel endroit défini t’on la largeur maximale ?
J’ai essayé dans la partie grid options mais ça ne semble pas fonctionner
ha-view-sections-column-gap: 8px
ha-view-sections-column-min-width: 320px
ha-view-sections-column-max-width: 320px
Salut
Tu peux passer par un thème
Regarde par là :
@WarC0zes et @BBE m’ont proposé deux solution, soit un thème général soit un thème selon les vues du dashboard.
1 « J'aime »
Ok, je vais regarder cela de très près.
Et est ce qu’il serait possible d’intégrer le background directement dans le thème ?
Oui, c’est possible.
/* backgrounds */
--card-background-color: #ffffff;
--primary-background-color: #fafafa;
--secondary-background-color: #e5e5e5; /* behind the cards on state */
--clear-background-color: #ffffff;
1 « J'aime »
pour les cartes bien sur, comme indiqué par @WarC0zes
Pour les sections, non.
même si il y a quelques contournements, en créant des cartes « sections » avec vertical-stack-in-card par exemple.
Je viens de faire un thème avec ceci juste pour tester, mais je n’y arrive pas, si je change les valeurs, celà ne change rien.
Test_theme:
# Sections
ha-view-sections-column-gap: 30px
ha-view-sections-column-min-width: 320px
ha-view-sections-column-max-width: 500px
# Cards
card-height: 100px
card-width: 100px
card-background: none
card-border-style: none
Oui celà a bien été fait
J’ai constamment ce résultat en tout riquiqui :
Avec ce code :
Test_theme:
# Sections
ha-view-sections-column-gap: 30px
ha-view-sections-column-min-width: 320px
ha-view-sections-column-max-width: 500px
# Cards
height: 100px
width: 100px
background: none
border-style: none
background-color: transparent
# Background de la page
primary-background-color: teal
J’ai du mieux avec ceci :
Test_theme:
# Sections
ha-view-sections-column-gap: 100px
ha-view-sections-column-min-width: 320px
ha-view-sections-column-max-width: 500px
# Background de la page
primary-background-color: teal
# Cards colors / border
ha-card-background: rgba(0, 0, 0, 0)
card-background-color: var(--secondary-background-color)
paper-card-background-color: var(--ha-card-background)
paper-listbox-background-color: var(--primary-background-color)
ha-card-border-width: 0px
Aussi j’arrive à changer le background global avec une image avec ceci :
# Background de la page
background-image: "center / cover no-repeat url('/local/images/Background/Fond_bleu.jpeg') fixed"
lovelace-background: var(--background-image)
1 - Peut on définir la taille des cartes des sections views directement dans le thème ?
2 - Si je définis une largeur max de section View à 500px, et que je place 3 cartes de 80px chacune, si je calcule, je devrais avoir un espace de 65px
=> Mais j’obtiens une disposition pas du tout alignée…
margin-left: 65px;
puis pour la 2ème
margin-left: 145px;
et la 3ème
margin-left: 225px;
