Bonjour @Dathosim ,
Quand je passe on mode sombre, une ligne sur 2 est illisible, car le fond est trop sombre (alors que tout est ok en mode clair).
J’ai essayé de faire de changement, mais je n’arrive jamais à avoir quelque chose qui fonctionne en même temps en mode clair et foncé… Aurais tu une idée de ce que je pourrais change?
Par ailleurs, j’ai une note qui apparait en vert, alors qu’elle est inférieur à la moyenne de la classe… c’est bizarre car les autres sont ok…
Merci
Hello, petite nouveauté côté cartes, j’ai créé la carte des devoirs : GitHub - delphiki/lovelace-pronote: Lovelace cards for the Pronote integration
Exemple (avec valeurs par défaut) :
type: custom:pronote-homework-card
entity: sensor.pronote_XXXX_YYYY_homework
display_done_homework: true # affiche les devoirs faits
reduce_done_homework: true # réduit les devoirs faits (description masquée)
current_week_only: false # uniquement les devoirs de la semaine
Voilà ce que ça donne pour mes enfants :
Note, si l’option reduce_done_homework est à true, en cliquant sur le nom de la matière, ça affiche la description.
yes ! j’ai corrigé ça - mais mon Ha est planté lié au dernier update…
des que je récupère je t’envoie ça
En fait j’ai compris ce qu’il se passe (mais j’ai pas la solution). On regarde ici le mode clair/sombre du téléphone, mais pas maison home assistant companion…
Dans mon cas, je force l’application en mode sombre dans les paramètres, et elle ne suis donc pas le mode d’un téléphone…
Est il possible de changer les couleurs en fonction du mode clair sombre de l’application ha plutôt qu’en fonction du téléphone?
Voici la mienne, basée sur les cartes de @Dathosim et @Sigalou :
Le code:
type: markdown
content: >-
<table> {% set items =
state_attr('sensor.pronote_xxxx_thibault_grades','grades') %}
<tr><td><h4>Date<h3></td><td><h4>Cours</td><td><h4>Devoir</td><td><h4>Note</td><td><h4>Moy</td><td><h4>Max</td><td><h4>Min</td>
<td><h4>Coeff</td> </tr> {% for i in range(0, items | count, 1) %} <tr>
<td>{{ items[i].date.strftime("%d/%m") }}</td> <td>{{ items[i].subject }}</td>
<td>{{ items[i].comment }}</td> <td>{{ items[i].grade_out_of }}</td> <td>{{
items[i].class_average }}</td> <td>{{ items[i].max }}</td> <td>{{ items[i].min
}}</td> <td>{{ items[i].coefficient }}</td> </tr> {% endfor %}
title: Notes
card_mod:
style:
.: |
ha-card ha-markdown {
padding:0px
border-top: 1px groove var(--divider-color);
overflow-y: scroll;
height: 300px;
}
ha-card ha-markdown.no-header {
padding:0px
}
$: |
h1.card-header {
background-color:rgb(100, 100, 100);
padding: 0px 0px 0px 12px !important;
color: white !important;
font-weight: normal;
font-size: 1.5em !important;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
height: 100%;
}
ha-markdown $: |
h1 {
font-weight: normal;
font-size: 24px;
}
div {
background-color:rgb(100, 100, 100);
padding: 12px 12px;
color:white;
font-weight:normal;
font-size:1.2em;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
table{
border-collapse: collapse;
font-size: 0.9em;
font-family: Roboto;
width: 100%;
outline: 0px solid #393c3d;
margin-top: 10px;
} caption {
text-align: center;
font-weight: bold;
font-size: 1.2em;
} td {
padding: 5px 5px 5px 5px;
text-align: left;
border-bottom: 0px solid #1c2020;
}
tr {
border-bottom: 0px solid #1c2020;
}
tr:last-of-type {
border-bottom: transparent;
}
tr:nth-of-type(even) {
background-color: rgb(54, 54, 54, 0.3);
}
mark {
background: lightgreen;
border-color: green;
border-radius: 10px;
padding: 5px;
}
span {
background: orange;
color: #222627;
border-radius: 5px;
padding: 5px;
}
tr:nth-child(n+2) > td:nth-child(2) {
text-align: left;
}
Il faudrait juste ajouter un test sur la dispo du sensor ‹ sensor.pronote_xxxx_thibault_grades › pour éviter certains warnings quand le sensor est ‹ unavailable ›… mais c’est facile à faire…
S’il te manque des champs sur une carte, il suffit d’aller dans l’outil de développement pour regarder les attributs du sensor et comprendre comment les infos sont agencées.
ensuite c’est dans cette partie là de la carte markdown que ça se passe:
<tr> et <\tr> encadre une ligne<td> et <\td> encadre une colonnecontent: >-
<table> {% set items =
state_attr('sensor.pronote_xxxx_thibault_grades','grades') %}
# première ligne avec les titres
<tr><td><h4>Date<h3></td><td><h4>Cours</td><td><h4>Devoir</td><td><h4>Note</td><td><h4>Moy</td><td><h4>Max</td><td><h4>Min</td>
<td><h4>Coeff</td> </tr>
# puis on boucle pour chaque element de la ligne i et on vient chercher pour chaque note les attributs dans le bon ordre avec la syntaxe item[i].attribut espacé par des balises td et tr
{% for i in range(0, items | count, 1) %} <tr>
<td>{{ items[i].date.strftime("%d/%m") }}</td> <td>{{ items[i].subject }}</td>
<td>{{ items[i].comment }}</td> <td>{{ items[i].grade_out_of }}</td> <td>{{
items[i].class_average }}</td> <td>{{ items[i].max }}</td> <td>{{ items[i].min
}}</td> <td>{{ items[i].coefficient }}</td> </tr> {% endfor %}
Ah j’adore tes cartes ! Ca simplifie tellement tout ! Un grand merci pour ton travail
Super merci, par contre j’ai un message d’erreur sur ‹ pronote-homework-card ›
d’après le message c’est la carte qui n’existe pas…
As tu chargé la dernière version ? As tu rebouté ?
derniere version ‹ 1.1.0 › et rebouté…
La dernière version, c’est la 1.2.0 
Comment peut on ajouter une couleur verte en sur lignée par exemple quand la note est au dessus de la moyenne de la classe?
c’est corrigé 
1.2.0
vivement les prochaines carte 
La prochaine sera celle des notes, je l’ai déjà commencée
Ca il faut le faire dans la partie cardmod, c’est de la mise en forme…
D’ailleurs je me rend compte que je ne l’ai pas nettoyé, je l’avais récupérée d’une autre carte (evaluation ou devoirs ou agenda…) il y a des parties qui ne servent à rien…
Moi j’attend la carte des notes et je bascule tout mon dashboard avec les cartes de @delphiki ce sera sans doute plus propre que les miennes…
Super carte ,merci beaucoup ! impatient pour les prochaines
Hello @Kri72
alors, pour la coloration des lignes de tableaux qui fonctionne en mode sombre ET claire, j’ai utilisé la propriété CSS suivante
tr:nth-child(even) {background-color: var(--divider-color);}
du coup, si je remets ici toute la fonction qui gère les styles :
{%- macro pronote_styles(sensor_id) -%}
div {
background-color:rgb(50, 50, 50);
padding: 12px;
font-weight:normal;
color:white;
font-size:1.2em;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
table{
font-size: 0.9em;
font-family: Roboto;
width: 100%;
outline: 0px solid #393c3d;
margin-top:5px;
border-collapse: collapse;
}
td {
vertical-align: middle;
}
tr td:last-child span {
background-color: #EC4B34;
padding: 4px;
border-radius: 4px;
white-space: nowrap;
}
mark {
background-color: #009767;
padding: 4px;
border-radius: 4px;
white-space: nowrap;
margin-top:3px
}
tr:nth-child(even) {background-color: var(--divider-color);}
ul{
padding: 0px 0px 0px 0px;
margin: 0px;
list-style-type:none;
line-height:1.1em;
}
li{
padding: 0px 0px 0px 0px;
font-style: italic;
color: grey;
}
tr.canceled td {
color: orange;
}
td {
padding: 1px 5px 1px 5px;
text-align: left;
vertical-align: top;
}
{%- if sensor_id == "sensor.pronote_lhouillier_simon_timetable_next_day" or sensor_id == "sensor.pronote_lhouillier_simon_timetable_today" -%}
tr td:nth-child(2) > span {
display:inline-block;
width: 4px;
height: 3rem;
border-radius:4px;
}
tr td:first-child {
width: 13%;
text-align:right;
}
{%- set items = state_attr(sensor_id, 'lessons') -%}
{%- for i in range(0, items | count, 1) -%}
{%- if items[i].canceled and not loop.last and items[i].start_at == items[i+1].start_at -%}
tr:nth-child({{ loop.index }}) {
display:none;
}
{%- else -%}
tr:nth-child({{ loop.index }}) td:nth-child(2) > span {
background-color: {{items[i].background_color}};
}
{% if as_timestamp(now()) > as_timestamp(items[i].end_at) %}
tr:nth-child({{ loop.index }}) {
opacity: 0.3;
}
{% endif %}
{%- endif -%}
{%- endfor -%}
{% endif %}
{%- if sensor_id == "sensor.pronote_lhouillier_simon_homework" -%}
tr td:nth-child(2) > span {
display:inline-block;
width: 4px;
height: 3rem;
border-radius:4px;
}
tr td:first-child {
width: 13%;
text-align:center;
white-space: nowrap;
}
{%- set items = state_attr(sensor_id, 'homework') -%}
{%- for i in range(0, items | count, 1) -%}
tr:nth-child({{ loop.index }}) td:nth-child(2) > span {
background-color: {{items[i].background_color}};
}
{%- endfor -%}
{% endif %}
{%- if sensor_id == "sensor.pronote_lhouillier_simon_grades" -%}
tr td:nth-child(2) > span {
display:inline-block;
width: 4px;
height: 3rem;
border-radius:4px;
}
tr td:first-child {
width: 15%;
text-align:center;
white-space: nowrap;
}
tr td:last-child {
width: 30%;
white-space: nowrap;
}
{%- set items = state_attr(sensor_id, 'grades') -%}
{%- for i in range(0, items | count, 1) -%}
{%- if items[i].grade >= items[i].class_average -%}
tr:nth-child({{ loop.index }}) td:nth-child(2) > span {
background-color: #009767;
}
{%- else -%}
tr:nth-child({{ loop.index }}) td:nth-child(2) > span {
background-color: #EC4B34;
}
{%- endif -%}
{%- endfor -%}
{% endif %}
{%- if sensor_id == "sensor.pronote_lhouillier_simon_averages" -%}
td {
vertical-align: middle;
}
tr td:nth-child(4) > span {
display: inline-block;
width: 4px;
max-width: 4px;
height: 2rem;
border-radius: 4px;
}
tr td:nth-child(1) > span {
display:inline-block;
width: 4px;
max-width: 4px;
height: 2rem;
border-radius:4px;
}
{%- set items = state_attr(sensor_id, 'averages') -%}
{%- for i in range(0, items | count, 1) -%}
tr:nth-child({{ loop.index }}) td:nth-child(1) > span {
background-color: {{items[i].background_color}};
}
{%- if [items[i].average|replace(',', '.')|float] >= [items[i].class|replace(',', '.')|float] -%}
tr:nth-child({{ loop.index }}) td:nth-child(4) > span{
background-color: #009767;
padding-right: 0px;
}
{%- else -%}
tr:nth-child({{ loop.index }}) td:nth-child(4) > span {
background-color: #EC4B34;
padding: 0px;
}
tr:nth-child({{ loop.index }}) td:nth-child(4) {
color: #EC4B34;
}
tr:nth-child({{ loop.index }}) td:nth-child(4) > ul {
color: var(--primary-text-color);
}
{%- endif -%}
{%- endfor -%}
{% endif %}
{%- endmacro -%}
et voila
Merci @delphiki pour les cartes
Nouvelle release pour les cartes, version 1.3.0 : https://github.com/delphiki/lovelace-pronote/releases/tag/1.3.0
La carte des notes est là !
Pas mal d’options dispo pour cette carte (GitHub - delphiki/lovelace-pronote: Lovelace cards for the Pronote integration) :
type: custom:pronote-grades-card
entity: sensor.pronote_XXXX_YYYY_grades
grade_format: full # affiche la note au format X/Y, 'short' va l'afficher sous la forme X
display_header: true # affiche le header "Notes pour XXX"
display_date: true # affiche la date de la note
display_comment: true # affiche le commentaire (par ex "brevet blanc" pour la dernière note de l'image)
display_class_average: true # affiche la moyenne de la classe
compare_with_class_average: true # compare la note avec la moyenne, si la note est inférieure, la barre de couleur à gauche est orange, verte sinon
display_coefficient: true # affiche le coefficient
display_class_min: true # affiche la note la plus basse
display_class_max: true # affiche la note la plus haute
display_new_grade_notice: true # affiche une pastille orange (comme sur la première note) pour les nouvelles notes du jour (oui, j'ai triché la note date d'il y a deux jours sur la capture)
max_grades: null # permet de limiter le nombre de notes à afficher
Pour rappel, comme avec toutes les cartes, seule l’entité est obligatoire, les autres options ont des valeurs par défaut.
Sinon, autre nouveauté, qui concerne toutes les cartes, l’option display_header qui permet d’afficher / masquer un header avec le nom de votre enfant.