fix: label colors in executions list

kestra-io · Jan 29, 2025 · 6dfa08a · 6dfa08a
1 parent dd8a45f
commit 6dfa08a
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 16 deletions.
diff --git a/ui/src/components/layout/Labels.vue b/ui/src/components/layout/Labels.vue
@@ -4,7 +4,7 @@
         <el-tag
             v-for="(value, key) in labelMap"
             :key="key"
-            :type="checked(key, value) ? 'primary' : 'info'"
+            :type="checked(key, value) ? 'primary' : 'default'"
             class="me-1 labels"
             size="small"
             disable-transitions
@@ -83,15 +83,3 @@
         }
     };
 </script>
-
-<style lang="scss" scoped>
-    :deep(.el-tag) {
-        & a, span {
-            color: var(--bs-white);
-        }
-
-        &.el-tag--info {
-            background: var(--bs-gray-600);
-        }
-    }
-</style>
diff --git a/ui/src/styles/layout/element-plus-overload.scss b/ui/src/styles/layout/element-plus-overload.scss
@@ -974,11 +974,14 @@ form.ks-horizontal {
 
 // tags
 .el-tag {
-    --el-tag-bg-color: var(--ks-tag-background);
-    --el-tag-hover-color: var(--bs-gray-600-darken-2);
-    --el-tag-text-color: var(--ks-tag-content);
+    --el-tag-bg-color: var(--ks-background-tag);
+    --el-tag-text-color: var(--ks-content-primary);
     border: 0;
 
+    a{
+        color: var(--ks-content-primary);
+    }
+
     @each $i in ($types) {
         &.el-tag--#{$i} {
             --el-tag-text-color: #{darken(map.get($element-colors, $i, 'base'), 45%)};

diff --git a/ui/tests/storybook/components/executions/Executions.fixture.json b/ui/tests/storybook/components/executions/Executions.fixture.json
@@ -29,6 +29,10 @@
                     "type": "io.kestra.plugin.core.trigger.Schedule",
                     "cron": "*/1 * * * *"
                 }
+            ],
+            "labels": [
+                {"key":"airbyte", "value":"007"},
+                {"key":"sync", "value":"false"}
             ]
         },
         {
@@ -71,6 +75,9 @@
                     "type": "io.kestra.plugin.core.log.Log",
                     "message": "Hello from {{ flow.id }}"
                 }
+            ],
+            "labels": [
+                {"key":"kestra", "value":"42"}
             ]
         },
         {
@@ -92,6 +99,9 @@
                     "type": "io.kestra.plugin.core.log.Log",
                     "message": "Hello World! \uD83D\uDE80"
                 }
+            ],
+            "labels": [
+                {"key":"labelwithNoValue"}
             ]
         },
         {
@@ -148,6 +158,9 @@
                     "type": "io.kestra.plugin.core.log.Log",
                     "message": "Hello World! \uD83D\uDE80"
                 }
+            ],
+            "labels": [
+                {"key":"long label with a value", "value":"this is a long value"}
             ]
         },
         {