Demo and small UI fixes

assets/i18n/en.json

@@ -183,6 +183,13 @@
   "I18N_ASSESSMENT_INSTRUCTIONS_HEADING": "Before you begin, here's what to expect:",
   "I18N_ASSESSMENT_INSTRUCTION_AUTO_SUBMIT": "If the timer runs out, your assessment will be auto-submitted.",
   "I18N_ASSESSMENT_INSTRUCTION_FINAL_SUBMISSION": "Your answers are final only when you click \"Submit Assessment\" at the end of the assessment.",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_ATTEMPTED": "Attempted",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_NOT_ATTEMPTED": "Not attempted",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_UNANSWERED": "Unanswered/visited",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_NOT_VISITED": "Not visited",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_ANSWERED": "Answered",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_PREVIEW_DESCRIPTION": "A row of numbers sits above every question. Tap any number to jump straight to that question. The colours tell you where you stand:",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_NAVIGATION": "Each question has a numbered box at the top. Click any numbered box to jump directly to that question.",
   "I18N_ASSESSMENT_INSTRUCTION_MULTIPLE_ATTEMPTS": "You may take the assessment multiple times. If you don't pass, we recommend reviewing the lessons before trying again.",
   "I18N_ASSESSMENT_INSTRUCTION_NAVIGATION": "Use the Back (←) and Next (→) arrows to move between questions.",
   "I18N_ASSESSMENT_INSTRUCTION_NEW_ATTEMPT": "In that case, you can start the assessment again later, which will begin a new attempt.",
@@ -280,7 +287,6 @@
   "I18N_CERTIFICATE_ASSESSMENT_BACK_BUTTON": "Back",
   "I18N_CERTIFICATE_ASSESSMENT_CONTINUE_BUTTON": "Continue to assessment",
   "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_BACK_BUTTON": "Back",
-  "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_CURRENT_PROGRESS": "Current Progress: <[progressPercentage]>%",
   "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_NEXT_BUTTON": "Next",
   "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_SUBMIT_ASSESSMENT_BUTTON": "Submit Assessment",
   "I18N_CERTIFICATE_ASSESSMENT_COOLDOWN_ERROR": "You just started an assessment before this time. Please try again in <[remainingMinutes]> minute(s).",

assets/i18n/fr.json

@@ -174,6 +174,10 @@
   "I18N_ASSESSMENT_INSTRUCTIONS_HEADING": "Avant de commencer, voici ce à quoi vous pouvez vous attendre:",
   "I18N_ASSESSMENT_INSTRUCTION_AUTO_SUBMIT": "Si le temps imparti est écoulé, votre évaluation sera automatiquement soumise.",
   "I18N_ASSESSMENT_INSTRUCTION_FINAL_SUBMISSION": "Vos réponses ne seront définitives que lorsque vous cliquerez sur « Soumettre l’évaluation » à la fin de l’évaluation.",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_ATTEMPTED": "Attempted",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_NOT_ATTEMPTED": "Not attempted",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_UNANSWERED": "Unanswered/visited",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_NAVIGATION": "Each question has a numbered box at the top. Click any numbered box to jump directly to that question.",
   "I18N_ASSESSMENT_INSTRUCTION_MULTIPLE_ATTEMPTS": "Vous pouvez passer l'évaluation plusieurs fois. Si vous ne réussissez pas, nous vous recommandons de revoir les leçons avant de recommencer.",
   "I18N_ASSESSMENT_INSTRUCTION_NAVIGATION": "Utilisez les flèches Retour (←) et Suivant (→) pour passer d'une question à l'autre.",
   "I18N_ASSESSMENT_INSTRUCTION_NEW_ATTEMPT": "Dans ce cas, vous pourrez recommencer l'évaluation plus tard, ce qui constituera une nouvelle tentative.",

assets/i18n/ko.json

@@ -252,7 +252,6 @@
   "I18N_CARD_CONTENT_LIMIT_ERROR_MESSAGE": "카드 내용이 너무 깁니다. 저장하려면 4500자 이내로 작성해 주세요.",
   "I18N_CARD_HEIGHT_LIMIT_WARNING_MESSAGE": "이 카드는 너무 길어서 학생들이 흥미를 잃을 수 있습니다. 길이를 줄이거나 두 장으로 나누는 것을 고려해 보세요.",
   "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_BACK_BUTTON": "뒤로",
-  "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_CURRENT_PROGRESS": "현재 진행 상황: <[progressPercentage]>%",
   "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_NEXT_BUTTON": "다음",
   "I18N_CHAPTER_COMPLETION": "챕터 완료를 축하합니다!",
   "I18N_CLASSROOM_FOUNDATION_TEXT": "<[classroomName]>에서 시작하기 위한 기초 수업입니다.",

assets/i18n/nl.json

@@ -183,6 +183,10 @@
   "I18N_ASSESSMENT_INSTRUCTIONS_HEADING": "Voordat u begint, volgt hier wat u kunt verwachten:",
   "I18N_ASSESSMENT_INSTRUCTION_AUTO_SUBMIT": "Als de timer afloopt, wordt uw toets automatisch ingediend.",
   "I18N_ASSESSMENT_INSTRUCTION_FINAL_SUBMISSION": "Uw antwoorden zijn pas definitief als u aan het einde van de toets op 'Toets indienen' klikt.",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_ATTEMPTED": "Attempted",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_NOT_ATTEMPTED": "Not attempted",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_UNANSWERED": "Unanswered/visited",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_NAVIGATION": "Each question has a numbered box at the top. Click any numbered box to jump directly to that question.",
   "I18N_ASSESSMENT_INSTRUCTION_MULTIPLE_ATTEMPTS": "U mag de toets meerdere keren maken. Als u niet slaagt, raden we u aan de lessen nog eens door te nemen voordat u het opnieuw probeert.",
   "I18N_ASSESSMENT_INSTRUCTION_NAVIGATION": "Gebruik de pijltoetsen Terug (←) en Volgende (→) om tussen de vragen te navigeren.",
   "I18N_ASSESSMENT_INSTRUCTION_NEW_ATTEMPT": "In dat geval kunt u de toets later opnieuw starten, waarmee een nieuwe poging begint.",
@@ -274,7 +278,6 @@
   "I18N_CERTIFICATE_ASSESSMENT_BACK_BUTTON": "Terug",
   "I18N_CERTIFICATE_ASSESSMENT_CONTINUE_BUTTON": "Doorgaan naar de toets",
   "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_BACK_BUTTON": "Terug",
-  "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_CURRENT_PROGRESS": "Huidige voortgang: <[progressPercentage]>%",
   "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_NEXT_BUTTON": "Volgende",
   "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_SUBMIT_ASSESSMENT_BUTTON": "Toets indienen",
   "I18N_CERTIFICATE_ASSESSMENT_DEMONSTRATES_HEADING": "Wat dit certificaat aantoont",

assets/i18n/qqq.json

@@ -183,6 +183,13 @@
   "I18N_ASSESSMENT_INSTRUCTIONS_HEADING": "Heading shown above the list of assessment instructions on the instruction panel.",
   "I18N_ASSESSMENT_INSTRUCTION_AUTO_SUBMIT": "Instruction telling the learner their assessment is auto-submitted when the timer runs out.",
   "I18N_ASSESSMENT_INSTRUCTION_FINAL_SUBMISSION": "Instruction telling the learner their answers are only final once they click Submit Assessment.",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_ATTEMPTED": "Legend label describing a question that has been attempted by the learner.",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_NOT_ATTEMPTED": "Legend label describing a question that has not yet been attempted by the learner.",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_UNANSWERED": "Legend label describing a question the learner has visited but not yet answered.",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_NOT_VISITED": "Legend label describing a question the learner has not yet visited.",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_ANSWERED": "Legend label describing a question the learner has answered.",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_PREVIEW_DESCRIPTION": "Explanatory text above the numbered index grid on the instruction panel, describing how the number navigation works and what the colours mean.",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_NAVIGATION": "Instruction explaining that each question has a numbered box at the top which can be clicked to jump to that question.",
   "I18N_ASSESSMENT_INSTRUCTION_MULTIPLE_ATTEMPTS": "Instruction telling the learner they may retake the assessment.",
   "I18N_ASSESSMENT_INSTRUCTION_NAVIGATION": "Instruction explaining how to navigate between questions using the Back (←) and Next (→) arrows.",
   "I18N_ASSESSMENT_INSTRUCTION_NEW_ATTEMPT": "Instruction explaining that restarting the assessment begins a new attempt.",
@@ -280,7 +287,6 @@
   "I18N_CERTIFICATE_ASSESSMENT_BACK_BUTTON": "Text displayed on the back button in the certificate assessment header. Clicking the button navigate back in the certificate assessment flow.",
   "I18N_CERTIFICATE_ASSESSMENT_CONTINUE_BUTTON": "Text displayed on the button that allows the learner to proceed from the certificate introduction card to the certificate assessment.",
   "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_BACK_BUTTON": "Label for the back button in the certificate assessment question view.",
-  "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_CURRENT_PROGRESS": "Text showing the learner's progress through the certificate assessment questions.",
   "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_NEXT_BUTTON": "Label for the next button in the certificate assessment question view.",
   "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_SUBMIT_ASSESSMENT_BUTTON": "Label for the button that submits the certificate assessment.",
   "I18N_CERTIFICATE_ASSESSMENT_COOLDOWN_ERROR": "Warning message shown when the learner tries to start a new certificate assessment attempt before the cooldown window after their previous attempt has elapsed. <[remainingMinutes]> is replaced with the whole number of minutes they must wait; it is always at least one.",

assets/i18n/sk.json

@@ -183,6 +183,10 @@
   "I18N_ASSESSMENT_INSTRUCTIONS_HEADING": "Skôr než začnete, tu je, čo vás čaká:",
   "I18N_ASSESSMENT_INSTRUCTION_AUTO_SUBMIT": "Ak vyprší časový limit, vaša skúška sa odošle automaticky.",
   "I18N_ASSESSMENT_INSTRUCTION_FINAL_SUBMISSION": "Vaše odpovede sú konečné až vtedy, keď na konci skúšky kliknete na „Odoslať skúšku“.",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_ATTEMPTED": "Attempted",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_NOT_ATTEMPTED": "Not attempted",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_UNANSWERED": "Unanswered/visited",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_NAVIGATION": "Each question has a numbered box at the top. Click any numbered box to jump directly to that question.",
   "I18N_ASSESSMENT_INSTRUCTION_MULTIPLE_ATTEMPTS": "Skúšku môžete absolvovať viackrát. Ak neuspejete, odporúčame si pred ďalším pokusom zopakovať lekcie.",
   "I18N_ASSESSMENT_INSTRUCTION_NAVIGATION": "Medzi otázkami sa pohybujte šípkami Späť (←) a Ďalej (→).",
   "I18N_ASSESSMENT_INSTRUCTION_NEW_ATTEMPT": "V takom prípade môžete skúšku neskôr spustiť znova, čím sa začne nový pokus.",
@@ -273,7 +277,6 @@
   "I18N_CERTIFICATE_ASSESSMENT_BACK_BUTTON": "Späť",
   "I18N_CERTIFICATE_ASSESSMENT_CONTINUE_BUTTON": "Pokračovať na skúšku",
   "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_BACK_BUTTON": "Späť",
-  "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_CURRENT_PROGRESS": "Aktuálny postup: <[progressPercentage]> %",
   "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_NEXT_BUTTON": "Ďalej",
   "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_SUBMIT_ASSESSMENT_BUTTON": "Odoslať skúšku",
   "I18N_CERTIFICATE_ASSESSMENT_DEMONSTRATES_HEADING": "Čo tento certifikát dokazuje",

assets/i18n/tr.json

@@ -183,6 +183,10 @@
   "I18N_ASSESSMENT_INSTRUCTIONS_HEADING": "Başlamadan önce sizi nelerin beklediğine bir göz atalım:",
   "I18N_ASSESSMENT_INSTRUCTION_AUTO_SUBMIT": "Süre dolduğunda değerlendirmeniz otomatik olarak gönderilecektir.",
   "I18N_ASSESSMENT_INSTRUCTION_FINAL_SUBMISSION": "Yanıtlarınız, yalnızca değerlendirmenin sonunda \"Değerlendirmeyi Gönder\" düğmesine tıkladığınızda kesinleşir.",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_ATTEMPTED": "Attempted",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_NOT_ATTEMPTED": "Not attempted",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_UNANSWERED": "Unanswered/visited",
+  "I18N_ASSESSMENT_INSTRUCTION_INDEX_NAVIGATION": "Each question has a numbered box at the top. Click any numbered box to jump directly to that question.",
   "I18N_ASSESSMENT_INSTRUCTION_MULTIPLE_ATTEMPTS": "Değerlendirmeye birden fazla kez katılabilirsiniz. Başarılı olamazsanız tekrar denemeden önce dersleri gözden geçirmenizi öneririz.",
   "I18N_ASSESSMENT_INSTRUCTION_NAVIGATION": "Sorular arasında geçiş yapmak için Geri (←) ve İleri (→) oklarını kullanın.",
   "I18N_ASSESSMENT_INSTRUCTION_NEW_ATTEMPT": "Bu durumda, değerlendirmeye daha sonra yeniden başlayabilirsiniz. Böylece yeni bir deneme başlatmış olursunuz.",
@@ -274,7 +278,6 @@
   "I18N_CERTIFICATE_ASSESSMENT_BACK_BUTTON": "Geri",
   "I18N_CERTIFICATE_ASSESSMENT_CONTINUE_BUTTON": "Değerlendirmeye devam edin",
   "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_BACK_BUTTON": "Geri",
-  "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_CURRENT_PROGRESS": "Mevcut İlerleme: <[progressPercentage]>%",
   "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_NEXT_BUTTON": "İleri",
   "I18N_CERTIFICATE_ASSESSMENT_CONVERSATION_SKIN_SUBMIT_ASSESSMENT_BUTTON": "Değerlendirmeyi Gönder",
   "I18N_CERTIFICATE_ASSESSMENT_DEMONSTRATES_HEADING": "Bu sertifika neleri gösterir",

core/templates/components/certificate-assessment-offering-helper/certificate-assessment-titled-shared-background-banner.component.css

@@ -59,11 +59,14 @@
 @media (max-width: 600px) {
   .oppia-titled-background-banner-header {
     flex-wrap: wrap;
+    justify-content: center;
+    padding: 20px 12px 12px;
   }
 
   .oppia-titled-background-banner-header .col-4 {
-    flex: 0 0 auto;
+    flex: 0 0 100%;
     max-width: none;
+    text-align: right;
   }
 
   .oppia-titled-background-banner-header .col-4:last-child {
@@ -74,9 +77,17 @@
     flex: 1 1 100%;
     margin-bottom: 12px;
     order: -1;
+    padding: 0 8px;
   }
 
   .oppia-titled-background-banner-header h1 {
-    font-size: 1.7rem;
+    font-size: 2.7rem;
+    margin-top: 40px;
+  }
+
+  .oppia-titled-background-banner-button.btn-primary {
+    font-size: 1.6rem;
+    margin-left: 0;
+    width: 120px;
   }
 }

core/templates/components/certificate-assessment-offering-helper/time-expired-modal.component.css

@@ -3,6 +3,7 @@
   border-radius: 10px;
   box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
   font-family: 'Capriola', sans-serif;
+  margin: 0 auto;
   max-width: 525px;
   overflow: hidden;
   padding: 28px 28px 0;

core/templates/components/certificate-assessment-offering-helper/unanswered-question-modal.component.css

@@ -2,6 +2,7 @@
   background: #e9edeb;
   border-radius: 30px;
   box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
+  margin: 0 auto;
   max-width: 520px;
   padding: 28px 28px 24px;
   width: 100%;
@@ -83,3 +84,25 @@
 .assessment-modal-action-button:hover {
   background: #0a4f48;
 }
+
+@media (max-width: 600px) {
+  .assessment-modal-card {
+    border-radius: 20px;
+    margin: 16px auto;
+    max-width: 95%;
+    padding: 20px 16px;
+  }
+
+  .assessment-modal-message {
+    margin-left: 0;
+  }
+
+  .assessment-modal-actions {
+    justify-content: center;
+    margin-left: 0;
+  }
+
+  .assessment-modal-action-button {
+    min-width: 180px;
+  }
+}

core/templates/pages/certificate-assessment-player-page/assessment-instruction-panel.component.css

@@ -41,6 +41,72 @@
   margin-bottom: 8px;
 }
 
+.index-preview-section {
+  background: #f8fafc;
+  border: 1px solid #e2e8f0;
+  border-radius: 6px;
+  margin-bottom: 32px;
+  padding: 16px;
+}
+
+.index-preview-description {
+  color: #333;
+  font-size: 15px;
+  line-height: 1.5;
+  margin-bottom: 16px;
+  text-align: center;
+}
+
+.index-preview-rows {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 16px;
+  justify-content: center;
+}
+
+.index-preview-row {
+  align-items: center;
+  display: flex;
+  gap: 12px;
+}
+
+.index-preview-box {
+  align-items: center;
+  border-radius: 6px;
+  color: #333;
+  display: flex;
+  font-family: 'Roboto', sans-serif;
+  font-size: 14px;
+  font-weight: 600;
+  height: 36px;
+  justify-content: center;
+  min-width: 36px;
+  width: 36px;
+}
+
+.index-preview-box.unvisited {
+  background-color: #fff;
+  border: 2px solid #ccc;
+}
+
+.index-preview-box.visited {
+  background-color: #fff3cd;
+  border: 2px solid #ffc107;
+  color: #856404;
+}
+
+.index-preview-box.attempted {
+  background-color: #d4edda;
+  border: 2px solid #28a745;
+  color: #155724;
+}
+
+.index-preview-label {
+  color: #333;
+  font-family: 'Roboto', sans-serif;
+  font-size: 15px;
+}
+
 .cta-row {
   display: flex;
   justify-content: center;

core/templates/pages/certificate-assessment-player-page/assessment-instruction-panel.component.html

@@ -17,11 +17,34 @@ <h1 class="certificate-title">{{ certificateTitle | titlecase }}</h1>
       <li>
         {{ questionCountInstructionI18nKey | translate: { questions: totalQuestions } }}
       </li>
+      <li>
+        {{ indexNavigationInstructionI18nKey | translate }}
+      </li>
       <li *ngFor="let instructionKey of staticInstructionI18nKeys">
         {{ instructionKey | translate }}
       </li>
     </ul>
 
+    <div class="index-preview-section">
+      <div class="index-preview-description">
+        {{ indexPreviewDescriptionI18nKey | translate }}
+      </div>
+      <div class="index-preview-rows">
+        <div class="index-preview-row">
+          <div class="index-preview-box attempted">1</div>
+          <span class="index-preview-label">{{ indexAttemptedLegendI18nKey | translate }}</span>
+        </div>
+        <div class="index-preview-row">
+          <div class="index-preview-box unvisited">2</div>
+          <span class="index-preview-label">{{ indexNotVisitedLegendI18nKey | translate }}</span>
+        </div>
+        <div class="index-preview-row">
+          <div class="index-preview-box visited">3</div>
+          <span class="index-preview-label">{{ indexAnsweredLegendI18nKey | translate }}</span>
+        </div>
+      </div>
+    </div>
+
     <div class="cta-row">
       <button type="button" class="continue-button"
               (click)="onStartAssessment()">

core/templates/pages/certificate-assessment-player-page/assessment-instruction-panel.component.spec.ts

@@ -93,6 +93,30 @@ describe('AssessmentInstructionPanelComponent', () => {
     ]);
   });
 
+  it('should have the correct i18n key for the index navigation instruction', () => {
+    expect(component.indexNavigationInstructionI18nKey).toBe(
+      'I18N_ASSESSMENT_INSTRUCTION_INDEX_NAVIGATION'
+    );
+  });
+
+  it('should have the correct i18n keys for the index legend', () => {
+    expect(component.indexAttemptedLegendI18nKey).toBe(
+      'I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_ATTEMPTED'
+    );
+    expect(component.indexNotVisitedLegendI18nKey).toBe(
+      'I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_NOT_VISITED'
+    );
+    expect(component.indexAnsweredLegendI18nKey).toBe(
+      'I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_ANSWERED'
+    );
+  });
+
+  it('should have the correct i18n key for the index preview description', () => {
+    expect(component.indexPreviewDescriptionI18nKey).toBe(
+      'I18N_ASSESSMENT_INSTRUCTION_INDEX_PREVIEW_DESCRIPTION'
+    );
+  });
+
   it('should emit startAssessment when onStartAssessment is called', () => {
     spyOn(component.startAssessment, 'emit');
 

core/templates/pages/certificate-assessment-player-page/assessment-instruction-panel.component.ts

@@ -37,6 +37,16 @@ export class AssessmentInstructionPanelComponent {
   timeLimitInstructionI18nKey = 'I18N_ASSESSMENT_INSTRUCTION_TIME_LIMIT';
   questionCountInstructionI18nKey =
     'I18N_ASSESSMENT_INSTRUCTION_QUESTION_COUNT';
+  indexNavigationInstructionI18nKey =
+    'I18N_ASSESSMENT_INSTRUCTION_INDEX_NAVIGATION';
+  indexAttemptedLegendI18nKey =
+    'I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_ATTEMPTED';
+  indexPreviewDescriptionI18nKey =
+    'I18N_ASSESSMENT_INSTRUCTION_INDEX_PREVIEW_DESCRIPTION';
+  indexNotVisitedLegendI18nKey =
+    'I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_NOT_VISITED';
+  indexAnsweredLegendI18nKey =
+    'I18N_ASSESSMENT_INSTRUCTION_INDEX_LEGEND_ANSWERED';
   startAssessmentButtonI18nKey = 'I18N_ASSESSMENT_START_BUTTON';
 
   // Remaining instructions are static text, so no interpolation params