Merge pull request #287 from microsoft/v-keshakumar/ColorandSelectFunctionality

Update diff editor color and fix SHIFT+select feature in ALM toolkit

AlmToolkit/AlmToolkit/html-resources/dist/3rdpartylicenses.txt

@@ -1,5 +1,5 @@
 @angular/common
-MITcd 
+MIT
 
 @angular/core
 MIT

AlmToolkit/AlmToolkit/html-resources/src/app/grid/grid.component.css

@@ -19,7 +19,6 @@ html, body {
 }
 
 #comparison-table-container {
-  display: flex;
   height: 72.22%;
   overflow-y: auto;
   background-color: #F2F2F2;

AlmToolkit/AlmToolkit/html-resources/src/app/grid/grid.component.ts

@@ -356,8 +356,11 @@ export class GridComponent implements OnInit {
 
     // Find all elements above or below this row and select them as well
     while (isSiblingAvailable) {
-      siblingRow = this.getSiblingElement(directionToMove, startRowId) as HTMLElement;
-      if (siblingRow && siblingRow.id && siblingRow.id == endRowId) {
+      siblingRow = directionToMove
+        ? document.getElementById(startRowId)?.previousElementSibling as HTMLElement
+        : document.getElementById(startRowId)?.nextElementSibling as HTMLElement;
+
+      if (siblingRow?.id && siblingRow.id !== endRowId) {
         startRowId = siblingRow.id;
         document.getElementById(startRowId + '-' + columnType)!.focus();
         nodeSelected = this.comparisonDataToDisplay
@@ -370,7 +373,9 @@ export class GridComponent implements OnInit {
         }
 
         siblingRow.focus();
-        siblingRow = this.getSiblingElement(directionToMove, startRowId) as HTMLElement;
+        siblingRow = directionToMove
+          ? document.getElementById(startRowId)?.previousElementSibling as HTMLElement
+          : document.getElementById(startRowId)?.nextElementSibling as HTMLElement;
       } else {
         isSiblingAvailable = false;
       }

AlmToolkit/AlmToolkit/html-resources/src/app/tmdl-utils/tmdl-color-palette.ts

@@ -15,5 +15,10 @@ export const lightPalette: TMDLPalette = {
     { token: "variable", foreground: "001080" },
     { token: "attribute", foreground: "795e26" },
   ],
-  colors: {},
+  colors: {
+    'diffEditor.insertedTextBackground': '#ff000033',
+    'diffEditor.removedTextBackground': '#e2f6c5',
+    "diffEditor.insertedLineBackground": "#ff000033",
+    "diffEditor.removedLineBackground": "#e2f6c5",
+  },
 };