diff --git a/node_modules/frappe-gantt/src/bar.js b/node_modules/frappe-gantt/src/bar.js
index 7e0868e..9a5367c 100644
--- a/node_modules/frappe-gantt/src/bar.js
+++ b/node_modules/frappe-gantt/src/bar.js
@@ -77,10 +77,11 @@ export default class Bar {
         this.$bar = createSVG('rect', {
             x: this.x,
             y: this.y,
+            rx: 12,
             width: this.width,
             height: this.height,
-            rx: this.corner_radius,
-            ry: this.corner_radius,
+            // rx: this.corner_radius,
+            // ry: this.corner_radius,
             class: 'bar',
             append_to: this.bar_group
         });
@@ -97,10 +98,11 @@ export default class Bar {
         this.$bar_progress = createSVG('rect', {
             x: this.x,
             y: this.y,
+            rx: 12,
             width: this.progress_width,
             height: this.height, 
-            rx: this.corner_radius,
-            ry: this.corner_radius,
+            // rx: this.corner_radius,
+            // ry: this.corner_radius,
             class: 'bar-progress',
             append_to: this.bar_group
         });
@@ -112,7 +114,7 @@ export default class Bar {
         createSVG('text', {
             x: this.x + this.width / 2,
             y: this.y + this.height / 2,
-            innerHTML: this.task.name,
+            innerHTML: Math.round((100 * this.progress_width) / this.width) + " %",
             class: 'bar-label',
             append_to: this.bar_group
         });
@@ -129,10 +131,11 @@ export default class Bar {
         createSVG('rect', {
             x: bar.getX() + bar.getWidth() - 9,
             y: bar.getY() + 1,
+            rx: 12,
             width: handle_width,
             height: this.height - 2,
-            rx: this.corner_radius,
-            ry: this.corner_radius,
+            // rx: this.corner_radius,
+            // ry: this.corner_radius,
             class: 'handle right',
             append_to: this.handle_group
         });
@@ -140,10 +143,11 @@ export default class Bar {
         createSVG('rect', {
             x: bar.getX() + 1,
             y: bar.getY() + 1,
+            rx: 12,
             width: handle_width,
             height: this.height - 2,
-            rx: this.corner_radius,
-            ry: this.corner_radius,
+            // rx: this.corner_radius,
+            // ry: this.corner_radius,
             class: 'handle left',
             append_to: this.handle_group
         });
@@ -367,7 +371,7 @@ export default class Bar {
     }
 
     update_label_position() {
-        const bar = this.$bar,
+        const bar = this.$bar_progress,
             label = this.group.querySelector('.bar-label');
 
         if (label.getBBox().width > bar.getWidth()) {
@@ -375,7 +379,7 @@ export default class Bar {
             label.setAttribute('x', bar.getX() + bar.getWidth() + 5);
         } else {
             label.classList.remove('big');
-            label.setAttribute('x', bar.getX() + bar.getWidth() / 2);
+            label.setAttribute('x', bar.getX() + bar.getWidth() - 15);
         }
     }
 
diff --git a/node_modules/frappe-gantt/src/gantt.scss b/node_modules/frappe-gantt/src/gantt.scss
deleted file mode 100644
index 9c91dad..0000000
--- a/node_modules/frappe-gantt/src/gantt.scss
+++ /dev/null
@@ -1,168 +0,0 @@
-$bar-color: #b8c2cc !default;
-$bar-stroke: #8D99A6 !default;
-$border-color: #e0e0e0 !default;
-$light-bg: #f5f5f5 !default;
-$light-border-color: #ebeff2 !default;
-$light-yellow: #fcf8e3 !default;
-$text-muted: #666 !default;
-$text-light: #555 !default;
-$text-color: #333 !default;
-$blue: #a3a3ff !default;
-$handle-color: #ddd !default;
-
-.gantt {
-	.grid-background {
-		fill: none;
-	}
-	.grid-header {
-		fill: #ffffff;
-		stroke: $border-color;
-		stroke-width: 1.4;
-	}
-	.grid-row {
-		fill: #ffffff;
-	}
-	.grid-row:nth-child(even) {
-		fill: $light-bg;
-	}
-	.row-line {
-		stroke: $light-border-color;
-	}
-	.tick {
-		stroke: $border-color;
-		stroke-width: 0.2;
-		&.thick {
-			stroke-width: 0.4;
-		}
-	}
-	.today-highlight {
-		fill: $light-yellow;
-		opacity: 0.5;
-	}
-
-	.arrow {
-		fill: none;
-		stroke: $text-muted;
-		stroke-width: 1.4;
-	}
-
-	.bar {
-		fill: $bar-color;
-		stroke: $bar-stroke;
-		stroke-width: 0;
-		transition: stroke-width .3s ease;
-		user-select: none;
-	}
-	.bar-progress {
-		fill: $blue;
-	}
-	.bar-invalid {
-		fill: transparent;
-		stroke: $bar-stroke;
-		stroke-width: 1;
-		stroke-dasharray: 5;
-
-		&~.bar-label {
-			fill: $text-light;
-		}
-	}
-	.bar-label {
-		fill: #fff;
-		dominant-baseline: central;
-		text-anchor: middle;
-		font-size: 12px;
-		font-weight: lighter;
-
-		&.big {
-			fill: $text-light;
-			text-anchor: start;
-		}
-	}
-
-	.handle {
-		fill: $handle-color;
-		cursor: ew-resize;
-		opacity: 0;
-		visibility: hidden;
-		transition: opacity .3s ease;
-	}
-
-	.bar-wrapper {
-		cursor: pointer;
-		outline: none;
-
-		&:hover {
-			.bar {
-				fill: darken($bar-color, 5);
-			}
-
-			.bar-progress {
-				fill: darken($blue, 5);
-			}
-
-			.handle {
-				visibility: visible;
-				opacity: 1;
-			}
-		}
-
-		&.active {
-			.bar {
-				fill: darken($bar-color, 5);
-			}
-
-			.bar-progress {
-				fill: darken($blue, 5);
-			}
-		}
-	}
-
-	.lower-text, .upper-text {
-		font-size: 12px;
-		text-anchor: middle;
-	}
-	.upper-text {
-		fill: $text-light;
-	}
-	.lower-text {
-		fill: $text-color;
-	}
-
-	.hide {
-		display: none;
-	}
-}
-
-.gantt-container {
-	position: relative;
-	overflow: auto;
-	font-size: 12px;
-
-	.popup-wrapper {
-		position: absolute;
-		top: 0;
-		left: 0;
-		background: rgba(0, 0, 0, 0.8);
-		padding: 0;
-		color: #959da5;
-		border-radius: 3px;
-
-		.title {
-			border-bottom: 3px solid $blue;
-			padding: 10px;
-		}
-
-		.subtitle {
-			padding: 10px;
-			color: #dfe2e5;
-		}
-
-		.pointer {
-			position: absolute;
-			height: 5px;
-			margin: 0 0 0 -5px;
-			border: 5px solid transparent;
-			border-top-color: rgba(0, 0, 0, 0.8);
-		}
-	}
-}
\ No newline at end of file
diff --git a/node_modules/frappe-gantt/src/index.js b/node_modules/frappe-gantt/src/index.js
index 209b3f0..14c44c4 100644
--- a/node_modules/frappe-gantt/src/index.js
+++ b/node_modules/frappe-gantt/src/index.js
@@ -4,7 +4,8 @@ import Bar from './bar';
 import Arrow from './arrow';
 import Popup from './popup';
 
-import './gantt.scss';
+
+let month = "";
 
 export default class Gantt {
     constructor(wrapper, tasks, options) {
@@ -65,8 +66,8 @@ export default class Gantt {
 
     setup_options(options) {
         const default_options = {
-            header_height: 50,
-            column_width: 30,
+            header_height: 54.5,
+            column_width: 130,
             step: 24,
             view_modes: [
                 'Quarter Day',
@@ -76,7 +77,7 @@ export default class Gantt {
                 'Month',
                 'Year'
             ],
-            bar_height: 20,
+            bar_height: 36,
             bar_corner_radius: 3,
             arrow_curve: 5,
             padding: 18,
@@ -182,22 +183,22 @@ export default class Gantt {
 
         if (view_mode === 'Day') {
             this.options.step = 24;
-            this.options.column_width = 38;
+            this.options.column_width = 156.5;
         } else if (view_mode === 'Half Day') {
-            this.options.step = 24 / 2;
+            this.options.step = 124 / 2;
             this.options.column_width = 38;
         } else if (view_mode === 'Quarter Day') {
-            this.options.step = 24 / 4;
+            this.options.step = 124 / 4;
             this.options.column_width = 38;
         } else if (view_mode === 'Week') {
-            this.options.step = 24 * 7;
-            this.options.column_width = 140;
+            this.options.step = 124 * 7;
+            this.options.column_width = 1140;
         } else if (view_mode === 'Month') {
-            this.options.step = 24 * 30;
-            this.options.column_width = 120;
+            this.options.step = 23.825 * 30;
+            this.options.column_width = 160;
         } else if (view_mode === 'Year') {
-            this.options.step = 24 * 365;
-            this.options.column_width = 120;
+            this.options.step = 124 * 365;
+            this.options.column_width = 1120;
         }
     }
 
@@ -331,26 +332,50 @@ export default class Gantt {
 
         let row_y = this.options.header_height + this.options.padding / 2;
 
-        for (let task of this.tasks) {
-            createSVG('rect', {
-                x: 0,
-                y: row_y,
-                width: row_width,
-                height: row_height,
-                class: 'grid-row',
-                append_to: rows_layer
-            });
+        if(this.tasks.length < 16){
+            for (let i=0;i<17;i++) { // let task of this.tasks
+                createSVG('rect', {
+                    x: 0,
+                    y: row_y,
+                    width: row_width,
+                    height: row_height,
+                    class: 'grid-row',
+                    append_to: rows_layer
+                });
     
-            createSVG('line', {
-                x1: 0,
-                y1: row_y + row_height,
-                x2: row_width,
-                y2: row_y + row_height,
-                class: 'row-line',
-                append_to: lines_layer
-            });
+                createSVG('line', {
+                    x1: 0,
+                    y1: row_y + row_height,
+                    x2: row_width,
+                    y2: row_y + row_height,
+                    class: 'row-line',
+                    append_to: lines_layer
+                });
     
-            row_y += this.options.bar_height + this.options.padding;
+                row_y += this.options.bar_height + this.options.padding;
+            }
+        }else{
+            for (let task of this.tasks) { // let task of this.tasks
+                createSVG('rect', {
+                    x: 0,
+                    y: row_y,
+                    width: row_width,
+                    height: row_height,
+                    class: 'grid-row',
+                    append_to: rows_layer
+                });
+    
+                createSVG('line', {
+                    x1: 0,
+                    y1: row_y + row_height,
+                    x2: row_width,
+                    y2: row_y + row_height,
+                    class: 'row-line',
+                    append_to: lines_layer
+                });
+    
+                row_y += this.options.bar_height + this.options.padding;
+            }
         }
     }
 
@@ -371,8 +396,8 @@ export default class Gantt {
         let tick_x = 0;
         let tick_y = this.options.header_height + this.options.padding / 2;
         let tick_height =
-            (this.options.bar_height + this.options.padding) *
-            this.tasks.length;
+            10000; /* (this.options.bar_height + this.options.padding) *
+            this.tasks.length*/
 
         for (let date of this.dates) {
             let tick_class = 'tick';
@@ -439,6 +464,9 @@ export default class Gantt {
 
     make_dates() {
         for (let date of this.get_dates_to_draw()) {
+            if(date.upper_text){
+                month = date.upper_text.substring(0,3);
+            }
             createSVG('text', {
                 x: date.lower_x,
                 y: date.lower_y,
