Update Login component

This commit is contained in:
Andrew Kingston 2020-10-14 17:06:20 +01:00
parent 62091ce744
commit c5381a4766
1 changed files with 7 additions and 6 deletions

View File

@ -1,7 +1,7 @@
<script> <script>
import Button from "./Button.svelte" import Button from "./Button.svelte"
export let buttonText = "Login" export let buttonText = "Log In"
export let logo = "" export let logo = ""
export let title = "" export let title = ""
export let buttonClass = "" export let buttonClass = ""
@ -48,7 +48,7 @@
{/if} {/if}
{#if title} {#if title}
<h1 class="header-content">{title}</h1> <h2 class="header-content">{title}</h2>
{/if} {/if}
<div class="form-root"> <div class="form-root">
@ -71,7 +71,7 @@
<div class="login-button-container"> <div class="login-button-container">
<button disabled={loading} on:click={login} class={_buttonClass}> <button disabled={loading} on:click={login} class={_buttonClass}>
{buttonText || 'Login'} {buttonText || 'Log In'}
</button> </button>
</div> </div>
@ -102,7 +102,9 @@
} }
.logo-container > img { .logo-container > img {
height: 80px;
max-width: 200px; max-width: 200px;
margin-bottom: 20px;
} }
.login-button-container { .login-button-container {
@ -114,12 +116,11 @@
font-family: Inter; font-family: Inter;
font-weight: 700; font-weight: 700;
color: #1f1f1f; color: #1f1f1f;
font-size: 48px; font-size: 32px;
line-height: 72px;
margin-bottom: 30px;
text-rendering: optimizeLegibility; text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
font-feature-settings: "case" "rlig" "calt" 0; font-feature-settings: "case" "rlig" "calt" 0;
margin: 0 0 20px 0;
} }
.incorrect-details-panel { .incorrect-details-panel {