feat: center y-axis title in timeline detail chart

src/components/workflows/timeline/BaseTimelineDetailedChart.vue

@@ -88,10 +88,9 @@ function render([data, startDate, endDate, maxY]) {
 
   // Append y-axis title on the left
   svg.append("text")
-      .attr("text-anchor", "end")
       .attr("transform", "rotate(-90)")
       .attr("y", marginLeft - 30)
-      .attr("x", marginTop - 50)
+      .attr("x", -(height / 2 + marginTop) )
       .text(props.yAxisTitle ?? '')
       .attr('fill', colors.gray['400'])
 
@@ -207,7 +206,7 @@ watch([() => props.data, () => props.startDate, () => props.endDate, () => props
 
 <style lang="scss" scoped>
 
-:deep(.svg-container) {
+.svg-container:deep(svg) {
   .releases-group {
     .tag-name {
       font-size: 10px;

src/components/workflows/timeline/TimelineItem.vue

@@ -55,8 +55,8 @@ function hideParametersOverlay() {
     }"
   >
     <template v-slot:header>
-      <div class="flex w-full px-4">
-        <h2 class="w-1/2 text-xl font-bold flex-shrink-0">{{ gt.label }}</h2>
+      <div class="flex w-full px-4 pb-2">
+        <h2 class="w-1/2 text-xl font-bold flex-shrink-0 truncate" :title="gt.label">{{ gt.label }}</h2>
         <div class="w-1/2 flex justify-end">
           <div class="flex overflow-x-auto">
             <MetricAverageChart