From: soufiane <soufiane@cubedesigners.com>
Date: Fri, 19 Jan 2024 14:37:24 +0000 (+0100)
Subject: wip #6593 @4:00
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=7579ffa68c05d3d7931ad954c27c011f88bc8f03;p=fluidbook-toolbox-quiz.git

wip #6593 @4:00
---

diff --git a/js/quiz.screen.outro.js b/js/quiz.screen.outro.js
index cf671be..cd5a39c 100644
--- a/js/quiz.screen.outro.js
+++ b/js/quiz.screen.outro.js
@@ -205,6 +205,8 @@ QuizScreenOutro.prototype = {
         let answersUser = this.quiz.score.answers;
         let wrongIcon = getSpriteIcon("quiz-wrong");
 
+        console.log("score",this.quiz.score)
+
         reviewList = reviewList.map((c, i) => {
             return {
                 'question': c['question'],
@@ -212,20 +214,22 @@ QuizScreenOutro.prototype = {
                 'correctAnswers': c['answers'].filter((c__,k) => {
                     let status_ = c['answers']
                     if(c['type'] === "multiple") {
-                        status_ = c['answers'][k].correct === 1;
+                        status_ = parseInt(c['answers'][k].correct) === 1;
                     }
                     if(!quiz.score.isPassed()) {
                         status_ = status[i].answers[k] !== "missed" && status[i].answers[k] !== "neutral"
                     }
                     return status_
                 }).map((c_,k_) => {
-                    c_ = { ...c_ }; //shallow copy
                     if(c['type'] === "draganddrop" && !quiz.score.isPassed()) {
+                        c_ = { ...c_ }; //shallow copy
                         c_['drop_area'] = answersUser[i][k_]
                     }
-                    if(c['type'] === "match") {
+                    if(c['type'] === "match" && !quiz.score.isPassed()) {
+                        c_ = { ...c_ }; //shallow copy
                         c_['proposition'] = c['answers'][answersUser[i][k_]]['proposition']
                     }
+                    console.log(status[i].answers[k_])
                     c_['status'] = status[i].answers[k_]
                     return c_
                 }),
@@ -242,6 +246,8 @@ QuizScreenOutro.prototype = {
             let statusByAnswer = status[i]
             let nokClass = ""
 
+            console.log(review)
+
             let correctAnswers = review.correctAnswers.length > 0 ? review.correctAnswers : review.data.answers
 
             let titleType = '';
@@ -257,12 +263,13 @@ QuizScreenOutro.prototype = {
                 html += '<p class="question title-block">' + review.question + '</p>';
                 html += '<div class="multiple-wrapper">'
                 for (var j in correctAnswers) {
+                    nokClass = ""
                     if(correctAnswers[j].status === "nok" || correctAnswers[j].status === "missed") {
                         htmlSpan = `<span class="access nok">${wrongIcon}</span>`
                         nokClass = "nok"
                     }
                     html += '<div class="card-holder">';
-                    html += '<p class="answer slot active '+nokClass+'">' + correctAnswers[j].answer+htmlSpan+'</p>';
+                    html += '<p class="answer slot '+nokClass+'">' + correctAnswers[j].answer+htmlSpan+'</p>';
                     html += '</div>';
                 }
                 html += '</div>'
diff --git a/style/100-global.sass b/style/100-global.sass
index 882cd48..7502293 100644
--- a/style/100-global.sass
+++ b/style/100-global.sass
@@ -265,7 +265,7 @@ body
 
     &.simplebar-vertical
         .simplebar-scrollbar::before
-            background-color: $accent-color
+            background-color: +opacity(.32, background-color, $texts-color)
             opacity: 1 !important
             width: 3px
             top: 1px
diff --git a/style/105-outro.sass b/style/105-outro.sass
index 5c7c8b6..ebc1cbc 100644
--- a/style/105-outro.sass
+++ b/style/105-outro.sass
@@ -34,6 +34,7 @@
         h1
             +font-size(40)
             margin-bottom: 9px
+            line-height: normal
 
         .subtitle
             +font-size(16)
@@ -46,7 +47,10 @@
 
         & > .score-text
             text-align: center
-            margin-top: 22px
+            margin-top: 51px
+
+            .m &
+                margin-top: 22px
 
         &.neutral
             .score-text
@@ -57,12 +61,11 @@
 
     &-counter
         height: 0
-        padding-bottom: 43%
+        padding-bottom: 35%
         width: 43%
-        max-width: 210px
+        max-width: 140px
         position: relative
-        +font-size(80)
-        //margin-right: 60px
+        +font-size(56)
         flex-shrink: 0
 
         &.large-nbr
@@ -97,6 +100,15 @@
             background: transparent
             +flex-config(center, false, false, center)
 
+            &:after
+                content: ""
+                position: absolute
+                +opacity(.08,background-color,$neutral-color)
+                width: 130%
+                height: 130%
+                border-radius: 100%
+                z-index: -1
+
             svg
                 overflow: visible
                 width: 100%
@@ -107,7 +119,7 @@
                     stroke-width: 8px
 
                 circle:not(#progress-circle)
-                    +opacity(.08, color, $texts-color)
+                    +opacity(.16, color, $texts-color)
 
                 #overlay-circle
                     display: none
@@ -125,6 +137,15 @@
         padding: 24px 24px 0
         position: relative
 
+        .slot
+            &.active
+                background-color: $neutral-color !important
+            &.nok
+                border: 1px solid $nok-color
+
+        .quiz-wrong
+            color: $neutral-color
+
         h2
             +font-size(24)
             margin-bottom: 5px
@@ -250,7 +271,7 @@
             width: 5px
 
     #anime-result
-        transform: scale(1.7)
+        transform: scale(1.8)
 
     .area-container
         display: grid
@@ -294,7 +315,7 @@
             width: 100%
 
     .area-list
-        display: grid
+        display: flex
         gap: 8px
         height: 100%