MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update portal pages to have better usage of spectrum components

This commit is contained in:
Andrew Kingston 2021-05-06 15:34:22 +01:00
parent dc6b66afde
commit daf58ff554
3 changed files with 44 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/builder/src/pages/portal/_layout.svelte
View File

@ -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>

31
packages/builder/src/pages/portal/oauth/index.svelte
View File

@ -60,47 +60,50 @@
</script>
<Page>
<header>
<Layout noPadding>
<div>
<Heading size="M">OAuth</Heading>
<Body size="S">
<Body>
Every budibase app comes with basic authentication (email/password)
included. You can add additional authentication methods from the options
below.
</Body>
</header>
</div>
<Divider />
{#if google}
<div class="config-form">
<Layout gap="S">
<div>
<Heading size="S">
<span>
<GoogleLogo />
Google
</span>
</Heading>
<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>{field}</Label>
<Label size="L">{field}</Label>
<Input bind:value={google.config[field]} />
</div>
{/each}
</Layout>
<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>

23
packages/builder/src/pages/portal/settings/general.svelte
View File

@ -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;