Version Bump

Author: neroniaky

package.json

@@ -1,6 +1,6 @@
 {
   "name": "angular2-token",
-  "version": "0.2.0-beta.6",
+  "version": "0.2.0-beta.7",
   "description": "Angular2 service for token based authentication",
 
   "main": "./angular2-token.js",

src/a2t-ui/a2t-reset-password/a2t-reset-password.component.css

@@ -7,9 +7,25 @@ import { RESET_PASSWORD_FORM } from '../';
 
 @Component({
     selector:       'a2t-reset-password',
-    templateUrl:    './a2t-reset-password.component.html',
-    styleUrls:      ['./a2t-reset-password.component.css'],
-    providers:      [A2tFormService]
+    providers:      [A2tFormService],
+    template: `
+        <a2t-headline *ngIf="!_emailSend">Reset your Password</a2t-headline>
+        <a2t-form *ngIf="!_emailSend">Reset Password</a2t-form>
+        <p class="email-send-text" *ngIf="_emailSend">
+            If the entered email is registered we will send instruction on how to reset your password.
+        </p>
+        <a2t-links *ngIf="!_emailSend" case="reset-password"></a2t-links>
+    `,
+    styles: [`
+        .email-send-text {
+            background-color: #72c380;
+            color: white;
+            font-size: 16pt;
+            text-align: center;
+            padding: 20px;
+            border-radius: 3px;
+        }
+    `]
 })
 export class A2tResetPasswordComponent {
 

src/a2t-ui/a2t-reset-password/a2t-reset-password.component.html

@@ -3,7 +3,22 @@ import { Component, Input } from '@angular/core';
 @Component({
     selector:   'a2t-error',
     template:   '<div *ngFor="let error of errors"><p>{{error}}</p></div>',
-    styleUrls:  ['./a2t-error.component.css']
+    styles: [`
+        div {
+            width: 100%;
+            background-color: #df6564;
+            color: white;
+            font-weight: 300;
+            font-size: 15px;
+            padding: 10px 20px;
+            border-radius: 3px;
+            margin-bottom: 15px;
+        }
+
+        div > p {
+            margin-bottom: 0;
+        }
+    `]
 })
 export class A2tErrorComponent {
 

src/a2t-ui/a2t-reset-password/a2t-reset-password.component.ts

@@ -4,9 +4,82 @@ import { FormGroup, AbstractControl } from '@angular/forms';
 import { BaseField } from '../../../';
 
 @Component({
-    selector:       'a2t-form-field',
-    templateUrl:    './a2t-form-field.component.html',
-    styleUrls:      ['./a2t-form-field.component.css']
+    selector:   'a2t-form-field',
+    template: `
+        <div class="a2t-input-group"
+            [formGroup]="form">
+
+            <label
+                [attr.for]="question.key"
+                [style.color]="labelColor"
+                *ngIf="_control.pristine">
+                {{question.label}}
+            </label>
+
+            <label class="a2t-error"
+                [attr.for]="question.key"
+                *ngIf="_control.hasError('required') && !_control.pristine">
+                {{question.label}} is required
+            </label>
+
+            <label class="a2t-error"
+                [attr.for]="question.key"
+                *ngIf="_control.hasError('minlength')">
+                {{question.label}} is too short
+            </label>
+
+            <label class="a2t-error"
+                [attr.for]="question.key"
+                *ngIf="_control.hasError('maxlength')">
+                {{question.label}} is too long
+            </label>
+
+            <label class="a2t-valid"
+                [attr.for]="question.key"
+                *ngIf="_control.valid && !_control.pristine">
+                {{question.label}}
+            </label>
+
+            <input
+                [formControlName]="question.key"
+                [id]="question.key"
+                [type]="question.type">
+        </div>
+    `,
+    styles: [`
+        .a2t-input-group {
+            padding-bottom: 40px;
+            padding-right: 20px;
+            padding-left: 20px;
+            font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
+        }
+
+        .a2t-input-group input {
+            width: 100%;
+            outline: none;
+            border: none;
+            background-color: #eee;
+            line-height: 40px;
+
+            padding-left: 10px;
+            padding-right: 10px;
+        }
+
+        .a2t-input-group label {
+            color: #666;
+            font-weight: 600;
+            font-size: 13px;
+            margin-bottom: 0;
+        }
+
+        .a2t-error {
+            color: #df6564 !important;
+        }
+
+        .a2t-valid {
+            color: #72c380 !important;
+        }
+    `]
 })
 
 export class A2tFormFieldComponent implements OnInit {