From d7e7fb8b670bb55a54f412d4ba4b698bfb92e830 Mon Sep 17 00:00:00 2001
From: Sven <svegr833@student.liu.se>
Date: Mon, 20 Nov 2023 07:58:54 +0100
Subject: [PATCH] Some additions to the login/register-pages
---
client/login/login.css | 11 ++++++-----
client/login/login.html | 14 +++++++-------
client/login/register.html | 23 ++++++++++++-----------
3 files changed, 25 insertions(+), 23 deletions(-)
diff --git a/client/login/login.css b/client/login/login.css
index c66282bf..fa4afc57 100644
--- a/client/login/login.css
+++ b/client/login/login.css
@@ -1,9 +1,10 @@
body {
- font-family: 'Poppins', sans-serif;
+ font-family: 'Roboto', sans-serif;
margin: 0;
display: flex;
height: 100vh;
- background: linear-gradient(to right, #845380, #303866);
+ background-image: url(../images/backgroundLogin.png);
+ background-size:cover;
justify-content: center;
align-items: center;
}
@@ -15,7 +16,7 @@ body {
text-align: center;
padding: 40px;
width: 400px;
- background: linear-gradient(to right, #845380, #303866);
+ background: linear-gradient(to right, #db89db,#a05b9a, #532e75);
}
.login-header {
@@ -48,7 +49,7 @@ body {
padding: 8px 15px;
border: none;
border-radius: 5px;
- background-color: #303866;
+ background-color: #663d8c;
color: #ffffff;
font-size: 14px;
cursor: pointer;
@@ -59,7 +60,7 @@ body {
.login-button:hover,
.register-button:hover {
- background-color: #6c3483;
+ background-color: #7b3a94;
}
.login-form {
diff --git a/client/login/login.html b/client/login/login.html
index 92bf2dc5..111b20d6 100644
--- a/client/login/login.html
+++ b/client/login/login.html
@@ -106,18 +106,18 @@
<script src = "../dist/login.bundle.js" type = "module"> </script>
<div class="login-container">
<div class="login-header">
- <img src="../images/logo.png" alt="Company Logo">
- <h2>Ideabank 2.0</h2>
- <p class="welcome-text">Welcome to the app</p>
+ <img src="../images/companyLogo.png" alt="Company Logo">
+ <h2>Idébanken 2.0</h2>
+ <p class="welcome-text">Välkommen till appen!</p>
</div>
<div id = "login-form" class="login-form">
<label class="label-text">Email</label>
<input id = "email" class="login-input" type="text" placeholder="" required><br>
- <label class="label-text">Password</label>
+ <label class="label-text">Lösenord</label>
<input id = "password" class="login-input" type="password" placeholder="" required><br>
- <button id = "button-login" class="login-button" type="button">Login</button>
- <p class="welcome-text">Don't have an account ?</p>
- <button id ="button-register" class="register-button" type="button">Register</button>
+ <button id = "button-login" class="login-button" type="button">Logga in</button>
+ <p class="welcome-text">Inget konto ?</p>
+ <button id ="button-register" class="register-button" type="button">Registrera dig</button>
</div>
</div>
</body>
diff --git a/client/login/register.html b/client/login/register.html
index 7b5f5a96..02c068bd 100644
--- a/client/login/register.html
+++ b/client/login/register.html
@@ -6,9 +6,10 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ideabank Register</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
+ <link rel="stylesheet" type="text/css" href="login.css">
<style>
body {
- font-family: 'Poppins', sans-serif;
+ font-family: 'Roboto', sans-serif;
margin: 0;
display: flex;
height: 100vh;
@@ -121,7 +122,7 @@
/* Style the checked state of the checkbox */
#managerCheck:checked+label[for="managerCheck"]::before {
- font-family: 'Poppins';
+ font-family: 'Roboto';
margin-right: 5px;
}
</style>
@@ -134,28 +135,28 @@
<script src = "../dist/register.bundle.js" type = "module"> </script>
<div class="login-container">
<div class="login-header">
- <img src="../images/logo.png" alt="Company Logo">
- <h2>Ideabank</h2>
- <p class="welcome-text">Please register below!</p>
+ <img src="../images/companylogo.png" alt="Company Logo">
+ <h2>Idébanken 2.0</h2>
+ <p class="welcome-text">Var god registrera dig nedan!</p>
</div>
<div class="login-form">
<label class="label-text" for="hsa-id">HSA ID</label>
<input id="hsa-id" class="login-input" type="text" placeholder="" required><br>
- <label class="label-text" for="unit-id">Unit ID</label>
+ <label class="label-text" for="unit-id">Enhets-ID</label>
<input id="unit-id" class="login-input" type="text" placeholder="" required><br>
- <label class="label-text" for="first-name">First Name</label>
+ <label class="label-text" for="first-name">Förnamn</label>
<input id="first-name" class="login-input name-input" type="text" placeholder="" required>
- <label class="label-text" for="last-name">Last Name</label>
+ <label class="label-text" for="last-name">Efternamn</label>
<input id="last-name" class="login-input name-input" type="text" placeholder="" required><br>
<label class="label-text" for="email">Email</label>
<input id="email" class="login-input" type="text" placeholder="" required><br>
- <label class="label-text" for="password">Password</label>
+ <label class="label-text" for="password">Lösenord</label>
<input id="password" class="login-input" type="password" placeholder="" required><br>
<div class="manager-check">
<input type="checkbox" id="managerCheck">
- <label for="managerCheck">Manager?</label>
+ <label for="managerCheck">Chef?</label>
</div>
- <button id="register-button" class="register-button" type="submit">Register</button>
+ <button id="register-button" class="register-button" type="submit">Registrera dig</button>
</div>
</div>
</body>
--
GitLab