CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-07-08 07:46:10 +12:00
Code Issues Projects Releases Wiki Activity

update layout

Browse source
This commit is contained in:
Keviin Åberg Kultalahti 2021-05-05 10:21:55 +02:00
parent 87ed1c0a9e
commit f708238624
1 changed files with 21 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
packages/builder/src/pages/portal/_layout.svelte
View file

@ -9,15 +9,18 @@
SideNavigationItem as Item, SideNavigationItem as Item,
} from "@budibase/bbui" } from "@budibase/bbui"
let orgName, orgLogo let orgName, orgLogo, onBoardingProgress
async function getOrgInfo() { async function getInfo() {
// fetch orgInfo // fetch orgInfo
orgName = "ACME Inc." orgName = "ACME Inc."
orgLogo = "https://via.placeholder.com/32" orgLogo = "https://via.placeholder.com/150"
// set onBoardingProgress
onBoardingProgress = 20
} }
onMount(getOrgInfo) onMount(getInfo)
</script> </script>
<div class="container"> <div class="container">
@ -29,7 +32,7 @@
<span>{orgName}</span> <span>{orgName}</span>
</div> </div>
<div class="onboarding"> <div class="onboarding">
<ProgressCircle /> <ProgressCircle size="S" value={onBoardingProgress} />
</div> </div>
</div> </div>
<div class="menu"> <div class="menu">
@ -51,7 +54,7 @@
<div class="toolbar"> <div class="toolbar">
<Search /> <Search />
<div class="avatar"> <div class="avatar">
<Avatar /> <Avatar url="https://via.placeholder.com/150" />
</div> </div>
</div> </div>
<div class="content"> <div class="content">
@ -75,6 +78,14 @@
display: grid; display: grid;
grid-template-columns: auto auto; grid-template-columns: auto auto;
justify-content: space-between; justify-content: space-between;
align-items: center;
margin-bottom: var(--spacing-xl);
}
.name {
display: grid;
grid-template-columns: auto auto;
grid-gap: var(--spacing-m);
align-items: center;
} }
.content { .content {
padding: var(--spacing-m); padding: var(--spacing-m);
@ -86,4 +97,8 @@
justify-content: space-between; justify-content: space-between;
padding: var(--spacing-m) calc(var(--spacing-xl) * 2); padding: var(--spacing-m) calc(var(--spacing-xl) * 2);
} }
img {
width: 32px;
height: 32px;
}
</style> </style>