Update styles in normal user app portal

This commit is contained in:
Andrew Kingston 2021-09-14 16:38:47 +01:00
parent b3fa4e61e3
commit 7ded058831
1 changed files with 17 additions and 18 deletions

View File

@ -41,17 +41,8 @@
<Page> <Page>
<div class="content"> <div class="content">
<Layout noPadding> <Layout noPadding>
<div class="header">
<img alt="logo" src={$organisation.logoUrl || Logo} /> <img alt="logo" src={$organisation.logoUrl || Logo} />
<div class="info-title">
<Layout noPadding gap="XS">
<Heading size="L">
Hey {$auth.user.firstName || $auth.user.email}
</Heading>
<Body>
Welcome to the {$organisation.company} portal. Below you'll find
the list of apps that you have access to.
</Body>
</Layout>
<ActionMenu align="right"> <ActionMenu align="right">
<div slot="control" class="avatar"> <div slot="control" class="avatar">
<Avatar <Avatar
@ -81,6 +72,15 @@
<MenuItem icon="LogOut" on:click={auth.logout}>Log out</MenuItem> <MenuItem icon="LogOut" on:click={auth.logout}>Log out</MenuItem>
</ActionMenu> </ActionMenu>
</div> </div>
<Layout noPadding gap="XS">
<Heading size="M">
Hey {$auth.user.firstName || $auth.user.email}
</Heading>
<Body>
Welcome to the {$organisation.company} portal. Below you'll find the
list of apps that you have access to.
</Body>
</Layout>
<Divider /> <Divider />
{#if publishedApps.length} {#if publishedApps.length}
<Heading>Apps</Heading> <Heading>Apps</Heading>
@ -137,18 +137,18 @@
overflow: auto; overflow: auto;
} }
.content { .content {
padding: 60px 0;
width: 100%; width: 100%;
} }
.header {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
img { img {
width: 40px; width: 40px;
margin-bottom: -12px; margin-bottom: -12px;
} }
.info-title {
display: grid;
grid-template-columns: 1fr auto;
grid-gap: var(--spacing-xl);
}
.avatar { .avatar {
display: grid; display: grid;
grid-template-columns: auto auto; grid-template-columns: auto auto;
@ -160,7 +160,6 @@
filter: brightness(110%); filter: brightness(110%);
} }
.group { .group {
margin-top: var(--spacing-s);
} }
.app { .app {
display: grid; display: grid;