style fixes, bugfixes

client.css

@@ -19,6 +19,13 @@
 }
 
 .form-input {
+	width: 300px;
+	display: flex;
+	justify-content: space-between;
+	gap: 10px;
+}
+
+.form-input-welcome {
 	display: flex;
 	justify-content: space-between;
 	gap: 10px;
@@ -82,4 +89,36 @@ input[type=text]:focus {
 textarea {
 	overflow: hidden;
 	resize: none;
+}
+
+.message-board {
+    background-color: #f0e3d1;
+    overflow-y: scroll;
+    padding: 10px;
+    max-height: 40vh;
+    border-left: solid deeppink;
+    border-top-style: hidden;
+    border-right-style: hidden;
+    border-bottom-style: hidden;
+}
+
+/* width */
+::-webkit-scrollbar {
+	width: 5px;
+}
+
+/* Track */
+::-webkit-scrollbar-track {
+	background: none;
+}
+
+/* Handle */
+::-webkit-scrollbar-thumb {
+	border-radius:5px;
+	background: #888; 
+}
+
+/* Handle on hover */
+::-webkit-scrollbar-thumb:hover {
+	background: #555; 
 }
\ No newline at end of file

client.html

@@ -11,11 +11,11 @@
 				<div class="form-elements" id="login">
 					<form id="loginform">
 						<h2>Login</h2>
-						<div class="form-input">
+						<div class="form-input-welcome">
 							<label for="email">Email</label>
 							<input type="text" id="email" name="email" size="18">
 						</div>
-						<div class="form-input">
+						<div class="form-input-welcome">
 							<label for="password">Password</label>
 							<input type="password" id="password" name="password" size="18">
 						</div>
@@ -24,15 +24,15 @@
 					</form>
 					<form id="signupform">
 						<h2>Sign up here</h2>
-						<div class="form-input">
+						<div class="form-input-welcome">
 							<label for="fname">First name</label>
 							<input type="text" id="fname" name="fname" size="18">
 						</div>
-						<div class="form-input">
+						<div class="form-input-welcome">
 							<label for="lname">Family name</label>
 							<input type="text" id="lname" name="lname" size="18">
 						</div>
-						<div class="form-input">
+						<div class="form-input-welcome">
 							<label for="gender">Gender</label>
 							<select id="gender" name="gender" style="width:169;">
 								<option value="male">Male</option>
@@ -41,27 +41,27 @@
 							</select>
 						</div>
 						
-						<div class="form-input">
+						<div class="form-input-welcome">
 							<label for="city">City</label>
 							<input type="text" id="city" name="city" size="18">
 						</div>
-						<div class="form-input">
+						<div class="form-input-welcome">
 							<label for="country">Country</label>
 							<input type="text" id="country" name="country" size="18">
 						</div>
-						<div class="form-input">
+						<div class="form-input-welcome">
 							<label for="email">Email</label>
 							<input type="text" id="email" name="email" size="18">
 						</div>
-						<div class="form-input">
+						<div class="form-input-welcome">
 							<label for="password">Password</label>
 							<input type="password" id="password" name="password" size="18">
 						</div>
-						<div class="form-input">
+						<div class="form-input-welcome">
 							<label for="password2">Repeat PSW</label>
 							<input type="password" id="password2" name="password2" size="18">
 						</div>
-						<div class="form-input">
+						<div class="form-input-welcome">
 							<input type="submit" value="Sign Up">
 						</div>
 						<div id="message"></div>
@@ -102,7 +102,7 @@
 				<div id="message3"></div>
 
 				<button id="reloadbutton">Reload board</button>
-				<div id="home-message-board">
+				<div id="home-message-board" class="message-board">
 					
 				</div>
 				
@@ -137,7 +137,7 @@
 					<div id="message4"></div>
 
 					<button id="browse-reloadbutton">Reload board</button>
-					<div id="browse-message-board">
+					<div id="browse-message-board" class="message-board">
 					</div>
 				</div>
 			</div>

client.js

@@ -13,14 +13,15 @@ class SignUp {
 
 displayView = function() {
 	// the code required to display a view
-};
-window.onload = function() {
 	if (localStorage.getItem("logintoken") != null) {
 		loadProfileView();
 	} else {
 		loadWelcomeView();
 	}
 };
+window.onload = function() {
+	displayView();
+};
 
 loadWelcomeView = function() {
 	document.getElementById("pagecontent").innerHTML = "";
@@ -49,7 +50,7 @@ loadWelcomeView = function() {
 					signupform["email"].setAttribute("placeholder", message.message);
 				} else {
 					localStorage.setItem("logintoken", message.data);
-					loadProfileView();
+					displayView();
 				}
 			}
 		}
@@ -67,7 +68,7 @@ loadWelcomeView = function() {
 				loginform["email"].setAttribute("placeholder", message.message);
 			} else {
 				localStorage.setItem("logintoken", message.data);
-				loadProfileView();
+				displayView();
 			}
 		}
 	})
@@ -110,7 +111,7 @@ loadProfileView = function() {
 		} else {
 			localStorage.removeItem("logintoken");
 		}
-		loadWelcomeView();
+		displayView();
 	})
 
     var userData = serverstub.getUserDataByToken(localStorage.getItem('logintoken')).data
@@ -227,26 +228,21 @@ reloadBoard = function(board, email=null) {
 		messageHTML.appendChild(document.createElement('br'));
 			
 		boardBox.appendChild(messageHTML);
-		boardBox.style.backgroundColor = "white";
-		boardBox.style.overflowY= "scroll";
-		boardBox.style.maxHeight = "45vh";
 	}
 }
 
 inputValidation = function(formID) {
 	var form = document.forms[formID];	
 	let allInputs = form.querySelectorAll("input");
-	var valid = true;
 	allInputs.forEach(function(elem) {
 		if(elem.type === "text" && elem.value === "") {
 			elem.setAttribute("placeholder", "Don't leave blank");
-			valid = false;
+			return false;
 		} })
 	if (form["email"] != null && !validateEmail(form)) {
-		valid = false;
+		return false;
 	}
-	valid = validatePassword(form, formID); 
-	return valid;
+	return validatePassword(form, formID); 
 }
 
 function validateEmail(form) {