From ca7e618ca3350a5cf200ae39c851b016c9088d41 Mon Sep 17 00:00:00 2001
From: transtrike <transtrike@gmail.com>
Date: Thu, 25 Feb 2021 20:51:24 +0200
Subject: Footer added; Pages fucked up

---
 .../profile-settings.component.html                | 234 +++++++++++++++++----
 1 file changed, 198 insertions(+), 36 deletions(-)

(limited to 'src/app/components/profile-settings/profile-settings.component.html')

diff --git a/src/app/components/profile-settings/profile-settings.component.html b/src/app/components/profile-settings/profile-settings.component.html
index 502697d..f5f19bd 100644
--- a/src/app/components/profile-settings/profile-settings.component.html
+++ b/src/app/components/profile-settings/profile-settings.component.html
@@ -3,114 +3,276 @@
 <div id="content" *ngIf="dataArrived">
 	<nav id="navigation">
 		<button class="submit-btn" (click)="goToProfile()">ᐊ Back</button>
-		<button class="submit-btn" (click)="navigateToAdminPanel()" *ngIf="isAdminUser">Panel</button>
+		<button
+			class="submit-btn"
+			(click)="navigateToAdminPanel()"
+			*ngIf="isAdminUser"
+		>
+			Panel
+		</button>
 		<button class="submit-btn" (click)="logout()">Logout</button>
 	</nav>
-	<hr>
+	<hr />
 	<div class="scroll-standalone">
-		<form id="update-profile-picture" [formGroup]="updateProfilePictureFormGroup" (ngSubmit)="updateProfilePicture()">
-			<img id="profile-picture" class="round-image" [src]="user.profilePictureURL">
+		<form
+			id="update-profile-picture"
+			[formGroup]="updateProfilePictureFormGroup"
+			(ngSubmit)="updateProfilePicture()"
+		>
+			<img
+				id="profile-picture"
+				class="round-image"
+				[src]="user.profilePictureURL"
+			/>
 			<div id="submit-file">
 				<div id="upload-file" class="submit-btn">
-					<input type="file" accept="image/*" formControlName="fileUpload" (change)="onFileUpload($event)">
+					<input
+						type="file"
+						accept="image/*"
+						formControlName="fileUpload"
+						(change)="onFileUpload($event)"
+					/>
 				</div>
-				<button class="submit-btn" type="submit">Update profile picture</button>
+				<button class="submit-btn" type="submit">
+					Update profile picture
+				</button>
 			</div>
 		</form>
-		<hr>
-		<form id="update-user" [formGroup]="updateUserFormGroup" (ngSubmit)="onSubmit()">
+		<hr />
+		<form
+			id="update-user"
+			[formGroup]="updateUserFormGroup"
+			(ngSubmit)="onSubmit()"
+		>
 			<div class="input-selection">
-				<input type="text" class="input-field" formControlName="firstName" required>
+				<input
+					type="text"
+					class="input-field"
+					formControlName="firstName"
+					required
+				/>
 				<label class="input-field-label">First Name</label>
 
 				<div class="input-errors">
-					<label *ngIf="updateUserFormGroup.get('firstName')?.errors?.required" class="error">*Required</label>
-					<label *ngIf="updateUserFormGroup.get('firstName')?.errors?.minlength" class="error">*Minimum 3 characters</label>
+					<label
+						*ngIf="
+							updateUserFormGroup.get('firstName')?.errors
+								?.required
+						"
+						class="error"
+						>*Required</label
+					>
+					<label
+						*ngIf="
+							updateUserFormGroup.get('firstName')?.errors
+								?.minlength
+						"
+						class="error"
+						>*Minimum 3 characters</label
+					>
 				</div>
 			</div>
 
 			<div class="input-selection">
-				<input type="text" class="input-field" formControlName="lastName" required>
+				<input
+					type="text"
+					class="input-field"
+					formControlName="lastName"
+					required
+				/>
 				<label class="input-field-label">Last Name</label>
 
 				<div class="input-errors">
-					<label *ngIf="updateUserFormGroup.get('lastName')?.errors?.required" class="error">*Required</label>
-					<label *ngIf="updateUserFormGroup.get('lastName')?.errors?.minlength" class="error">*Minimum 3 characters</label>
+					<label
+						*ngIf="
+							updateUserFormGroup.get('lastName')?.errors
+								?.required
+						"
+						class="error"
+						>*Required</label
+					>
+					<label
+						*ngIf="
+							updateUserFormGroup.get('lastName')?.errors
+								?.minlength
+						"
+						class="error"
+						>*Minimum 3 characters</label
+					>
 				</div>
 			</div>
 
 			<div class="input-selection">
-				<input type="text" class="input-field" formControlName="username" required>
+				<input
+					type="text"
+					class="input-field"
+					formControlName="username"
+					required
+				/>
 				<label class="input-field-label">Username</label>
 
 				<div class="input-errors">
-					<label *ngIf="updateUserFormGroup.get('username')?.errors?.required" class="error">*Required</label>
-					<label *ngIf="updateUserFormGroup.get('username')?.errors?.minlength" class="error">*Minimum 3 characters</label>
+					<label
+						*ngIf="
+							updateUserFormGroup.get('username')?.errors
+								?.required
+						"
+						class="error"
+						>*Required</label
+					>
+					<label
+						*ngIf="
+							updateUserFormGroup.get('username')?.errors
+								?.minlength
+						"
+						class="error"
+						>*Minimum 3 characters</label
+					>
 				</div>
 			</div>
 
 			<div class="input-selection">
-				<input type="text" class="input-field" formControlName="email" required>
+				<input
+					type="text"
+					class="input-field"
+					formControlName="email"
+					required
+				/>
 				<label class="input-field-label">Email</label>
 
 				<div class="input-errors">
-					<label *ngIf="updateUserFormGroup.get('email')?.errors?.required" class="error">*Required</label>
-					<label *ngIf="updateUserFormGroup.get('email')?.errors?.email" class="error">*Invalid email</label>
+					<label
+						*ngIf="
+							updateUserFormGroup.get('email')?.errors?.required
+						"
+						class="error"
+						>*Required</label
+					>
+					<label
+						*ngIf="updateUserFormGroup.get('email')?.errors?.email"
+						class="error"
+						>*Invalid email</label
+					>
 				</div>
 			</div>
 
 			<div class="input-selection">
-				<input type="password" class="input-field" formControlName="password" required>
+				<input
+					type="password"
+					class="input-field"
+					formControlName="password"
+					required
+				/>
 				<label class="input-field-label">Password</label>
 
 				<div class="input-errors">
-					<label *ngIf="updateUserFormGroup.get('password')?.errors?.required" class="error">*Required</label>
-					<label *ngIf="updateUserFormGroup.get('password')?.errors?.minlength" class="error">*Minimum 3 characters</label>
-					<label *ngIf="updateUserFormGroup.get('password')?.errors?.pattern" class="error">*At least 1 number</label>
+					<label
+						*ngIf="
+							updateUserFormGroup.get('password')?.errors
+								?.required
+						"
+						class="error"
+						>*Required</label
+					>
+					<label
+						*ngIf="
+							updateUserFormGroup.get('password')?.errors
+								?.minlength
+						"
+						class="error"
+						>*Minimum 3 characters</label
+					>
+					<label
+						*ngIf="
+							updateUserFormGroup.get('password')?.errors?.pattern
+						"
+						class="error"
+						>*At least 1 number</label
+					>
 				</div>
 			</div>
-			<button type="button" class="submit-btn edit-btn" (click)="toggleLanguages()">▼ Edit Languages ▼</button>
+			<button
+				type="button"
+				class="submit-btn edit-btn"
+				(click)="toggleLanguages()"
+			>
+				▼ Edit Languages ▼
+			</button>
 			<div *ngIf="showLanguages">
 				<div class="input-selection">
-					<input type="text" class="input-field" formControlName="languageInput" required>
+					<input
+						type="text"
+						class="input-field"
+						formControlName="languageInput"
+						required
+					/>
 
 					<div class="input-errors">
-						<label class="error">Type in your desired languages, separated by a space</label>
+						<label class="error"
+							>Type in your desired languages, separated by a
+							space</label
+						>
 					</div>
 				</div>
 				Available languages:
 				<div id="all-languages">
-					<div class="user-language" *ngFor="let lang of availableLanguages">
+					<div
+						class="user-language"
+						*ngFor="let lang of availableLanguages"
+					>
 						{{ lang.name }}
 					</div>
 				</div>
 			</div>
 
-			<button type="button" class="submit-btn edit-btn" (click)="toggleTechnologies()">▼ Edit Technologies ▼</button>
+			<button
+				type="button"
+				class="submit-btn edit-btn"
+				(click)="toggleTechnologies()"
+			>
+				▼ Edit Technologies ▼
+			</button>
 			<div *ngIf="showTechnologies">
 				<div class="input-selection">
-					<input type="text" class="input-field" formControlName="technologyInput" required>
+					<input
+						type="text"
+						class="input-field"
+						formControlName="technologyInput"
+						required
+					/>
 
 					<div class="input-errors">
-						<label class="error">Type in your desired technologies, separated by a space</label>
+						<label class="error"
+							>Type in your desired technologies, separated by a
+							space</label
+						>
 					</div>
 				</div>
 				Available technologies:
 				<div id="all-technologies">
-					<div class="user-technology" *ngFor="let tech of availableTechnologies">
+					<div
+						class="user-technology"
+						*ngFor="let tech of availableTechnologies"
+					>
 						{{ tech.name }}
 					</div>
 				</div>
 			</div>
 
-			<button id="update-profile-btn" class="submit-btn" type="submit">Update profile</button>
+			<button id="update-profile-btn" class="submit-btn" type="submit">
+				Update profile
+			</button>
 			<app-success-bar></app-success-bar>
 			<app-error-bar></app-error-bar>
 		</form>
-		<hr>
+		<hr />
 		<div id="confirm-delete" *ngIf="deleteAccountConfirm">
-			Are you sure you want to delete your account?<br>This is permanent!
+			Are you sure you want to delete your account?<br />This is
+			permanent!
 		</div>
-		<button class="submit-btn delete-btn" (click)="deleteAccount()">Delete account</button>
+		<button class="submit-btn delete-btn" (click)="deleteAccount()">
+			Delete account
+		</button>
 	</div>
+	<app-footer></app-footer>
 </div>
-- 
cgit v1.2.3