fix: reduce log borders on gantt chart logs

kestra-io · Jan 16, 2025 · 960a1bb · 960a1bb
1 parent 246602f
commit 960a1bb
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 38 deletions.
diff --git a/ui/src/components/executions/Gantt.vue b/ui/src/components/executions/Gantt.vue
@@ -441,7 +441,7 @@
 
     // To Separate through Line
     :deep(.vue-recycle-scroller__item-view) {
-        border-bottom: 2px solid var(--ks-border-primary);
+        border-bottom: 1px solid var(--ks-border-primary);
         margin-bottom: 10px;
 
         &:last-child {
@@ -457,22 +457,5 @@
         > .vue-recycle-scroller__item-wrapper > .vue-recycle-scroller__item-view > div {
             border-radius: var(--bs-border-radius-lg);
         }
-
-        .attempt-wrapper {
-            margin-bottom: 0;
-            border: 2px solid var(--ks-border-primary);
-
-            tbody:last-child & {
-                border-bottom: 2px solid var(--ks-border-primary);
-            }
-
-            .attempt-header {
-                padding: .5rem;
-            }
-
-            .line {
-                padding: .5rem;
-            }
-        }
     }
 </style>
diff --git a/ui/src/components/logs/TaskRunDetails.vue b/ui/src/components/logs/TaskRunDetails.vue
@@ -682,19 +682,6 @@
             border-radius: 0px;
         }
 
-        &.even > div > .el-card {
-            background: var(--bs-gray-100);
-
-            html.dark & {
-                background: var(--bs-gray-200);
-            }
-
-            .task-icon {
-                border: none;
-                color: $white;
-            }
-        }
-
         :deep(> .vue-recycle-scroller__item-wrapper > .vue-recycle-scroller__item-view > div) {
             padding-bottom: 1rem;
         }
@@ -704,18 +691,25 @@
         }
 
         .attempt-wrapper {
-            background-color: var(--ks-background-card);
+            background-color: var(--ks-background-input);
+            margin-bottom: 0;
+            border: 1px solid var(--ks-border-primary);
 
-            :deep(.vue-recycle-scroller__item-view + .vue-recycle-scroller__item-view) {
-                border-top: 1px solid var(--ks-border-primary);
+            .attempt-wrapper & {
+                border-radius: .25rem;
+            }
+            
+            tbody:last-child & {
+                border-bottom: 1px solid var(--ks-border-primary);
             }
 
-            html.dark & {
-                background-color: var(--bs-gray-100);
+            .attempt-header {
+                padding: .5rem;
+                border-bottom: 1px solid var(--ks-border-primary);
             }
 
-            .attempt-wrapper & {
-                border-radius: .25rem;
+            .line {
+                padding: .5rem;
             }
         }