From 1f2b108c1844c7140fb7b388fd2f8a19bd3a2003 Mon Sep 17 00:00:00 2001 From: Emmanuel Viennet Date: Wed, 22 Feb 2023 14:27:11 +0100 Subject: [PATCH] =?UTF-8?q?Am=C3=A9lioration=20front=20=C3=A9diteur=20part?= =?UTF-8?q?itions?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/static/css/partition_editor.css | 87 ++++++++++++------------ app/static/css/scodoc.css | 42 +++++++++++- app/static/js/scodoc.js | 28 +++----- app/templates/scolar/partition_editor.j2 | 29 +++----- app/views/scolar.py | 2 +- 5 files changed, 103 insertions(+), 85 deletions(-) diff --git a/app/static/css/partition_editor.css b/app/static/css/partition_editor.css index b7841b42..086327b4 100644 --- a/app/static/css/partition_editor.css +++ b/app/static/css/partition_editor.css @@ -19,20 +19,6 @@ html { } } -.message_curtom { - position: fixed; - bottom: 100%; - left: 50%; - z-index: 10; - padding: 20px; - border-radius: 0 0 10px 10px; - background: #90c; - color: #FFF; - font-size: 24px; - animation: message 3s; - transform: translate(-50%, 0); -} - @keyframes message { 20%, @@ -79,7 +65,7 @@ main { margin-right: 16px; padding: 8px; border-radius: 12px; - background: #424242; + background: #717171; } main h2 { @@ -93,7 +79,7 @@ main h3 { } section { - background: #fff; + background: #dbccb8; padding: 8px; border-radius: 8px; } @@ -275,16 +261,19 @@ body.editionActivated .filtres>div>div>div>div { width: fit-content; } -#zonePartitions h3{ +#zonePartitions h3 { display: flex; } -#zonePartitions h3 .onoff{ + +#zonePartitions h3 .onoff { margin-left: auto; cursor: pointer; display: flex; align-items: center; gap: 4px; font-size: 16px; + padding-left: 8px; + padding-right: 2px; } #zonePartitions .filtres { @@ -316,7 +305,7 @@ body.editionActivated .filtres>div>div>div>div { display: block; } -#zonePartitions .filtres .config label{ +#zonePartitions .filtres .config label { display: block; background: #ddd; border-radius: 4px; @@ -356,46 +345,50 @@ body:not(.editionActivated) .filtres .groupes>div:active { box-shadow: 0 0 0 #000 !important; transform: translateY(2px); } -body.editionActivated .filtres [data-idgroupe=aucun]{ + +body.editionActivated .filtres [data-idgroupe=aucun] { display: none; } -body.editionActivated .filtres .nonEditable .move{ +body.editionActivated .filtres .nonEditable .move { display: initial; } -.filtres .unselect { +/* .filtres .unselect { background: rgba(0, 153, 204, 0.5) !important; -} +} */ /*****************************/ /* Zone Etudiants */ /*****************************/ -#zoneChoix>.autoAffectation{ - background: #3c3c3c; - color: #fff; +#zoneChoix>.autoAffectation { + background: #c9c9c9; + color: #141414; padding: 4px 8px; margin-bottom: 16px; border-radius: 4px; } -#zoneChoix>.autoAffectation>select{ + +#zoneChoix>.autoAffectation>select { border: none; padding: 4px; border-radius: 4px; } -#zoneChoix>.autoAffectation>.affectationGo{ + +#zoneChoix>.autoAffectation>.affectationGo { display: inline-block; - background: #0c9; - padding: 8px 16px; - cursor: pointer; - color: #fff; - box-shadow: 0 2px 2px rgb(0 0 0 / 25%); - border-radius: 4px; - text-align: center; - margin-top: 4px; - margin-bottom: 4px; - width: fit-content; + background: #0c9; + padding: 8px 16px; + cursor: pointer; + color: #fff; + box-shadow: 0 2px 2px rgb(0 0 0 / 25%); + border-radius: 4px; + text-align: center; + margin-top: 4px; + margin-bottom: 4px; + width: fit-content; } + #zoneChoix .etudiants>div { background: #FFF; border: 1px solid #aaa; @@ -411,14 +404,17 @@ body.editionActivated .filtres .nonEditable .move{ #zoneChoix .etudiants .nom { flex: 1; } + #zoneChoix a { color: #000; text-decoration: none; } -#zoneChoix a:hover{ + +#zoneChoix a:hover { text-decoration: underline; color: #09c; } + #zoneChoix .small { color: #444; font-size: 8px; @@ -461,8 +457,8 @@ body.editionActivated .filtres .nonEditable .move{ } #zoneChoix .etudiants .partition input:checked:not([value=aucun])+span { - background: #c09; - border-color: #c09; + background: rgb(165, 6, 59); + border-color: rgb(165, 6, 59); color: #fff; } @@ -475,7 +471,8 @@ body.editionActivated .filtres .nonEditable .move{ section:not(#zonePartitions) .hide { display: none !important; } -#zonePartitions .hide{ + +#zonePartitions .hide { opacity: 0.4; } @@ -550,6 +547,10 @@ h3 { } #zoneGroupes [data-idgroupe=aucun] { - background: #3c3c3c !important; + background: #453f3b !important; color: #fff; +} + +#zoneGroupes .groupe[data-idgroupe=aucun]>div:nth-child(1) { + color: red; } \ No newline at end of file diff --git a/app/static/css/scodoc.css b/app/static/css/scodoc.css index 9676f89e..a30995e4 100644 --- a/app/static/css/scodoc.css +++ b/app/static/css/scodoc.css @@ -166,6 +166,20 @@ div.head_message { color: green; } +.message_curtom { + position: fixed; + bottom: 100%; + left: 50%; + z-index: 10; + padding: 20px; + border-radius: 0 0 10px 10px; + background: rgb(247, 253, 67); + color: #2c1b1b; + font-size: 24px; + animation: message 3s; + transform: translate(-50%, 0); +} + div.passwd_warn { font-weight: bold; @@ -4005,6 +4019,30 @@ table.dataTable td.group { text-align: left; } +/* ------------- BOUTONS style radio ------------ */ +#zonePartitions button.dt-button { + display: inline-flex; + align-items: center; + justify-content: space-evenly; + margin: 0 4px; + border-radius: 5px; + cursor: pointer; + padding-top: 2px; + padding-bottom: 2px; + border: 2px solid lightgrey; + transition: all 0.3s ease; + font-size: 18px; + + color: white; + border-color: #0069d9; + background: #0069d9; +} + +#zonePartitions button.dt-button.unselect { + color: #707070; + background: #fff; +} + /* ------------- Nouveau tableau recap ------------ */ div.table_recap { margin-top: 6px; @@ -4015,8 +4053,10 @@ div.table_recap { font-weight: bold; } -.table_recap .but_off { +.button.but_off, +button.unselect { background-color: lightgray; + font-weight: normal; } .table_recap button.but_on:hover:not(.disabled), diff --git a/app/static/js/scodoc.js b/app/static/js/scodoc.js index 7e2c9fcf..efd6e943 100644 --- a/app/static/js/scodoc.js +++ b/app/static/js/scodoc.js @@ -68,28 +68,18 @@ $(function () { }); // Affiche un message transitoire -function sco_message(msg, color) { - if (color === undefined) { - color = "green"; - } - $('#sco_msg').html(msg).show(); - if (color) { - $('#sco_msg').css('color', color); - } - setTimeout( - function () { - $('#sco_msg').fadeOut( - 'slow', - function () { - $('#sco_msg').html(''); - } - ); - }, - 3000 // <-- duree affichage en milliseconds - ); +function sco_message(msg) { + var div = document.createElement("div"); + div.className = "message_curtom"; + div.innerHTML = msg; + document.querySelector("body").appendChild(div); + setTimeout(() => { + div.remove(); + }, 3000); } + function get_query_args() { var s = window.location.search; // eg "?x=1&y=2" var vars = {}; diff --git a/app/templates/scolar/partition_editor.j2 b/app/templates/scolar/partition_editor.j2 index 590f842b..6fa4f05b 100644 --- a/app/templates/scolar/partition_editor.j2 +++ b/app/templates/scolar/partition_editor.j2 @@ -21,7 +21,7 @@
-

Etudiants

+

Étudiants

Affecter automatiquement les étudiants du groupe
@@ -178,9 +178,9 @@
-
+
+
+
@@ -210,7 +210,8 @@ } function templateFiltres_groupe(groupe) { - let div = document.createElement("div"); + let div = document.createElement("button"); + div.classList.add("dt-button"); div.dataset.idgroupe = groupe.id; div.innerHTML = ` || @@ -456,7 +457,7 @@ .then(r => { return r.json() }) .then(r => { if (r.message == "invalid partition_name" || r.message == "invalid group_name") { - message("Le nom " + name + " existe déjà"); + sco_message("Le nom " + name + " existe déjà"); div.remove(); return; } @@ -537,7 +538,7 @@ .then(r => { return r.json() }) .then(r => { if (r.message == "invalid partition_name" || r.message == "invalid group_name") { - message("Le nom " + name + " existe déjà"); + sco_message("Le nom " + name + " existe déjà"); return; } @@ -828,23 +829,9 @@ return response.text(); }) .then(function(txt) { - message(txt); + sco_message(txt); }); } - /*************************/ - /* Message */ - /*************************/ - - function message(msg) { - var div = document.createElement("div"); - div.className = "message_curtom"; - div.innerHTML = msg; - document.querySelector("body").appendChild(div); - setTimeout(() => { - div.remove(); - }, 3000); - } - \ No newline at end of file diff --git a/app/views/scolar.py b/app/views/scolar.py index 7a760d03..d1e8ebea 100644 --- a/app/views/scolar.py +++ b/app/views/scolar.py @@ -910,7 +910,7 @@ def partition_editor(formsemestre_id: int): "js/partition_editor.js", ], page_title=f"Partitions de {formsemestre.titre_annee()}", - init_datatables=False, + init_datatables=True, ), f"""