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

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

pull/1505/head
Andrew Kingston 5 years ago
parent
c62b002182
commit
1e595cb452
1 changed files with 37 additions and 47 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 84
      packages/builder/src/pages/builder/portal/manage/users/[userId].svelte

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;

Write Preview
Loading…
Cancel
Save