fix: Tree view badges can have low contrast

Fixes #6245

Author: starpit

packages/core/src/webapp/themes/persistence.ts

@@ -130,6 +130,8 @@ export const switchTo = async (theme: string, saveNotNeeded = false): Promise<vo
   document.body.setAttribute('kui-theme-key', themeKey)
   document.body.setAttribute('kui-theme-style', themeModel.style) // dark versus light
 
+  document.body.classList.add(themeModel.style === 'dark' ? 'pf-t-dark' : 'pf-t-light')
+
   if (themeModel.attrs) {
     themeModel.attrs.forEach(attr => document.body.classList.add(attr))
   }

plugins/plugin-client-common/web/scss/PatternFly/kui-alignment.scss

@@ -130,11 +130,11 @@
   --pf-global--FontWeight--bold: 600;
   --pf-global--FontWeight--redhatfont--bold: 700;
 
-  --pf-global--link--Color: #06c;
+  --pf-global--link--Color: var(--color-brand-01);
   --pf-global--link--Color--hover: #004080;
-  --pf-global--link--Color--light: #73bcf7;
+  --pf-global--link--Color--light: var(--color-brand-01);
   --pf-global--link--Color--light--hover: #2b9af3;
-  --pf-global--link--Color--dark: #06c;
+  --pf-global--link--Color--dark: var(--color-brand-01);
   --pf-global--link--Color--dark--hover: #004080;
 
   --pf-global--BorderColor--100: #d2d2d2;
@@ -203,4 +203,6 @@
   --pf-global--link--Color: var(--pf-global--link--Color--light);
   --pf-global--link--Color--hover: var(--pf-global--link--Color--light);
   --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--dark-100);
+  --pf-global--BackgroundColor--200: var(--pf-global--BackgroundColor--dark-200);
+  --pf-global--BackgroundColor--300: var(--pf-global--BackgroundColor--dark-300);
 }

plugins/plugin-core-themes/web/scss/dark.scss

@@ -12,7 +12,7 @@ body[kui-theme='Dark'] {
   --color-base01: #202529; /* Lighter Background (Used for status bars) */
   --color-base02: #272c30; /* Selection Background */
   --color-base03: #373d42;
-  --color-base04: #565656; /* Dark Foreground (Used for status bars) */
+  --color-base04: #8d8d8d; /* Dark Foreground (Used for status bars) */
   --color-base05: #9fa5ad; /* Default Foreground, Caret, Delimiters, Operators */
   --color-base06: #f2f4f8; /* Light Foreground (Not often used) */
   --color-base07: #ffffff; /* Light Background (Not often used) */

plugins/plugin-core-themes/web/scss/light.scss

@@ -9,7 +9,7 @@ body[kui-theme='Light'] .kui--inverted-color-context {
   --color-base01: #202529; /* Lighter Background (Used for status bars) */
   --color-base02: #272c30; /* Selection Background */
   --color-base03: #373d42;
-  --color-base04: #565656; /* Dark Foreground (Used for status bars) */
+  --color-base04: #8d8d8d; /* Dark Foreground (Used for status bars) */
   --color-base05: #9fa5ad; /* Default Foreground, Caret, Delimiters, Operators */
   --color-base06: #f2f4f8; /* Light Foreground (Not often used) */
   --color-base07: #ffffff; /* Light Background (Not often used) */