From 03cae0e16fd72b049c70613df805e5fa0fefd290 Mon Sep 17 00:00:00 2001
From: Jesse Washburn <jeswashburn@gmail.com>
Date: Thu, 14 Nov 2024 20:16:59 -0500
Subject: [PATCH] linking and steps/questions labels working

---
 .../courses-progress-chart.component.html          |  2 +-
 .../progress-courses/courses-progress-chart.scss   | 14 ++++++--------
 .../courses-progress-leader.component.ts           |  5 +++--
 3 files changed, 10 insertions(+), 11 deletions(-)

diff --git a/src/app/courses/progress-courses/courses-progress-chart.component.html b/src/app/courses/progress-courses/courses-progress-chart.component.html
index 4416e8ead8..5116b8a176 100644
--- a/src/app/courses/progress-courses/courses-progress-chart.component.html
+++ b/src/app/courses/progress-courses/courses-progress-chart.component.html
@@ -1,7 +1,7 @@
 <table class="simple-table">
   <thead>
     <tr>
-      <th i18n>Steps</th>
+      <th *ngIf="showTotals">{ label, select, Steps {Steps} Questions {Questions} other {Steps} }</th>
       <th i18n>Success (%)</th>
       <th i18n>Total Errors</th>
       <!-- Dynamic User Headers -->
diff --git a/src/app/courses/progress-courses/courses-progress-chart.scss b/src/app/courses/progress-courses/courses-progress-chart.scss
index 52e452ea02..934f4528af 100644
--- a/src/app/courses/progress-courses/courses-progress-chart.scss
+++ b/src/app/courses/progress-courses/courses-progress-chart.scss
@@ -1,11 +1,11 @@
 .simple-table {
-  width: 80%; /* Set table width to 80% of the screen */
-  margin: 0 auto; /* Center the table */
+  width: 80%;
+  margin: 0 auto;
   border-collapse: collapse;
   table-layout: fixed;
 
   th, td {
-    padding: 8px; /* Reduced padding for a smaller look */
+    padding: 8px;
     border: 1px solid grey;
     text-align: center;
     vertical-align: middle;
@@ -14,9 +14,9 @@
   th {
     background-color: #f2f2f2;
     font-weight: bold;
-    position: sticky; /* Make the header follow as you scroll */
-    top: 0; /* Stick to the top */
-    z-index: 2; /* Ensure it stays on top of other content */
+    position: sticky;
+    top: 0;
+    z-index: 2;
   }
 
   tr:nth-child(even) {
@@ -46,8 +46,6 @@
     overflow: hidden;
     text-overflow: ellipsis;
   }
-
-  /* Removed the primary-color background */
   
   .wrap-content {
     max-width: 100px;
diff --git a/src/app/courses/progress-courses/courses-progress-leader.component.ts b/src/app/courses/progress-courses/courses-progress-leader.component.ts
index ab0214a78d..0d01025cd9 100644
--- a/src/app/courses/progress-courses/courses-progress-leader.component.ts
+++ b/src/app/courses/progress-courses/courses-progress-leader.component.ts
@@ -80,7 +80,7 @@ export class CoursesProgressLeaderComponent implements OnInit, OnDestroy {
   onStepChange(value: any) {
     this.selectedStep = value;
     this.setSingleStep(this.submissions);
-    this.chartLabel = $localize`Quest.`;
+    this.chartLabel = $localize`Questions`;
   }
 
   setSubmissions() {
@@ -146,6 +146,7 @@ export class CoursesProgressLeaderComponent implements OnInit, OnDestroy {
   setSingleStep(submissions: any[]) {
     const step = this.selectedStep;
     this.headingStart = this.selectedStep.stepTitle;
+    this.chartLabel = $localize`Questions`;
     this.yAxisLength = this.selectedStep.exam.questions.length;
     this.allChartData = submissions.filter(submission => submission.parentId === (step.exam._id + '@' + this.course._id)).map(
       submission => {
@@ -166,7 +167,7 @@ export class CoursesProgressLeaderComponent implements OnInit, OnDestroy {
     if (selectedStep?.exam) {
       this.selectedStep = selectedStep;
       this.onStepChange(this.selectedStep);
-      this.chartLabel = $localize`Question`;
+      this.chartLabel = $localize`Questions`;
     }
   }