From 81fa2a675fc5a963ed0a7b7d66f11c6385e0342d Mon Sep 17 00:00:00 2001
From: nghtlinh <nghtlinh25@gmail.com>
Date: Wed, 9 Apr 2025 18:15:26 -0400
Subject: [PATCH] Rendered vert task at last + Trying to reposition vert label

---
 packages/mermaid/src/diagrams/gantt/ganttRenderer.js | 11 ++++++-----
 packages/mermaid/src/diagrams/gantt/styles.js        |  2 +-
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/packages/mermaid/src/diagrams/gantt/ganttRenderer.js b/packages/mermaid/src/diagrams/gantt/ganttRenderer.js
index 820f4c805..8bbd00790 100644
--- a/packages/mermaid/src/diagrams/gantt/ganttRenderer.js
+++ b/packages/mermaid/src/diagrams/gantt/ganttRenderer.js
@@ -231,10 +231,11 @@ export const draw = function (text, id, version, diagObj) {
    * @param w
    */
   function drawRects(theArray, theGap, theTopPad, theSidePad, theBarHeight, theColorScale, w) {
+    // Sort theArray so that tasks with `vert` come last
+    theArray.sort((a, b) => (a.vert === b.vert ? 0 : a.vert ? 1 : -1));
     // Get unique task orders. Required to draw the background rects when display mode is compact.
     const uniqueTaskOrderIds = [...new Set(theArray.map((item) => item.order))];
     const uniqueTasks = uniqueTaskOrderIds.map((id) => theArray.find((item) => item.order === id));
-    const numOccurrences = Object.keys(categoryHeights).map((d) => [d, categoryHeights[d]]);
     // Draw background rects covering the entire width of the graph, these form the section rows.
     svg
       .append('g')
@@ -260,7 +261,6 @@ export const draw = function (text, id, version, diagObj) {
         }
         return 'section section0';
       })
-      .data(numOccurrences)
       .enter();
 
     // Draw the rects representing the tasks
@@ -429,9 +429,10 @@ export const draw = function (text, id, version, diagObj) {
         if (d.milestone) {
           endX = startX + theBarHeight;
         }
-        if (d.vert) {
-          endX = startX + theBarHeight;
-        }
+        // if (d.vert) {
+        //   return startX + theSidePad + (endX - startX) / 2 - this.getBBox().width / 2;
+        // }
+
         const textWidth = this.getBBox().width;
 
         let classStr = '';
diff --git a/packages/mermaid/src/diagrams/gantt/styles.js b/packages/mermaid/src/diagrams/gantt/styles.js
index 5b32615a0..2e6dc2b50 100644
--- a/packages/mermaid/src/diagrams/gantt/styles.js
+++ b/packages/mermaid/src/diagrams/gantt/styles.js
@@ -242,8 +242,8 @@ const getStyles = (options) =>
   }
 
   .vertText {
-    font-size: 15px;
     fill: navy;
+    font-size: 15px;
   }
 
   .activeCritText0,