CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-10-02 10:08:09 +13:00
Code Issues Projects Releases Wiki Activity

fixes layout issues in email templates

Browse source
This commit is contained in:
Keviin Åberg Kultalahti 2021-05-20 15:03:34 +02:00
parent fd74c07869
commit f421d7ba17
4 changed files with 94 additions and 66 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

0
packages/builder/src/pages/builder/portal/manage/_layout.svelte → packages/builder/src/pages/builder/portal/manage/auth/_layout.svelte
View file

30
packages/builder/src/pages/builder/portal/manage/email/[template].svelte
View file

@ -1,11 +1,12 @@
<script>
import {
Button,
Detail,
Heading,
notifications,
Icon,
ActionButton,
Body,
Page,
Layout,
notifications,
Tabs,
Tab,
} from "@budibase/bbui"
@ -46,8 +47,7 @@
}
</script>
<Page wide gap="L">
<div class="backbutton" on:click={() => $goto("./")}>
<!-- <div class="backbutton" on:click={() => $goto("./")}>
<Icon name="BackAndroid" />
<span>Back</span>
</div>
@ -56,7 +56,25 @@
Email Template: {template}
</Heading>
<Button cta on:click={saveTemplate}>Save</Button>
</header>
</header> -->
<Page wide>
<Layout gap="XS" noPadding>
<div class="back">
<ActionButton
on:click={() => $goto("./")}
quiet
size="S"
icon="BackAndroid"
>
Back to email settings
</ActionButton>
</div>
<Heading>Email Template: {template}</Heading>
<Body
>Change the email template here. you can insert bindings (email, logo url,
etc.) from the list on the right</Body
>
</Layout>
<Tabs {selected}>
<Tab title="Edit">
<div class="template-editor">

123
packages/builder/src/pages/builder/portal/manage/email/index.svelte
View file

@ -5,6 +5,7 @@
Heading,
Divider,
Label,
Page,
notifications,
Layout,
Input,
@ -91,69 +92,71 @@
})
</script>
<Layout>
<Layout noPadding gap="XS">
<Heading size="M">Email</Heading>
<Body>
Sending email is not required, but highly recommended for processes such
as password recovery. To setup automated auth emails, simply add the
values below and click activate.
</Body>
</Layout>
<Divider />
{#if smtpConfig}
<Layout gap="XS" noPadding>
<Heading size="S">SMTP</Heading>
<Body size="S">
To allow your app to benefit from automated auth emails, add your SMTP
details below.
<Page>
<Layout>
<Layout noPadding gap="XS">
<Heading size="M">Email</Heading>
<Body>
Sending email is not required, but highly recommended for processes such
as password recovery. To setup automated auth emails, simply add the
values below and click activate.
</Body>
</Layout>
<Layout gap="XS" noPadding>
<div class="form-row">
<Label size="L">Host</Label>
<Input bind:value={smtpConfig.config.host} />
</div>
<div class="form-row">
<Label size="L">Port</Label>
<Input type="number" bind:value={smtpConfig.config.port} />
</div>
<div class="form-row">
<Label size="L">User</Label>
<Input bind:value={smtpConfig.config.auth.user} />
</div>
<div class="form-row">
<Label size="L">Password</Label>
<Input type="password" bind:value={smtpConfig.config.auth.pass} />
</div>
<div class="form-row">
<Label size="L">From email address</Label>
<Input type="email" bind:value={smtpConfig.config.from} />
</div>
</Layout>
<div>
<Button cta on:click={saveSmtp}>Save</Button>
</div>
<Divider />
<Layout gap="XS" noPadding>
<Heading size="S">Templates</Heading>
<Body size="S">
Budibase comes out of the box with ready-made email templates to help
with user onboarding. Please refrain from changing the links.
</Body>
</Layout>
<Table
{customRenderers}
data={$email.templates}
schema={templateSchema}
{loading}
on:click={({ detail }) => $goto(`./${detail.purpose}`)}
allowEditRows={false}
allowSelectRows={false}
allowEditColumns={false}
/>
{/if}
</Layout>
{#if smtpConfig}
<Layout gap="XS" noPadding>
<Heading size="S">SMTP</Heading>
<Body size="S">
To allow your app to benefit from automated auth emails, add your SMTP
details below.
</Body>
</Layout>
<Layout gap="XS" noPadding>
<div class="form-row">
<Label size="L">Host</Label>
<Input bind:value={smtpConfig.config.host} />
</div>
<div class="form-row">
<Label size="L">Port</Label>
<Input type="number" bind:value={smtpConfig.config.port} />
</div>
<div class="form-row">
<Label size="L">User</Label>
<Input bind:value={smtpConfig.config.auth.user} />
</div>
<div class="form-row">
<Label size="L">Password</Label>
<Input type="password" bind:value={smtpConfig.config.auth.pass} />
</div>
<div class="form-row">
<Label size="L">From email address</Label>
<Input type="email" bind:value={smtpConfig.config.from} />
</div>
</Layout>
<div>
<Button cta on:click={saveSmtp}>Save</Button>
</div>
<Divider />
<Layout gap="XS" noPadding>
<Heading size="S">Templates</Heading>
<Body size="S">
Budibase comes out of the box with ready-made email templates to help
with user onboarding. Please refrain from changing the links.
</Body>
</Layout>
<Table
{customRenderers}
data={$email.templates}
schema={templateSchema}
{loading}
on:click={({ detail }) => $goto(`./${detail.purpose}`)}
allowEditRows={false}
allowSelectRows={false}
allowEditColumns={false}
/>
{/if}
</Layout>
</Page>
<style>
.form-row {

7
packages/builder/src/pages/builder/portal/manage/users/_layout.svelte Normal file
View file

@ -0,0 +1,7 @@
<script>
import { Page } from "@budibase/bbui"
</script>
<Page>
<slot />
</Page>