From 50fc169e76b5e39f0d5d522646b5009d88786c61 Mon Sep 17 00:00:00 2001
From: mauriziovitale84 <maurizio.vitale@alfresco.com>
Date: Thu, 8 Sep 2016 08:28:07 +0100
Subject: [PATCH] Remove hardcoded css style

---
 .../app/components/login/login-demo.component.css      | 10 ++++++++++
 .../app/components/login/login-demo.component.html     |  8 ++++----
 .../app/components/login/login-demo.component.ts       |  1 +
 3 files changed, 15 insertions(+), 4 deletions(-)
 create mode 100644 demo-shell-ng2/app/components/login/login-demo.component.css

diff --git a/demo-shell-ng2/app/components/login/login-demo.component.css b/demo-shell-ng2/app/components/login/login-demo.component.css
new file mode 100644
index 0000000000..e0d26ce54f
--- /dev/null
+++ b/demo-shell-ng2/app/components/login/login-demo.component.css
@@ -0,0 +1,10 @@
+.setting {
+    border-radius: 8px; position: absolute; background-color: papayawhip; color: cadetblue; left: 10px; top: 10px;  z-index: 1;
+}
+.banned{
+    width:130px;margin: 10px;
+}
+
+.toggle {
+    width:120px;margin: 20px;
+}
\ No newline at end of file
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 bf8b9a4d95..dbc7ee20ca 100644
--- a/demo-shell-ng2/app/components/login/login-demo.component.html
+++ b/demo-shell-ng2/app/components/login/login-demo.component.html
@@ -1,17 +1,17 @@
-<div style="border-radius: 8px; position: absolute; background-color: papayawhip; color: cadetblue; left: 10px; top: 10px; z-index: 1;">
-    <p style="width:120px;margin: 20px;">
+<div class="setting">
+    <p class="toggle">
         <label for="switch1" class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
             <input type="checkbox" id="switch1" class="mdl-switch__input" checked (click)="toggleECM(ecm.checked)" #ecm>
             <span class="mdl-switch__label">ECM</span>
         </label>
     </p>
-    <p style="width:120px;margin: 20px;">
+    <p class="toggle">
         <label for="switch2" class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
             <input type="checkbox" id="switch2" class="mdl-switch__input"  (click)="toggleBPM(bpm.checked)" #bpm>
             <span class="mdl-switch__label">BPM</span>
         </label>
     </p>
-    <p style="width:130px;margin: 10px;">
+    <p class="banned">
         <label for="blacklistusername">Banned username</label><br>
         <input id="blacklistusername" type="text" placeholder="banned username" [(ngModel)]="blackListUsername" />
     </p>
diff --git a/demo-shell-ng2/app/components/login/login-demo.component.ts b/demo-shell-ng2/app/components/login/login-demo.component.ts
index adf98319fa..693bcbcb1b 100644
--- a/demo-shell-ng2/app/components/login/login-demo.component.ts
+++ b/demo-shell-ng2/app/components/login/login-demo.component.ts
@@ -26,6 +26,7 @@ declare let __moduleName: string;
     moduleId: __moduleName,
     selector: 'login-demo',
     templateUrl: './login-demo.component.html',
+    styleUrls: ['./login-demo.component.css'],
     directives: [ROUTER_DIRECTIVES, AlfrescoLoginComponent],
     pipes: []
 })