[FEATURE] Traiter les retours sur la flashcard (PIX-15324)

#10771
1024pix · Dec 11, 2024 · 8fd9a34 · 8fd9a34
2 parents e039fa3 + 1525c83
commit 8fd9a34
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 8 deletions.
diff --git a/mon-pix/app/components/module/element/flashcards/_flashcards-card.scss b/mon-pix/app/components/module/element/flashcards/_flashcards-card.scss
@@ -7,7 +7,7 @@
   justify-content: space-between;
   max-width: 345px;
   height: 440px;
-  margin: auto auto var(--pix-spacing-4x);
+  margin: auto auto var(--pix-spacing-2x);
   padding: var(--pix-spacing-6x);
   background: var(--pix-neutral-0);
   border: 5px solid var(--pix-neutral-100);
@@ -70,7 +70,7 @@
     }
 
     &--verso {
-      justify-content: flex-end;
+      justify-content: flex-start;
     }
   }
 }
@@ -84,6 +84,10 @@
 
   &__title {
     @extend %pix-title-s;
+
+    width: 100%;
+    text-align: center;
+    text-wrap: balance;
   }
 }
 
@@ -111,6 +115,8 @@
   }
 
   &__title {
+    @extend %pix-title-xs;
+
     padding: 0 var(--pix-spacing-4x);
     color: var(--pix-neutral-0);
   }

diff --git a/mon-pix/app/components/module/element/flashcards/flashcards.gjs b/mon-pix/app/components/module/element/flashcards/flashcards.gjs
@@ -175,11 +175,11 @@ export default class ModulixFlashcards extends Component {
               <p class="element-flashcards__footer__question">{{t "pages.modulix.flashcards.answerDirection"}}</p>
               <div class="element-flashcards__footer__answer">
                 <button
-                  class="element-flashcards__footer__answer__button element-flashcards__footer__answer__button--no"
+                  class="element-flashcards__footer__answer__button element-flashcards__footer__answer__button--yes"
                   type="button"
-                  {{on "click" (fn this.onSelfAssessment "no")}}
+                  {{on "click" (fn this.onSelfAssessment "yes")}}
                 >
-                  {{t "pages.modulix.buttons.flashcards.answers.no"}}
+                  {{t "pages.modulix.buttons.flashcards.answers.yes"}}
                 </button>
                 <button
                   class="element-flashcards__footer__answer__button element-flashcards__footer__answer__button--almost"
@@ -189,11 +189,11 @@ export default class ModulixFlashcards extends Component {
                   {{t "pages.modulix.buttons.flashcards.answers.almost"}}
                 </button>
                 <button
-                  class="element-flashcards__footer__answer__button element-flashcards__footer__answer__button--yes"
+                  class="element-flashcards__footer__answer__button element-flashcards__footer__answer__button--no"
                   type="button"
-                  {{on "click" (fn this.onSelfAssessment "yes")}}
+                  {{on "click" (fn this.onSelfAssessment "no")}}
                 >
-                  {{t "pages.modulix.buttons.flashcards.answers.yes"}}
+                  {{t "pages.modulix.buttons.flashcards.answers.no"}}
                 </button>
               </div>
             {{/if}}