fix: improve readability of code elements in high-contrast themes (#508)

snyk · Aug 12, 2024 · 71c527b · 71c527b
1 parent 167062f
commit 71c527b
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,8 @@
 # Snyk Security Changelog
 
+## [2.16.3]
+- fix readability of `code` elements within the **overview** section when using high-contrast themes (both dark and light). Text color now matches the background.
+
 ## [2.16.2]
 - updated the language server protocol version to 14 to support new communication model.
 

diff --git a/media/views/oss/suggestion/suggestion.scss b/media/views/oss/suggestion/suggestion.scss
@@ -22,7 +22,7 @@
 }
 
 .delimiter {
-  border-right:1px solid var(--vscode-input-border);
+  border-right: 1px solid var(--vscode-input-border);
 }
 
 .vulnerability-overview pre {
@@ -37,3 +37,13 @@
   font-size: var(--vscode-editor-font-size);
   font-family: var(--vscode-editor-font-family);
 }
+
+/* High-contrast dark mode */
+.vscode-high-contrast:not(.vscode-high-contrast-light) .vulnerability-overview code {
+  color: var(--vscode-editor-background);
+}
+
+/* High-contrast light mode */
+.vscode-high-contrast.vscode-high-contrast-light .vulnerability-overview code {
+  color: var(--vscode-editor-background);
+}