storaged: Use PF6 colors for resources

Author: Venefilyn

pkg/storaged/storage.scss

@@ -32,7 +32,7 @@
 }
 
 .ct-card.pf-v6-c-card .pf-v6-c-card__title-text.ct-card-small-title {
-  font-size: var(--pf-v5-global--FontSize--xl);
+  font-size: var(--pf-t--global--font--size--xl);
 }
 
 // Only used in iSCSI dialog
@@ -57,7 +57,7 @@
 
   th {font-weight: bold;
     text-align: start;
-    color: var(--pf-v5-global--palette--black-800);
+    color: var(--pf-t--global--text--color--regular);
     padding-block: 0.75em;
     padding-inline: 0;
   }
@@ -75,7 +75,7 @@
 
 div.progress {
   inline-size: 100%;
-  block-size: var(--pf-v5-global--FontSize-xs);
+  block-size: var(--pf-t--global--font--size--xs);
 }
 
 td.job-description {
@@ -105,21 +105,21 @@ td.job-action {
 }
 
 * + .modal-footer-teardown {
-  padding-block-start: var(--pf-v5-global--spacer--xl);
+  padding-block-start: var(--pf-t--global--spacer--xl);
 }
 
 // FIXME: This is visual only; it needs to be fixed for a11y reasons, likely at the JSX level
 .indent {
-  padding-inline-start: calc(var(--pf-v5-global--spacer--md) * min(var(--level, 0), 10));
+  padding-inline-start: calc(var(--pf-t--global--spacer--md) * min(var(--level, 0), 10));
   white-space: nowrap;
 }
 
 // FIXME: Is this used?
-a.disabled {
-  color: var(--pf-v5-global--palette--light-blue-200);
-  text-decoration: none;
-  cursor: not-allowed;
-}
+// a.disabled {
+//   color: var(--pf-v5-global--palette--light-blue-200);
+//   text-decoration: none;
+//   cursor: not-allowed;
+// }
 
 .widest-title {
   visibility: hidden;
@@ -137,16 +137,16 @@ a.disabled {
 }
 
 .delete-resource-dangerous {
-  color: var(--pf-v5-global--danger-color--200);
+  color: var(--pf-t--global--color--status--danger--default);
 }
 
 .pf-v6-c-modal-box .slot-warning {
-  color: var(--pf-v5-global--danger-color--200);
+  color: var(--pf-t--global--color--status--danger--default);
 }
 
 // This is needed to avoid showing scrollbar in dialog
 .size-slider {
-  padding-block-end: var(--pf-v5-global--spacer--xs);
+  padding-block-end: var(--pf-t--global--spacer--xs);
 }
 
 .panel-heading {
@@ -172,16 +172,16 @@ a.disabled {
 }
 
 // So that "Stored passphrase" fits
-.pf-v6-c-description-list.wide-label {
-  --pf-v5-c-description-list--m-horizontal__term--width: minmax(0, 18ch);
-}
+// .pf-v6-c-description-list.wide-label {
+//   --pf-v5-c-description-list--m-horizontal__term--width: minmax(0, 18ch);
+// }
 
 .pf-v6-c-description-list .pf-v6-c-progress {
   max-inline-size: 30ch;
 }
 
 .usage-bar {
-  --bg-color: var(--pf-v5-global--primary-color--100);
+  --bg-color: var(--pf-t--chart--theme--colorscales--blue--colorscale--100);
   display: inline-block;
   inline-size: 20em;
   block-size: 1rem;
@@ -195,7 +195,7 @@ a.disabled {
   }
 
   &-danger {
-    --bg-color: var(--pf-v5-global--danger-color--100);
+    --bg-color: var(--pf-t--chart--global--danger--color--100);
   }
 
   &-empty {
@@ -329,11 +329,11 @@ a.disabled {
 
   > svg {
     // Bump the icon down to align with text, based on the difference between icon and text size, just for the top
-    inset-block-start: calc((var(--pf-v5-global--spacer--md) * var(--pf-v5-global--LineHeight--md) - var(--icon-size)) / 2);
+    inset-block-start: calc((var(--pf-t--global--spacer--md) * var(--pf-t--global--font--line-height--body) - var(--icon-size)) / 2);
     position: relative;
 
     path {
-      fill: var(--pf-v5-global--Color--200);
+      fill: var(--pf-t--global--text--color--subtle);
     }
   }
 }