Je me suis créé un dashboard energy similaire au natif avec l’ajout d’une carte custom liée a tempo. C’est une vue en mode barre latérale. Ayant trouvé l’inspiration ici, j’ai pu mettre le sélecteur de date flottant en bas de la fenêtre (pour répliquer le fonctionnement du dashboard énergie natif). Mais je cherche à améliorer 2 points sans y parvenir pour l’instant.
en l’état, le pop de sélection de date ne s’ouvre que vers le bas ce qui est incompatible avec le positionnement de la carte en bas. Je pourrais fixer le sélecteur de date en haut mais ce n’est pas satisfaisant non plus.
Quand on passe en modification de la vue, cette carte n’a plus son bouton « modifier » et la modif par UI est inaccessible ce qui oblige a passer en modif yaml de tout le dashboard.
Si des bonnes âmes ici ont des idées, je prends.
- type: energy-date-selection
card_mod:
style: |
ha-card {
/* Fixation au bord inférieur */
position: fixed !important;
bottom: 30px !important;
/* Centrage en tenant compte de la barre latérale */
left: calc(50% + var(--mdc-drawer-width, 0px) / 2) !important;
transform: translateX(-50%) !important;
/* Dimensions */
width: auto !important;
min-width: 450px !important;
height: 58px !important;
padding: 0 40px !important;
/* Design : on s'appuie sur les variables de thème */
z-index: 9999 !important;
/* Fond semi-transparent basé sur la couleur de carte */
background: color-mix(
in srgb,
var(--ha-card-background, var(--card-background-color, #ffffff)) 90%,
transparent
) !important;
backdrop-filter: blur(15px);
box-shadow: 0px 10px 40px rgba(0,0,0,0.35) !important;
border-radius: 30px !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
display: flex !important;
align-items: center !important;
}
.card-content {
padding: 0 !important;
width: 100% !important;
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
}
:host {
position: absolute !important;
width: 0 !important;
height: 0 !important;
z-index: 9999 !important;
}
Pour le point 2, c’est normal, tu n’as pas d’interface visuel pour les cartes manuelles.
Pour le point 1, en essayant ton code, ca pop vers le bas quand je cliques sur la séléction de date.
Je suppose que tu veux que ca pop vers le haut, non ?
