From faf41b7220d28f828ef6ae7de3187a345679845e Mon Sep 17 00:00:00 2001
From: Safwan Samsudeen <safwansamsudeen.c@gmail.com>
Date: Wed, 11 Sep 2024 20:49:06 +0530
Subject: [PATCH] fix: use css ids that don't start with number

---
 src/bar.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/bar.js b/src/bar.js
index afa469b..dbbf023 100644
--- a/src/bar.js
+++ b/src/bar.js
@@ -154,7 +154,7 @@ export default class Bar {
             this.gantt.options.column_width;
 
         let $date_highlight = document.createElement('div');
-        $date_highlight.id = `${this.task.id}-highlight`;
+        $date_highlight.id = `highlight-${this.task.id}`;
         $date_highlight.classList.add('date-highlight');
         $date_highlight.style.height = this.height * 0.8 + 'px';
         $date_highlight.style.width = this.width + 'px';
@@ -290,7 +290,7 @@ export default class Bar {
                 (timeout = setTimeout(() => {
                     this.show_popup(e.offsetX || e.layerX);
                     document.getElementById(
-                        `${task_id}-highlight`,
+                        `highlight-${task_id}`,
                     ).style.display = 'block';
                 }, 200)),
         );
@@ -298,7 +298,7 @@ export default class Bar {
         $.on(this.group, 'mouseleave', () => {
             clearTimeout(timeout);
             this.gantt.popup?.hide?.();
-            document.getElementById(`${task_id}-highlight`).style.display =
+            document.getElementById(`highlight-${task_id}`).style.display =
                 'none';
         });