De quoi ? Le texte ? Oui le texte est une entité vide.
Le texte c’est bon. Me manquait l’entité vide.
Les autres erreurs je sais pas encore…
→ input_boolean.wakestatus_1
Alors c’est pas le wakestatus, c’est plus bête que ça.
J’ai un thème dark_orange, et il ne me change pas la couleur. Il fait orange-orange…
Si j’enlève le thème, il me permute bien les couleurs.
Faut que je change les couleurs dans la carte ?
Me reste donc cet ersatz d’image derrière …
@Clemalex Hello,
j’ai pas compris dans le fonctionnement du réveil à un seul réglage comment le wakestatus_1 se remet à 0 ?
Et tu pourrais me dire comment changer la taille de la sélection d’heures/minutes, et la couleur ?
Merci
Pour le fonctionnement du réveil, ce n’est pas ici mais là → Un réveil sur Home assistant
Et je sais que j’avais alerté sur le code car beaucoup de chose me choquait dont ce que tu cherches :
Je te conseille de continuer (pour le fonctionnement de l’automatisation derrière la carte) dans le sujet d’origine, car ici ce n’est que les cartes.
SI tu veux une automatisation, j’en ai mis une dans le message 14 → [CARTE] Réveil (ou activation d'automatisation) - #14 par Clemalex
Ok j’ai posté un message là bas.
Bin en fait je veux qu’il passe à 1 puis forcément à 0.
Effectivement avec ton automation je pourrais y arriver, mais c’est gruger…
C’est pas gruger mais une autre pour avoir un exemple…
Le mieux quand on apprend est de croiser les informations
C’est vrai.
Bon j’ai ajouté une remise à 0.
Un truc juste, je trouve pas comment augmenter la taille de l’affichage de l’heure ? La sélection ?
Et remplacer la couleur du rond jaune autour des jours. Je vois pas…
Peux tu me partager ton code car il y a plusieurs version de la carte…
le voici :
type: picture-elements
elements:
- entity: sensor.vide
prefix: Réveil
style:
color: var(--primary-color)
font-size: 20px
font-variant: small-caps
left: 13%
pointer-events: none
top: 70%
tap_action:
action: none
type: state-label
- entity: input_boolean.wakestatus_1
style:
'--paper-item-icon-color': var(--primary-color)
left: 13%
top: 35%
tap_action:
action: toggle
type: state-icon
- entity: input_datetime.wake_time_1
hide:
name: true
hour_step: 1
layout:
align_controls: center
name: inside
link_values: true
minute_step: 1
name: ''
style:
.: |
ha-card {
box-shadow: none;
background-color: rgba(0,0,0,0);
opacity: {% if is_state('input_boolean.wakestatus_1', 'off') %} 0.3 {% endif %};
pointer-events: {% if is_state('input_boolean.wakestatus_1', 'off') %} none {% endif %};
}
.time-picker-row{
margin-left: 5px !important;
}
.time-picker-row:
.time-picker-content:
.: |
.time-separator {
display: none;
}
time-unit:
$: |
.time-unit {
padding: 2px !important;
}
.time-input {
border: 2px solid var(--primary-color) !important;
background-color: rgba(0,0,0,0) !important;
color: black !important;
border-radius: 5px;
}
.time-picker-icon {
color: var(--primary-color) !important;
z-index: 100;
}
left: 45%
top: 50%
type: 'custom:time-picker-card'
- entity: input_boolean.wakeweekday_mon_1
icon: 'mdi:alpha-l-circle'
show_label: false
show_name: false
show_state: false
style:
'--paper-item-icon-color': var(--primary-color)
right: 17%
top: 20%
styles:
card:
- width: 35px
- height: 35px
- border-radius: 999px
- background-color: 'rgba(0, 0, 0, 0)'
- box-shadow: none
- opacity: |
[[[
if ( (states['input_boolean.wakestatus_1'].state == 'off') ) return '0.3';
else return '1';
]]]
- pointer-events: |
[[[
if ( (states['input_boolean.wakestatus_1'].state == 'off') ) return 'none';
else return 'auto';
]]]
icon:
- transform: scale(2.1)
type: 'custom:button-card'
- entity: input_boolean.wakeweekday_tue_1
icon: 'mdi:alpha-m-circle'
show_label: false
show_name: false
show_state: false
style:
'--paper-item-icon-color': var(--primary-color)
right: 7%
top: 20%
styles:
card:
- width: 35px
- height: 35px
- border-radius: 999px
- background-color: 'rgba(0, 0, 0, 0)'
- box-shadow: none
- opacity: |
[[[
if ( (states['input_boolean.wakestatus_1'].state == 'off') ) return '0.3';
else return '1';
]]]
- pointer-events: |
[[[
if ( (states['input_boolean.wakestatus_1'].state == 'off') ) return 'none';
else return 'auto';
]]]
icon:
- transform: scale(2.1)
type: 'custom:button-card'
- entity: input_boolean.wakeweekday_wed_1
icon: 'mdi:alpha-m-circle'
show_label: false
show_name: false
show_state: false
style:
'--paper-item-icon-color': var(--primary-color)
right: 22%
top: 50%
styles:
card:
- width: 35px
- height: 35px
- border-radius: 999px
- background-color: 'rgba(0, 0, 0, 0)'
- box-shadow: none
- opacity: |
[[[
if ( (states['input_boolean.wakestatus_1'].state == 'off') ) return '0.3';
else return '1';
]]]
- pointer-events: |
[[[
if ( (states['input_boolean.wakestatus_1'].state == 'off') ) return 'none';
else return 'auto';
]]]
icon:
- transform: scale(2.1)
type: 'custom:button-card'
- entity: input_boolean.wakeweekday_thu_1
icon: 'mdi:alpha-j-circle'
show_label: false
show_name: false
show_state: false
style:
'--paper-item-icon-color': var(--primary-color)
right: 12%
top: 50%
styles:
card:
- width: 35px
- height: 35px
- border-radius: 999px
- background-color: 'rgba(0, 0, 0, 0)'
- box-shadow: none
- opacity: |
[[[
if ( (states['input_boolean.wakestatus_1'].state == 'off') ) return '0.3';
else return '1';
]]]
- pointer-events: |
[[[
if ( (states['input_boolean.wakestatus_1'].state == 'off') ) return 'none';
else return 'auto';
]]]
icon:
- transform: scale(2.1)
type: 'custom:button-card'
- entity: input_boolean.wakeweekday_fri_1
icon: 'mdi:alpha-v-circle'
show_label: false
show_name: false
show_state: false
style:
'--paper-item-icon-color': var(--primary-color)
right: 2%
top: 50%
styles:
card:
- width: 35px
- height: 35px
- border-radius: 999px
- background-color: 'rgba(0, 0, 0, 0)'
- box-shadow: none
- opacity: |
[[[
if ( (states['input_boolean.wakestatus_1'].state == 'off') ) return '0.3';
else return '1';
]]]
- pointer-events: |
[[[
if ( (states['input_boolean.wakestatus_1'].state == 'off') ) return 'none';
else return 'auto';
]]]
icon:
- transform: scale(2.1)
type: 'custom:button-card'
- entity: input_boolean.wakeweekday_sat_1
icon: 'mdi:alpha-s-circle'
show_label: false
show_name: false
show_state: false
style:
'--paper-item-icon-color': var(--primary-color)
right: 17%
top: 80%
styles:
card:
- width: 35px
- height: 35px
- border-radius: 999px
- background-color: 'rgba(0, 0, 0, 0)'
- box-shadow: none
- opacity: |
[[[
if ( (states['input_boolean.wakestatus_1'].state == 'off') ) return '0.3';
else return '1';
]]]
- pointer-events: |
[[[
if ( (states['input_boolean.wakestatus_1'].state == 'off') ) return 'none';
else return 'auto';
]]]
icon:
- transform: scale(2.1)
type: 'custom:button-card'
- entity: input_boolean.wakeweekday_sun_1
icon: 'mdi:alpha-d-circle'
show_label: false
show_name: false
show_state: false
style:
'--paper-item-icon-color': var(--primary-color)
right: 7%
top: 80%
styles:
card:
- width: 35px
- height: 35px
- border-radius: 999px
- background-color: 'rgba(0, 0, 0, 0)'
- box-shadow: none
- opacity: |
[[[
if ( (states['input_boolean.wakestatus_1'].state == 'off') ) return '0.3';
else return '1';
]]]
- pointer-events: |
[[[
if ( (states['input_boolean.wakestatus_1'].state == 'off') ) return 'none';
else return 'auto';
]]]
icon:
- transform: scale(2.1)
type: 'custom:button-card'
image: /local/Photos/transparent.png
Un peu de patience, j’avais mis un rappel, dès que je peux j’aide
Pour te faire avancer, comme aucune couleur n’est déclarée, la carte utilise la couleur native des entités quand elles sont actives.
Regarde donc du côté du style
de l’icone
suivant son etat
.
Un petit code du style :
icon:
- transform: scale(2.1)
state:
- value: 'off'
styles:
icon:
- color: '#ccc'
- value: 'on'
styles:
icon:
- color: '#3dc'
Tu peux en profiter pour déplacer les lignes de l’opacité et du pointer dedans si tu veux (mais dans le style de la carte
), chacune des conditions à la bonne place.
La documentation → GitHub - custom-cards/button-card: ❇️ Lovelace button-card for home assistant
T’inquiètes, c’était pas pour te bousculer …
Merci je vais regarder ça
Le code de la carte qui est en face de l’automatisation qui est ici :
https://forum.hacf.fr/t/un-reveil-sur-home-assistant/622/38?u=clemalex
La carte :
elements:
- entity: sensor.vide
prefix: Réveil 1
style:
color: var(--primary-color)
font-size: 20px
font-variant: small-caps
left: 13%
pointer-events: none
top: 70%
tap_action:
action: none
type: state-label
- entity: input_boolean.reveil_1
style:
'--paper-item-icon-color': var(--primary-color)
left: 13%
top: 35%
tap_action:
action: toggle
type: state-icon
- entity: input_datetime.reveil_heure_1
hide:
name: true
hour_step: 1
layout:
align_controls: center
name: inside
link_values: true
minute_step: 1
name: ''
style:
.: |
ha-card {
box-shadow: none;
background-color: rgba(0,0,0,0);
opacity: {% if is_state('input_boolean.reveil_1', 'off') %} 0.3 {% endif %};
pointer-events: {% if is_state('input_boolean.reveil_1', 'off') %} none {% endif %};
}
.time-picker-row{
margin-left: 5px !important;
}
.time-picker-row:
.time-picker-content:
.: |
.time-separator {
display: none;
}
time-unit:
$: |
.time-unit {
padding: 2px !important;
}
.time-input {
border: 2px solid var(--primary-color) !important;
background-color: rgba(0,0,0,0) !important;
color: black !important;
border-radius: 5px;
}
.time-picker-icon {
color: var(--primary-color) !important;
z-index: 100;
}
left: 45%
top: 50%
type: 'custom:time-picker-card'
- entity: input_boolean.reveil_mon_1
show_label: false
show_icon: false
show_name: true
show_state: false
name: Lu
style:
'--paper-item-icon-color': var(--primary-color)
right: 17%
top: 20%
styles:
card:
- width: 30px
- height: 30px
- border-radius: 999px
- background-color: |
[[[
if ( (states['input_boolean.reveil_mon_1'].state == 'off') ) return 'var(--primary-color)';
else return 'var(--paper-item-icon-active-color)';
]]]
- box-shadow: none
- border-radius: 999px
- opacity: |
[[[
if ( (states['input_boolean.reveil_1'].state == 'off') ) return '0.3';
else return '1';
]]]
- pointer-events: |
[[[
if ( (states['input_boolean.reveil_1'].state == 'off') ) return 'none';
else return 'auto';
]]]
name:
- color: white
type: 'custom:button-card'
- entity: input_boolean.reveil_tue_1
show_label: false
show_icon: false
show_name: true
show_state: false
name: Ma
style:
'--paper-item-icon-color': var(--primary-color)
right: 7%
top: 20%
styles:
card:
- width: 30px
- height: 30px
- border-radius: 999px
- background-color: |
[[[
if ( (states['input_boolean.reveil_tue_1'].state == 'off') ) return 'var(--primary-color)';
else return 'var(--paper-item-icon-active-color)';
]]]
- box-shadow: none
- border-radius: 999px
- opacity: |
[[[
if ( (states['input_boolean.reveil_1'].state == 'off') ) return '0.3';
else return '1';
]]]
- pointer-events: |
[[[
if ( (states['input_boolean.reveil_1'].state == 'off') ) return 'none';
else return 'auto';
]]]
name:
- color: white
type: 'custom:button-card'
- entity: input_boolean.reveil_wed_1
show_label: false
show_icon: false
show_name: true
show_state: false
name: Me
style:
'--paper-item-icon-color': var(--primary-color)
right: 22%
top: 50%
styles:
card:
- width: 30px
- height: 30px
- border-radius: 999px
- background-color: |
[[[
if ( (states['input_boolean.reveil_wed_1'].state == 'off') ) return 'var(--primary-color)';
else return 'var(--paper-item-icon-active-color)';
]]]
- box-shadow: none
- border-radius: 999px
- opacity: |
[[[
if ( (states['input_boolean.reveil_1'].state == 'off') ) return '0.3';
else return '1';
]]]
- pointer-events: |
[[[
if ( (states['input_boolean.reveil_1'].state == 'off') ) return 'none';
else return 'auto';
]]]
name:
- color: white
type: 'custom:button-card'
- entity: input_boolean.reveil_thu_1
show_label: false
show_icon: false
show_name: true
show_state: false
name: Je
style:
'--paper-item-icon-color': var(--primary-color)
right: 12%
top: 50%
styles:
card:
- width: 30px
- height: 30px
- border-radius: 999px
- background-color: |
[[[
if ( (states['input_boolean.reveil_thu_1'].state == 'off') ) return 'var(--primary-color)';
else return 'var(--paper-item-icon-active-color)';
]]]
- box-shadow: none
- border-radius: 999px
- opacity: |
[[[
if ( (states['input_boolean.reveil_1'].state == 'off') ) return '0.3';
else return '1';
]]]
- pointer-events: |
[[[
if ( (states['input_boolean.reveil_1'].state == 'off') ) return 'none';
else return 'auto';
]]]
name:
- color: white
type: 'custom:button-card'
- entity: input_boolean.reveil_fri_1
show_label: false
show_icon: false
show_name: true
show_state: false
name: Ve
style:
'--paper-item-icon-color': var(--primary-color)
right: 2%
top: 50%
styles:
card:
- width: 30px
- height: 30px
- border-radius: 999px
- background-color: |
[[[
if ( (states['input_boolean.reveil_fri_1'].state == 'off') ) return 'var(--primary-color)';
else return 'var(--paper-item-icon-active-color)';
]]]
- box-shadow: none
- border-radius: 999px
- opacity: |
[[[
if ( (states['input_boolean.reveil_1'].state == 'off') ) return '0.3';
else return '1';
]]]
- pointer-events: |
[[[
if ( (states['input_boolean.reveil_1'].state == 'off') ) return 'none';
else return 'auto';
]]]
name:
- color: white
type: 'custom:button-card'
- entity: input_boolean.reveil_sat_1
show_label: false
show_icon: false
show_name: true
show_state: false
name: Sa
style:
'--paper-item-icon-color': var(--primary-color)
right: 17%
top: 80%
styles:
card:
- width: 30px
- height: 30px
- border-radius: 999px
- background-color: |
[[[
if ( (states['input_boolean.reveil_sat_1'].state == 'off') ) return 'var(--primary-color)';
else return 'var(--paper-item-icon-active-color)';
]]]
- box-shadow: none
- border-radius: 999px
- opacity: |
[[[
if ( (states['input_boolean.reveil_1'].state == 'off') ) return '0.3';
else return '1';
]]]
- pointer-events: |
[[[
if ( (states['input_boolean.reveil_1'].state == 'off') ) return 'none';
else return 'auto';
]]]
name:
- color: white
type: 'custom:button-card'
- entity: input_boolean.reveil_sun_1
show_label: false
show_icon: false
show_name: true
show_state: false
name: Di
style:
'--paper-item-icon-color': var(--primary-color)
right: 7%
top: 80%
styles:
card:
- width: 30px
- height: 30px
- border-radius: 999px
- background-color: |
[[[
if ( (states['input_boolean.reveil_sun_1'].state == 'off') ) return 'var(--primary-color)';
else return 'var(--paper-item-icon-active-color)';
]]]
- box-shadow: none
- border-radius: 999px
- opacity: |
[[[
if ( (states['input_boolean.reveil_1'].state == 'off') ) return '0.3';
else return '1';
]]]
- pointer-events: |
[[[
if ( (states['input_boolean.reveil_1'].state == 'off') ) return 'none';
else return 'auto';
]]]
name:
- color: white
type: 'custom:button-card'
image: /local/transparent.png
type: picture-elements
Car il te manque l’image de fond…