#3527 feature - Added more features to angular2 version

rsanchez

2017-03-10 2762277c60db7df5ad3214b10a0dd93d4f2f1128

 securis/src/main/webapp/src/app/login.form.html
..
..
@@ -1,25 +1,51 @@
1
-<md-card>
2
-	<md-card-title layout="row" layout-align="start end"><md-icon class="md-icon-logo" svgSrc="assets/icons/logo.svg"></md-icon> <span class="md-app-title" i18n>
3
-		SeCuris Login</span></md-card-title>
4
-	<md-card-subtitle>Sign in via your current SeCuris account</md-card-subtitle>
5
-	<md-divider></md-divider>
6
-	<md-card-content>
7
-		<form #loginForm="ngForm" class="inset">
8
-			<div layout="row">
9
-				<md-input-container>
10
-					<input mdInput flex placeholder="Username" type="text" [(ngModel)]="data.username" name="username" required />
11
-				</md-input-container>
12
-			</div>
13
-			<div layout="row">
14
-				<md-input-container>
15
-				<input mdInput (keyup.enter)="loginForm.form.valid && login()" flex placeholder="Password" type="password" [(ngModel)]="data.password" name="password" required/>
16
-				</md-input-container>
17
-			</div>
18
-		</form>
19
-		<div id="invalid-auth-msg" *ngIf="invalidError" class="tc-red-600 text-center" flex i18n>The username or password is incorrect. Please try again.</div>
20
-	</md-card-content>
21
-	<md-divider></md-divider>
22
-	<md-card-actions>
23
-		<button flex [disabled]="!loginForm.form.valid" md-raised-button color="primary" (click)="login()">Sign In</button>
24
-	</md-card-actions>
25
-</md-card>
1
+<td-layout-card-over>
2
+	<md-toolbar role="toolbar" class="mat-secondary">
3
+		<div class="mat-toolbar-layout">
4
+			<md-toolbar-row class="mat-toolbar-row">SeCuris Sign in</md-toolbar-row>
5
+		</div>
6
+	</md-toolbar>
7
+	<div class="margin" layout-align-gt-xs="center start" layout-fill="" layout-gt-xs="row">
8
+		<div flex-gt-xs="70">
9
+
10
+			<md-card>
11
+				<md-card-title>
12
+					<div layout="row" layout-align="center center">
13
+                    	<md-icon class="login-logo" svgIcon="assets:logo"></md-icon>
14
+					</div>
15
+				</md-card-title>
16
+				<md-card-subtitle>
17
+					<div layout="row" layout-align="center center" i18n>
18
+						Sign in via your current SeCuris account
19
+					</div>
20
+				</md-card-subtitle>
21
+				<md-divider></md-divider>
22
+				<md-card-content>
23
+					<form #loginForm="ngForm" class="inset" (keyup.enter)="login()">
24
+					<div layout="column" layout-align="start center">
25
+						<div layout="row" layout-align="start center">
26
+	                    	<md-icon class="form-icon">face</md-icon>
27
+							<md-input-container class="md-icon-float">
28
+								<input mdInput flex placeholder="Username" type="text" [(ngModel)]="data.username" name="username" required />
29
+							</md-input-container>
30
+						</div>
31
+						<div layout="row" layout-align="start center">
32
+	                    	<md-icon class="form-icon">vpn_key</md-icon>
33
+							<md-input-container class="md-icon-float">
34
+								<input mdInput (keyup.enter)="loginForm.form.valid && false" flex placeholder="Password" type="password" [(ngModel)]="data.password"
35
+								 name="password" required/>
36
+							</md-input-container>
37
+						</div>
38
+					</div>
39
+					</form>
40
+					<div id="invalid-auth-msg" *ngIf="invalidError" class="tc-red-600 text-center" flex i18n>The username or password is incorrect. Please try again.</div>
41
+				</md-card-content>
42
+				<md-divider></md-divider>
43
+				<md-card-actions>
44
+					<div layout="row" layout-align="center center" class="margin">
45
+						<button flex="50" [disabled]="!loginForm.form.valid" md-raised-button color="primary" (click)="login()">Sign In</button>
46
+					</div>
47
+				</md-card-actions>
48
+			</md-card>
49
+		</div>
50
+	</div>
51
+</td-layout-card-over>