diff --git a/app/static/css/releve-but.css b/app/static/css/releve-but.css index 60d4f01c1..3f132d6a4 100644 --- a/app/static/css/releve-but.css +++ b/app/static/css/releve-but.css @@ -77,6 +77,17 @@ section>div:nth-child(1){ display: flex !important; } +.listeOff .ue::before, +.listeOff .module::before, +.moduleOnOff .ue::before, +.moduleOnOff .module::before{ + transform: rotate(0); +} +.listeOff .moduleOnOff .ue::before, +.listeOff .moduleOnOff .module::before{ + transform: rotate(180deg) !important; +} + /***********************/ /* Options d'affichage */ /***********************/ @@ -118,11 +129,16 @@ section>div:nth-child(1){ /************/ /* Semestre */ /************/ +.flex{ + display: flex; + gap: 16px; +} .infoSemestre{ display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; + flex: none; } .infoSemestre>div{ border: 1px solid var(--couleurIntense); @@ -141,7 +157,12 @@ section>div:nth-child(1){ .rang{ text-decoration: underline var(--couleurIntense); } - +.decision{ + margin: 5px 0; + font-weight: bold; + font-size: 20px; + text-decoration: underline var(--couleurIntense); +} .enteteSemestre{ color: black; font-weight: bold; @@ -174,8 +195,21 @@ section>div:nth-child(1){ display: flex; gap: 16px; margin: 4px 0 2px 0; - overflow: auto; + overflow-x: auto; + overflow-y: hidden; cursor: pointer; + position: relative; +} +.module::before, .ue::before { + content:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='26px' height='26px' fill='black'><path d='M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z' /></svg>"); + width: 26px; + height: 26px; + position: absolute; + bottom: 0; + left: 50%; + margin-left: -13px; + transform: rotate(180deg); + transition: 0.2s; } h3{ display: flex; diff --git a/app/static/js/releve-but.js b/app/static/js/releve-but.js index 126cb219e..5042031b3 100644 --- a/app/static/js/releve-but.js +++ b/app/static/js/releve-but.js @@ -75,10 +75,15 @@ class releveBUT extends HTMLElement { <!---------------------------> <section> <h2>Semestre </h2> - <div class=dateInscription>Inscrit le </div> - <em>Les moyennes servent à situer l'étudiant dans la promotion et ne correspondent pas à des validations de - compétences ou d'UE.</em> - <div class=infoSemestre></div> + <div class=flex> + <div class=infoSemestre></div> + <div> + <div class=decision>Validé !</div> + <div class=dateInscription>Inscrit le </div> + <em>Les moyennes servent à situer l'étudiant dans la promotion et ne correspondent pas à des validations de compétences ou d'UE.</em> + </div> + </div> + </section> <!---------------------------> @@ -91,8 +96,7 @@ class releveBUT extends HTMLElement { <em>La moyenne des ressources dans une UE dépend des poids donnés aux évaluations.</em> </div> <div class=CTA_Liste> - Liste <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 24 24" fill="none" - stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> + Liste <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <path d="M18 15l-6-6-6 6" /> </svg> </div> @@ -107,8 +111,7 @@ class releveBUT extends HTMLElement { <div> <h2>Ressources</h2> <div class=CTA_Liste> - Liste <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 24 24" fill="none" - stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> + Liste <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <path d="M18 15l-6-6-6 6" /> </svg> </div> @@ -120,8 +123,7 @@ class releveBUT extends HTMLElement { <div> <h2>SAÉ</h2> <div class=CTA_Liste> - Liste <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 24 24" fill="none" - stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> + Liste <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <path d="M18 15l-6-6-6 6" /> </svg> </div> @@ -187,9 +189,9 @@ class releveBUT extends HTMLElement { <div>Max. promo. :</div><div>${data.semestre.notes.max}</div> <div>Moy. promo. :</div><div>${data.semestre.notes.moy}</div> <div>Min. promo. :</div><div>${data.semestre.notes.min}</div> - </div> - ${data.semestre.groupes.map(groupe => { - return ` + </div>`; + /*${data.semestre.groupes.map(groupe => { + return ` <div> <div class=enteteSemestre>Groupe</div><div class=enteteSemestre>${groupe.nom}</div> <div class=rang>Rang :</div><div class=rang>${groupe.rang.value} / ${groupe.rang.total}</div> @@ -198,10 +200,10 @@ class releveBUT extends HTMLElement { <div>Min. groupe :</div><div>${groupe.notes.min}</div> </div> `; - }).join("") - } - `; + }).join("") + }*/ this.shadow.querySelector(".infoSemestre").innerHTML = output; + this.shadow.querySelector(".decision").innerHTML = data.semestre.decision.code; } /*******************************/