CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-10-05 12:34:50 +13:00
Code Issues Projects Releases Wiki Activity

Merge branch 'master' of github.com:Budibase/budibase

Browse source
This commit is contained in:
Michael Shanks 2020-06-24 17:02:08 +01:00
commit b70d15e8b9
1 changed files with 35 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

65
packages/standard-components/src/Login.svelte
View file

@ -23,10 +23,7 @@
const login = async () => { const login = async () => {
loading = true loading = true
const response = await _bb.api.post("/api/authenticate", { const response = await _bb.api.post("/api/authenticate", { username, password })
username,
password,
})
if (response.status === 200) { if (response.status === 200) {
const json = await response.json() const json = await response.json()
localStorage.setItem("budibase:token", json.token) localStorage.setItem("budibase:token", json.token)
@ -39,39 +36,47 @@
} }
</script> </script>
<div class="container"> <div class="root">
<div class="root"> <div class="content">
<div class="content"> {#if logo}
{#if logo} <div class="logo-container">
<div class="logo-container"> <img src={logo} alt="logo" />
<img src={logo} alt="logo" /> </div>
</div> {/if}
{/if}
<div class="login-button-container"> <h1 class="header-content">Log in to {name}</h1>
<button disabled={loading} on:click={login} class={_buttonClass}>
Log in to {name} <div class="form-root">
</button> <div class="control">
<input
bind:value={username}
type="text"
placeholder="Username"
class={_inputClass} />
</div> </div>
{#if error} <div class="control">
<div class="incorrect-details-panel"> <input
Incorrect username or password bind:value={password}
</div> type="password"
{/if} placeholder="Password"
class={_inputClass} />
</div>
</div> </div>
<div class="login-button-container">
<button disabled={loading} on:click={login} class={_buttonClass}>
Log in to {name}
</button>
</div>
{#if error}
<div class="incorrect-details-panel">Incorrect username or password</div>
{/if}
</div> </div>
</div> </div>
<style> <style>
.container {
display: flex;
justify-content: center;
align-items: center;
height: 100%;
width: 100%;
position: absolute;
}
.root { .root {
height: 100%; height: 100%;
display: flex; display: flex;
@ -102,7 +107,7 @@
.header-content { .header-content {
font-family: Inter; font-family: Inter;
font-weight: 600; font-weight: 700;
color: #1f1f1f; color: #1f1f1f;
font-size: 48px; font-size: 48px;
line-height: 72px; line-height: 72px;