diff --git a/src/app/login/login.component.html b/src/app/login/login.component.html
index fbaec456..47f52fe2 100644
--- a/src/app/login/login.component.html
+++ b/src/app/login/login.component.html
@@ -4,73 +4,76 @@
 			<mat-tab label="Login">
 				<br/>
 				<mat-card-content>
-					<form>
-						<mat-form-field appearance="fill" class="w-75">
-							<mat-label>Username</mat-label>
-							<input matInput [formControl]="username">
-							<mat-error *ngIf="username.hasError('required')">
-								An username is <strong>required</strong>
-							</mat-error>
-						</mat-form-field>
-						<br/>
-						<br/>
-						<mat-form-field appearance="fill" class="w-75">
-							<mat-label>Password</mat-label>
-							<input matInput [formControl]="password" [type]="hidePassword ? 'password' : 'text'">
-							<button mat-icon-button matSuffix (click)="hidePassword = !hidePassword" [attr.aria-label]="'Hide password'" [attr.aria-pressed]="hidePassword">
-								<mat-icon>{{hidePassword ? 'visibility_off' : 'visibility'}}</mat-icon>
-							</button>
-							<mat-error *ngIf="password.hasError('required')">
-								A password is <strong>required</strong>
-							</mat-error>
-						</mat-form-field>
-					</form>
-				</mat-card-content>
-				<div fxFlexAlign="end" align="end">
-					<button mat-button>Login</button>
-				</div>
-			</mat-tab>
-			<mat-tab label="Signin">
-				<br/>
-				<mat-card-content>
-					<form class="form-group">
-						<mat-form-field appearance="fill" class="w-75">
-							<mat-label>Username</mat-label>
-							<input matInput [formControl]="username">
-							<mat-error *ngIf="username.hasError('required')">
-								An username is <strong>required</strong>
-							</mat-error>
-						</mat-form-field>
-						<br/>
-						<br/>
-						<mat-form-field appearance="fill" class="w-75">
+					<form #loginForm="ngForm" (ngSubmit)="login()">
+						<mat-form-field appearance="outline" class="w-75">
 							<mat-label>Email</mat-label>
-							<input matInput [formControl]="email">
-							<mat-error *ngIf="email.hasError('required')">
+							<input matInput name="loginEmail" #loginEmail="ngModel" [(ngModel)]="loginInformation.email" required email>
+							<mat-error *ngIf="loginEmail.hasError('required')">
 								An email is <strong>required</strong>
 							</mat-error>
-							<mat-error *ngIf="email.hasError('email')">
+							<mat-error *ngIf="loginEmail.hasError('email')">
 								Please enter a valid email
 							</mat-error>
 						</mat-form-field>
 						<br/>
 						<br/>
-						<mat-form-field appearance="fill" class="w-75">
+						<mat-form-field appearance="outline" class="w-75">
 							<mat-label>Password</mat-label>
-							<input matInput [formControl]="password" [type]="hidePassword ? 'password' : 'text'">
+							<input matInput  name="loginPassword" #loginPassword="ngModel" [(ngModel)]="loginInformation.password" [type]="hidePassword ? 'password' : 'text'" required>
 							<button mat-icon-button matSuffix (click)="hidePassword = !hidePassword" [attr.aria-label]="'Hide password'" [attr.aria-pressed]="hidePassword">
 								<mat-icon>{{hidePassword ? 'visibility_off' : 'visibility'}}</mat-icon>
 							</button>
-							<mat-error *ngIf="password.hasError('required')">
+							<mat-error *ngIf="loginPassword.hasError('required')">
 								A password is <strong>required</strong>
 							</mat-error>
 						</mat-form-field>
 					</form>
 				</mat-card-content>
-				<div fxFlexAlign="end" align="end">
-					<button mat-button>Sigin</button>
+				<div fxFlexAlign="end" align="end" style="text-align: end">
+					<button mat-button type="submit" [disabled]="!loginForm.valid">Login</button>
 				</div>
 			</mat-tab>
+			<mat-tab label="Signin">
+				<br/>
+				<form #signinForm="ngForm" (ngSubmit)="signin()">
+					<mat-card-content>
+						<mat-form-field appearance="outline" class="w-75">
+							<mat-label>Email</mat-label>
+							<input matInput name="signinEmail" #signinEmail="ngModel" [(ngModel)]="signinInformation.email" required email>
+							<mat-error *ngIf="signinEmail.hasError('required')">
+								An email is <strong>required</strong>
+							</mat-error>
+							<mat-error *ngIf="signinEmail.hasError('email')">
+								Please enter a valid email
+							</mat-error>
+						</mat-form-field>
+						<br/>
+						<br/>
+						<mat-form-field appearance="outline" class="w-75">
+							<mat-label>Username</mat-label>
+							<input matInput name="signinUsername" #signinUsername="ngModel" [(ngModel)]="signinInformation.username" required>
+							<mat-error *ngIf="signinUsername.hasError('required')">
+								An username is <strong>required</strong>
+							</mat-error>
+						</mat-form-field>
+						<br/>
+						<br/>
+						<mat-form-field appearance="outline" class="w-75">
+							<mat-label>Password</mat-label>
+							<input matInput name="signinPassword" #signinPassword="ngModel" [(ngModel)]="signinInformation.password" [type]="hidePassword ? 'password' : 'text'" required>
+							<button mat-icon-button matSuffix (click)="hidePassword = !hidePassword" [attr.aria-label]="'Hide password'" [attr.aria-pressed]="hidePassword">
+								<mat-icon>{{hidePassword ? 'visibility_off' : 'visibility'}}</mat-icon>
+							</button>
+							<mat-error *ngIf="signinPassword.hasError('required')">
+								A password is <strong>required</strong>
+							</mat-error>
+						</mat-form-field>
+					</mat-card-content>
+					<div fxFlexAlign="end" align="end" style="text-align: end">
+						<button mat-button type="submit" [disabled]="!signinForm.valid">Sigin</button>
+					</div>
+				</form>
+			</mat-tab>
 		</mat-tab-group>
 	</mat-card>
 </div>
\ No newline at end of file
diff --git a/src/app/login/login.component.ts b/src/app/login/login.component.ts
index 30ec64f7..f5182f29 100644
--- a/src/app/login/login.component.ts
+++ b/src/app/login/login.component.ts
@@ -1,27 +1,26 @@
 import { Component, OnInit } from '@angular/core';
-import {FormControl, Validators} from "@angular/forms";
+import {FormControl, FormGroup, Validators} from "@angular/forms";
 
 @Component({
 	selector: 'app-login',
 	templateUrl: './login.component.html',
 	styleUrls: ['./login.component.scss']
 })
-export class LoginComponent implements OnInit 
+export class LoginComponent 
 {
-	username = new FormControl("", [Validators.required]);
-	password = new FormControl("", [Validators.required]);
-	email = new FormControl("", [Validators.required, Validators.email]);
-	
+	loginInformation: {email: string, password: string} = {email: "", password: ""};
+	signinInformation: {email: string, username: string, password: string} = {email: "", username: "", password: ""};
 	hidePassword: boolean = true;
 	
 	constructor() { }
-
-	ngOnInit() 
-	{
-	}
 	
 	async login()
 	{
 		
 	}
+
+	async signin()
+	{
+		console.log("Signing in")
+	}
 }