Skip to content
Snippets Groups Projects
Commit d7e7fb8b authored by Sven Grinneby's avatar Sven Grinneby
Browse files

Some additions to the login/register-pages

parent 525fb2bd
Branches
No related tags found
4 merge requests!139The members of the project should be showing now in pgsa pages, but there are...,!134The members of the project should be showing now in pgsa pages, but there are...,!117UX updates and language change,!107Added autofill from database into text boxes, but now data is taken from wrong...
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 {
......
......@@ -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>
......
......@@ -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>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment