From 6317da3d4356cc99feb2533e7a7891bc71f24b20 Mon Sep 17 00:00:00 2001
From: Randy Woods <randy1@radiorandy.com>
Date: Wed, 6 Nov 2024 15:06:51 -0700
Subject: [PATCH] Added styling to the MCR to aid in readability

Mainly the sub-header-1 and sub-header-2 styles which are used in CSET proper, are now available in the MCR output.
---
 .../module-content.component.scss             |  3 +-
 .../module-content.component.ts               |  5 ++--
 CSETWebNg/src/app/reports/reports.scss        | 30 +++++++++++++++++--
 3 files changed, 32 insertions(+), 6 deletions(-)

diff --git a/CSETWebNg/src/app/reports/module-content/module-content/module-content.component.scss b/CSETWebNg/src/app/reports/module-content/module-content/module-content.component.scss
index 6d71268b8d..fbbd800063 100644
--- a/CSETWebNg/src/app/reports/module-content/module-content/module-content.component.scss
+++ b/CSETWebNg/src/app/reports/module-content/module-content/module-content.component.scss
@@ -21,6 +21,7 @@ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 SOFTWARE. 
 
 */
+
 .color1 {
     color: #044;
 }
@@ -37,4 +38,4 @@ SOFTWARE.
 
 .resource-table td.section-ref {
     white-space: nowrap;
-}
\ No newline at end of file
+}
diff --git a/CSETWebNg/src/app/reports/module-content/module-content/module-content.component.ts b/CSETWebNg/src/app/reports/module-content/module-content/module-content.component.ts
index 4f8878b734..737b5ac00f 100644
--- a/CSETWebNg/src/app/reports/module-content/module-content/module-content.component.ts
+++ b/CSETWebNg/src/app/reports/module-content/module-content/module-content.component.ts
@@ -21,7 +21,7 @@
 //  SOFTWARE.
 //
 ////////////////////////////////
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, ViewEncapsulation } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 import { ReportService } from '../../../services/report.service';
 
@@ -29,7 +29,8 @@ import { ReportService } from '../../../services/report.service';
 @Component({
   selector: 'app-module-content',
   templateUrl: './module-content.component.html',
-  styleUrls: ['./module-content.component.scss', '../../../reports/reports.scss']
+  styleUrls: ['../../../reports/reports.scss', './module-content.component.scss'],
+  encapsulation: ViewEncapsulation.None
 })
 export class ModuleContentComponent implements OnInit {
 
diff --git a/CSETWebNg/src/app/reports/reports.scss b/CSETWebNg/src/app/reports/reports.scss
index a4ab9645c0..3b96bd6c79 100644
--- a/CSETWebNg/src/app/reports/reports.scss
+++ b/CSETWebNg/src/app/reports/reports.scss
@@ -26,9 +26,13 @@ SOFTWARE.
 
 $primary-color: #052637;
 $secondary-color: #094997;
+
 $gray-50: #fafafa;
 $gray-100: #f2f2f2;
 
+$primary-550: $primary-color;
+$primary-900: $secondary-color;
+
 
 * {
   font-family: Arial, sans-serif;
@@ -525,7 +529,8 @@ table.assessment-summary th {
   padding: .5rem;
 }
 
-.table.table-td-p2 th, .table.table-td-p2 td {
+.table.table-td-p2 th,
+.table.table-td-p2 td {
   padding: .5rem !important;
 }
 
@@ -1917,14 +1922,33 @@ div.spinner-size-50 {
 
 
 
-///   CPG Styles ////////////////////////////////////////////////
+///   Supplemental Guidance Styles ////////////////////////////////////////////////
+
 .sub-header-1 {
   font-weight: bold;
-  font-size: 1.05rem;
+  font-size: 1.1rem;
+  color: $primary-550;
 }
 
+.sub-header-2 {
+  font-weight: bold;
+  font-size: 1rem;
+  color: $primary-900;
+}
 
+ol.alpha-bracket {
+  list-style-type: none;
+  counter-reset: list-counter;
+}
+
+ol.alpha-bracket li {
+  counter-increment: list-counter;
+  margin-bottom: 5px;
+}
 
+ol.alpha-bracket li::before {
+  content: "[" counter(list-counter, lower-alpha) "] ";
+}