chore: use toggle isntead of checkbox

src/ui/config/config.component.ts

@@ -3,7 +3,7 @@ import { Store, select } from '@ngrx/store';
 import { ViewerConfiguration, ACTION_TYPES } from 'src/services/state/viewerConfig.store'
 import { Observable, Subject, Subscription } from 'rxjs';
 import { map, distinctUntilChanged, debounceTime } from 'rxjs/operators';
-import { MatCheckboxChange } from '@angular/material';
+import { MatSlideToggleChange } from '@angular/material';
 
 const GPU_TOOLTIP = `GPU TOOLTIP`
 const ANIMATION_TOOLTIP = `ANIMATION_TOOLTIP`
@@ -78,7 +78,7 @@ export class ConfigComponent implements OnInit, OnDestroy{
     })
   }
 
-  public toggleAnimationFlag(ev: MatCheckboxChange ){
+  public toggleAnimationFlag(ev: MatSlideToggleChange ){
     const { checked } = ev
     this.store.dispatch({
       type: ACTION_TYPES.UPDATE_CONFIG,

src/ui/config/config.template.html

@@ -32,11 +32,11 @@
   </div>
 </div>
 
-<div>
-  <mat-checkbox
+<div class="d-flex align-items-center">
+  <mat-slide-toggle
     [checked]="animationFlag$ | async"
     (change)="toggleAnimationFlag($event)">
     Enable Animation
-  </mat-checkbox>
+  </mat-slide-toggle>
   <small [matTooltip]="ANIMATION_TOOLTIP" class="ml-2 fas fa-question"></small>
 </div>
\ No newline at end of file

src/ui/sharedModules/angularMaterial.module.ts

@@ -4,12 +4,13 @@ import {
   MatSidenavModule,
   MatCardModule,
   MatTabsModule,
-  MatTooltipModule
+  MatTooltipModule,
+  MatSlideToggleModule
 } from '@angular/material';
 import { NgModule } from '@angular/core';
 
 @NgModule({
-  imports: [MatButtonModule, MatCheckboxModule, MatSidenavModule, MatCardModule, MatTabsModule, MatTooltipModule],
-  exports: [MatButtonModule, MatCheckboxModule, MatSidenavModule, MatCardModule, MatTabsModule, MatTooltipModule],
+  imports: [MatSlideToggleModule, MatButtonModule, MatCheckboxModule, MatSidenavModule, MatCardModule, MatTabsModule, MatTooltipModule],
+  exports: [MatSlideToggleModule, MatButtonModule, MatCheckboxModule, MatSidenavModule, MatCardModule, MatTabsModule, MatTooltipModule],
 })
 export class AngularMaterialModule { }
\ No newline at end of file