chore: improved status colors (podman-desktop#8236)

Issue podman-desktop#6925 was reopened to tweak the provider status and card carousel colors.
The first thing I found was that providers weren't using the correct colors
(variables or values) to begin with, so that is covered in issue podman-desktop#8234/PR podman-desktop#8235.

Since we are now using consistent/one set of color variables, changing these
status colors for providers implies changing these *everywhere*, including the
status icons for containers, pods, deployments, etc. That said, I thought the
previous colors were a little bright and I prefer these corrected ones in both
light and dark mode.

Fixes podman-desktop#6925.

Signed-off-by: Tim deBoer <[email protected]>

Author: deboer-tim

packages/main/src/plugin/color-registry.ts

@@ -552,7 +552,7 @@ export class ColorRegistry {
 
     this.registerColor(`${ct}card-carousel-card-text`, {
       dark: colorPalette.gray[400],
-      light: colorPalette.purple[900],
+      light: colorPalette.charcoal[500],
     });
 
     this.registerColor(`${ct}card-carousel-nav`, {
@@ -1139,31 +1139,31 @@ export class ColorRegistry {
 
     // Podman & Kubernetes
     this.registerColor(`${status}running`, {
-      dark: colorPalette.green[400],
-      light: colorPalette.green[400],
+      dark: colorPalette.green[500],
+      light: colorPalette.green[600],
     });
     // Kubernetes only
     this.registerColor(`${status}terminated`, {
       dark: colorPalette.red[500],
-      light: colorPalette.red[500],
+      light: colorPalette.red[700],
     });
     this.registerColor(`${status}waiting`, {
       dark: colorPalette.amber[600],
       light: colorPalette.amber[600],
     });
     // Podman only
     this.registerColor(`${status}starting`, {
-      dark: colorPalette.green[600],
+      dark: colorPalette.green[500],
       light: colorPalette.green[600],
     });
     // Stopped & Exited are the same color / same thing in the eyes of statuses
     this.registerColor(`${status}stopped`, {
-      dark: colorPalette.gray[300],
-      light: colorPalette.gray[600],
+      dark: colorPalette.gray[900],
+      light: colorPalette.charcoal[200],
     });
     this.registerColor(`${status}exited`, {
-      dark: colorPalette.gray[300],
-      light: colorPalette.gray[600],
+      dark: colorPalette.gray[900],
+      light: colorPalette.charcoal[200],
     });
     this.registerColor(`${status}not-running`, {
       dark: colorPalette.gray[700],
@@ -1185,7 +1185,7 @@ export class ColorRegistry {
     });
     this.registerColor(`${status}dead`, {
       dark: colorPalette.red[500],
-      light: colorPalette.red[500],
+      light: colorPalette.red[700],
     });
     // If we don't know the status, use gray
     this.registerColor(`${status}unknown`, {