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

Fix spacing in manage user page and add first name and last name fields

This commit is contained in:
Andrew Kingston 2021-05-19 10:39:23 +01:00
parent 8049088fa0
commit a6e80da57f
1 changed files with 37 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

84
packages/builder/src/pages/builder/portal/manage/users/[userId].svelte
View File

@ -56,44 +56,50 @@
} }
</script> </script>
<Layout noPadding gap="XS"> <Layout noPadding>
<div class="back"> <Layout gap="XS" noPadding>
<ActionButton <div class="back">
on:click={() => $goto("./")} <ActionButton
quiet on:click={() => $goto("./")}
size="S" quiet
icon="BackAndroid" size="S"
> icon="BackAndroid"
Back to users >
</ActionButton> Back to users
</div> </ActionButton>
<div class="heading"> </div>
<Layout noPadding gap="XS"> <Heading>User: {$roleFetch?.data?.email}</Heading>
<Heading>User: {$roleFetch?.data?.email}</Heading> <Body>
<Body> Lorem ipsum dolor sit amet consectetur adipisicing elit. Debitis porro ut
Lorem ipsum dolor sit amet consectetur adipisicing elit. Debitis porro nesciunt ipsam perspiciatis aliquam et hic minus alias beatae. Odit
ut nesciunt ipsam perspiciatis aliquam et hic minus alias beatae. Odit veritatis quos quas laborum magnam tenetur perspiciatis ex hic.
veritatis quos quas laborum magnam tenetur perspiciatis ex hic. </Body>
</Body> </Layout>
</Layout>
</div>
<Divider size="S" /> <Divider size="S" />
<div class="general"> <Layout gap="S" noPadding>
<Heading size="S">General</Heading> <Heading size="S">General</Heading>
<div class="fields"> <div class="fields">
<div class="field"> <div class="field">
<Label size="L">Email</Label> <Label size="L">Email</Label>
<Input disabled thin value={$roleFetch?.data?.email} /> <Input disabled thin value={$roleFetch?.data?.email} />
</div> </div>
<div class="field">
<Label size="L">First name</Label>
<Input disabled thin value={$roleFetch?.data?.firstName} />
</div>
<div class="field">
<Label size="L">Last name</Label>
<Input disabled thin value={$roleFetch?.data?.lastName} />
</div>
</div> </div>
<div class="regenerate"> <div class="regenerate">
<ActionButton size="S" icon="Refresh" quiet> <ActionButton size="S" icon="Refresh" quiet>
Regenerate password Regenerate password
</ActionButton> </ActionButton>
</div> </div>
</div> </Layout>
<Divider size="S" /> <Divider size="S" />
<div class="roles"> <Layout gap="S" noPadding>
<Heading size="S">Configure roles</Heading> <Heading size="S">Configure roles</Heading>
<Table <Table
on:click={openUpdateRolesModal} on:click={openUpdateRolesModal}
@ -104,16 +110,14 @@
allowSelectRows={false} allowSelectRows={false}
customRenderers={[{ column: "role", component: TagsRenderer }]} customRenderers={[{ column: "role", component: TagsRenderer }]}
/> />
</div> </Layout>
<Divider size="S" /> <Divider size="S" />
<div class="delete"> <Layout gap="XS" noPadding>
<Layout gap="S" noPadding> <Heading size="S">Delete user</Heading>
<Heading size="S">Delete user</Heading> <Body>Deleting a user completely removes them from your account.</Body>
<Body>Deleting a user completely removes them from your account.</Body> </Layout>
<div class="delete-button"> <div class="delete-button">
<Button warning on:click={deleteUserModal.show}>Delete user</Button> <Button warning on:click={deleteUserModal.show}>Delete user</Button>
</div>
</Layout>
</div> </div>
</Layout> </Layout>
@ -143,26 +147,12 @@
.fields { .fields {
display: grid; display: grid;
grid-gap: var(--spacing-m); grid-gap: var(--spacing-m);
margin-top: var(--spacing-xl);
} }
.field { .field {
display: grid; display: grid;
grid-template-columns: 32% 1fr; grid-template-columns: 32% 1fr;
align-items: center; align-items: center;
} }
.heading {
margin-bottom: var(--spacing-xl);
}
.general {
position: relative;
margin: var(--spacing-xl) 0;
}
.roles {
margin: var(--spacing-xl) 0;
}
.delete {
margin-top: var(--spacing-xl);
}
.regenerate { .regenerate {
position: absolute; position: absolute;
top: 0; top: 0;