fixes layout issues in email templates

This commit is contained in:
Keviin Åberg Kultalahti 2021-05-20 15:03:34 +02:00
parent f730900ed5
commit 8f6205a4db
4 changed files with 94 additions and 66 deletions

View File

@ -1,11 +1,12 @@
<script> <script>
import { import {
Button,
Detail, Detail,
Heading, Heading,
notifications, ActionButton,
Icon, Body,
Page, Page,
Layout,
notifications,
Tabs, Tabs,
Tab, Tab,
} from "@budibase/bbui" } from "@budibase/bbui"
@ -46,8 +47,7 @@
} }
</script> </script>
<Page wide gap="L"> <!-- <div class="backbutton" on:click={() => $goto("./")}>
<div class="backbutton" on:click={() => $goto("./")}>
<Icon name="BackAndroid" /> <Icon name="BackAndroid" />
<span>Back</span> <span>Back</span>
</div> </div>
@ -56,7 +56,25 @@
Email Template: {template} Email Template: {template}
</Heading> </Heading>
<Button cta on:click={saveTemplate}>Save</Button> <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}> <Tabs {selected}>
<Tab title="Edit"> <Tab title="Edit">
<div class="template-editor"> <div class="template-editor">

View File

@ -5,6 +5,7 @@
Heading, Heading,
Divider, Divider,
Label, Label,
Page,
notifications, notifications,
Layout, Layout,
Input, Input,
@ -91,7 +92,8 @@
}) })
</script> </script>
<Layout> <Page>
<Layout>
<Layout noPadding gap="XS"> <Layout noPadding gap="XS">
<Heading size="M">Email</Heading> <Heading size="M">Email</Heading>
<Body> <Body>
@ -153,7 +155,8 @@
allowEditColumns={false} allowEditColumns={false}
/> />
{/if} {/if}
</Layout> </Layout>
</Page>
<style> <style>
.form-row { .form-row {

View File

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