fix: colours for consistent ignores styling [IDE-386] (#476)

* fix: colours for consistent ignores styling

* fix: font family and size for code

* chor: add TODO for removing the ignore styling

CHANGELOG.md

@@ -2,6 +2,7 @@
 
 ## [2.12.3]
 - Fix a bug in AI Applyfix on Windows.
+- Changes some of the colours used in the HTML panel so it's consistent with designs.
 
 ## [2.12.2]
 - Refactors the feature flag logic into its own service.

media/views/snykCode/suggestion/suggestionLS.scss

@@ -18,6 +18,7 @@ body {
     text-transform: capitalize;
 }
 
+// TODO: remove ignore styling at the end of cycle 5 2025
 .ignore-warning {
     background: #FFF4ED;
     color: #B6540B;
@@ -35,16 +36,16 @@ body {
 }
 
 .tab-item {
-    color: var(--vscode-foreground);
+    color: var(--vscode-panelTitle-inactiveForeground);
     border-bottom: 1px solid transparent;
 }
 
 .tab-item-icon path {
-    fill: var(--tab-item-github-icon-color);
+    fill: var(--vscode-foreground);
 }
 
-
 .tab-item.is-selected {
+    color: var(--vscode-foreground);
     border-bottom: 3px solid var(--vscode-focusBorder);
 }
 
@@ -65,6 +66,10 @@ body {
     padding-bottom: 0px;
 }
 
+.data-flow-text {
+  font-family: "Courier New", Courier, monospace;
+}
+
 .ignore-details-tab,
 .fix-analysis-tab,
 .vuln-overview-tab {
@@ -77,10 +82,14 @@ body {
 }
 
 .example-line-number,
-.example-line>code {
+.example-line > code {
     color: var(--vscode-editor-foreground);
 }
 
+.example-line > code {
+  font-family: "Courier New", Courier, monospace;
+}
+
 .example-line.added {
     background-color: rgb(204, 255, 216);
 }
@@ -124,6 +133,7 @@ body {
     background-color: var(--vscode-editor-background);
     background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.075));
     box-shadow: 0 -1px 3px rgba(0, 0, 0, .05);
+    border-top: 1px solid var(--vscode-input-border);
 }
 
 .ignore-button.secondary {