UI update for Free drawing mode

Author: Saqib92

src/app/app.component.html

@@ -6,14 +6,14 @@ <h4>Github: <a href="https://github.com/kevoj/angular-editor-fabric-js">angular-
       <div class="col-xl-12">
           <div class="row">
               <div class="col-xl-12 text-right">
-                  <button data-toggle="tooltip" data-placement="bottom" title="Export to image" type="button" class="btn btn-primary" (click)="rasterize();">
+                  <button data-toggle="tooltip" data-placement="bottom" title="Export to image" type="button" class="btn btn-primary m-1" (click)="rasterize();">
                       <i class="fa fa-download" aria-hidden="true"></i> Export to image</button>
-                  <button data-toggle="tooltip" data-placement="bottom" title="Export to SVG" type="button" class="btn btn-primary" (click)="rasterizeSVG();">
+                  <button data-toggle="tooltip" data-placement="bottom" title="Export to SVG" type="button" class="btn btn-primary m-1" (click)="rasterizeSVG();">
                       <i class="fa fa-download" aria-hidden="true"></i> Export to SVG</button>
-                  <button data-toggle="tooltip" data-placement="bottom" title="Save in localStorage" type="button" class="btn btn-primary"
+                  <button data-toggle="tooltip" data-placement="bottom" title="Save in localStorage" type="button" class="btn btn-primary m-1"
                       (click)="saveCanvasToJSON();">
                       <i class="fa fa-save" aria-hidden="true"></i> Save local</button>
-                  <button data-toggle="tooltip" data-placement="bottom" title="Load from localStorage" type="button" class="btn btn-primary"
+                  <button data-toggle="tooltip" data-placement="bottom" title="Load from localStorage" type="button" class="btn btn-primary m-1"
                       (click)="loadCanvasFromJSON();">
                       <i class="fa fa-save" aria-hidden="true"></i> Load local</button>
                   <button data-toggle="tooltip" data-placement="bottom" title="Clean Canvas" type="button" class="btn btn-danger" (click)="confirmClear();">
@@ -52,16 +52,21 @@ <h4>Github: <a href="https://github.com/kevoj/angular-editor-fabric-js">angular-
           </div>
           <br/>
           <div class="card">
-            <div class="card-header">Drawing Mode</div>
+            <div class="card-header">Free Drawing Mode</div>
             <div class="card-body">
                 <div class="input-group">
-                    
+
                     <div class="input-group-append">
-                        <span class="input-group-text">
-                            <button id="add-text" data-toggle="tooltip" data-placement="bottom" title="Drawing Mode" class="btn btn-primary" (click)="drawMode()">
+                      <div class="custom-control custom-switch">
+                        <input type="checkbox" class="custom-control-input" checked id="customSwitch1" (click)="drawMode()">
+                        <label class="custom-control-label" for="customSwitch1">Enable / Disable</label>
+                      </div>
+                        <!-- <span class="input-group-text">
+
+                             <button id="add-text" data-toggle="tooltip" data-placement="bottom" title="Drawing Mode" class="btn btn-primary" (click)="drawMode()">
                                 <i class="fa fa-plus" aria-hidden="true"></i>
                             </button>
-                        </span>
+                        </span> -->
                     </div>
                 </div>
             </div>