diff --git a/demo-shell-ng2/app/components/login/login-demo.component.css b/demo-shell-ng2/app/components/login/login-demo.component.css
index b167ae7bbb..32185b2b02 100644
--- a/demo-shell-ng2/app/components/login/login-demo.component.css
+++ b/demo-shell-ng2/app/components/login/login-demo.component.css
@@ -35,3 +35,6 @@
     }
 }
 
+.settings >>> .mat-slide-toggle-thumb-container {
+    cursor: pointer;
+}
diff --git a/demo-shell-ng2/app/components/login/login-demo.component.html b/demo-shell-ng2/app/components/login/login-demo.component.html
index bdb67cda16..3d2cbab27e 100644
--- a/demo-shell-ng2/app/components/login/login-demo.component.html
+++ b/demo-shell-ng2/app/components/login/login-demo.component.html
@@ -5,7 +5,7 @@
         <md-slide-toggle
             id="switch1"
             [color]="'primary'"
-            (click)="toggleECM()"
+            (change)="toggleECM()"
             [checked]="isECM">
             Content Services
         </md-slide-toggle>
@@ -14,7 +14,7 @@
         <md-slide-toggle
             id="switch2"
             [color]="'primary'"
-            (click)="toggleBPM()"
+            (change)="toggleBPM()"
             [checked]="isBPM">
             Process Services
         </md-slide-toggle>
@@ -23,7 +23,7 @@
         <md-slide-toggle
             id="switch3"
             [color]="'primary'"
-            (click)="toggleCSRF()"
+            (change)="toggleCSRF()"
             [checked]="!disableCsrf">
             CSRF
         </md-slide-toggle>
@@ -32,7 +32,7 @@
         <md-slide-toggle
             id="switch4"
             [color]="'primary'"
-            (click)="toggleFooter()"
+            (change)="toggleFooter()"
             [checked]="showFooter">
             Login footer
         </md-slide-toggle>