Update portal pages to have better usage of spectrum components
This commit is contained in:
parent
dc6b66afde
commit
daf58ff554
|
@ -80,7 +80,7 @@
|
|||
<Icon size="XL" name="ChevronDown" />
|
||||
</div>
|
||||
<MenuItem icon="Settings" on:click={oldSettingsModal.show}>
|
||||
Settings
|
||||
Old settings
|
||||
</MenuItem>
|
||||
<MenuItem icon="LogOut" on:click={auth.logout}>Log out</MenuItem>
|
||||
</ActionMenu>
|
||||
|
|
|
@ -60,47 +60,50 @@
|
|||
</script>
|
||||
|
||||
<Page>
|
||||
<header>
|
||||
<Heading size="M">OAuth</Heading>
|
||||
<Body size="S">
|
||||
Every budibase app comes with basic authentication (email/password)
|
||||
included. You can add additional authentication methods from the options
|
||||
below.
|
||||
</Body>
|
||||
</header>
|
||||
<Divider />
|
||||
{#if google}
|
||||
<div class="config-form">
|
||||
<Layout gap="S">
|
||||
<Layout noPadding>
|
||||
<div>
|
||||
<Heading size="M">OAuth</Heading>
|
||||
<Body>
|
||||
Every budibase app comes with basic authentication (email/password)
|
||||
included. You can add additional authentication methods from the options
|
||||
below.
|
||||
</Body>
|
||||
</div>
|
||||
<Divider />
|
||||
{#if google}
|
||||
<div>
|
||||
<Heading size="S">
|
||||
<span>
|
||||
<GoogleLogo />
|
||||
Google
|
||||
</span>
|
||||
</Heading>
|
||||
{#each ConfigFields.Google as field}
|
||||
<div class="form-row">
|
||||
<Label>{field}</Label>
|
||||
<Input bind:value={google.config[field]} />
|
||||
</div>
|
||||
{/each}
|
||||
</Layout>
|
||||
<Button primary on:click={() => save(google)}>Save</Button>
|
||||
</div>
|
||||
<Divider />
|
||||
{/if}
|
||||
<Body>
|
||||
To allow users to authenticate using their Google accounts, fill out
|
||||
the fields below.
|
||||
</Body>
|
||||
</div>
|
||||
|
||||
{#each ConfigFields.Google as field}
|
||||
<div class="form-row">
|
||||
<Label size="L">{field}</Label>
|
||||
<Input bind:value={google.config[field]} />
|
||||
</div>
|
||||
{/each}
|
||||
<div>
|
||||
<Button primary on:click={() => save(google)}>Save</Button>
|
||||
</div>
|
||||
<Divider />
|
||||
{/if}
|
||||
</Layout>
|
||||
</Page>
|
||||
|
||||
<style>
|
||||
.config-form {
|
||||
margin-top: 42px;
|
||||
margin-bottom: 42px;
|
||||
}
|
||||
|
||||
.form-row {
|
||||
display: grid;
|
||||
grid-template-columns: 20% 1fr;
|
||||
grid-gap: var(--spacing-l);
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
span {
|
||||
|
@ -108,8 +111,4 @@
|
|||
align-items: center;
|
||||
gap: var(--spacing-s);
|
||||
}
|
||||
|
||||
header {
|
||||
margin-bottom: 42px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -45,12 +45,12 @@
|
|||
<Layout noPadding>
|
||||
<div class="intro">
|
||||
<Heading size="M">General</Heading>
|
||||
<Body
|
||||
>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Hic vero, aut
|
||||
<Body>
|
||||
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Hic vero, aut
|
||||
culpa provident sunt ratione! Voluptas doloremque, dicta nisi velit
|
||||
perspiciatis, ratione vel blanditiis totam, nam voluptate repellat
|
||||
aperiam fuga!</Body
|
||||
>
|
||||
aperiam fuga!
|
||||
</Body>
|
||||
</div>
|
||||
<Divider size="S" />
|
||||
<div class="information">
|
||||
|
@ -58,7 +58,7 @@
|
|||
<Body>Here you can update your logo and organization name.</Body>
|
||||
<div class="fields">
|
||||
<div class="field">
|
||||
<Label>Organization name</Label>
|
||||
<Label size="L">Organization name</Label>
|
||||
<Input thin bind:value={company} />
|
||||
</div>
|
||||
<!-- <div class="field">
|
||||
|
@ -72,13 +72,13 @@
|
|||
<Divider size="S" />
|
||||
<div class="analytics">
|
||||
<Heading size="S">Analytics</Heading>
|
||||
<Body
|
||||
>If you would like to send analytics that help us make Budibase better,
|
||||
please let us know below.</Body
|
||||
>
|
||||
<Body>
|
||||
If you would like to send analytics that help us make Budibase better,
|
||||
please let us know below.
|
||||
</Body>
|
||||
<div class="fields">
|
||||
<div class="field">
|
||||
<Label>Send Analytics to Budibase</Label>
|
||||
<Label size="L">Send Analytics to Budibase</Label>
|
||||
<Toggle text="" value={!analyticsDisabled} />
|
||||
</div>
|
||||
</div>
|
||||
|
@ -97,7 +97,8 @@
|
|||
}
|
||||
.field {
|
||||
display: grid;
|
||||
grid-template-columns: 30% 1fr;
|
||||
grid-template-columns: 32% 1fr;
|
||||
align-items: center;
|
||||
}
|
||||
.file {
|
||||
max-width: 30ch;
|
||||
|
|
Loading…
Reference in New Issue