CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-07-11 17:26:01 +12:00
Code Issues Projects Releases Wiki Activity

Move large create screen button to icon

Browse source
This commit is contained in:
Andrew Kingston 2020-10-22 18:12:40 +01:00
parent 62da83e27f
commit 1c149d7d5c
1 changed files with 26 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

31
packages/builder/src/components/userInterface/FrontendNavigatePane.svelte
View file

@ -4,20 +4,41 @@
import PageLayout from "components/userInterface/PageLayout.svelte"
import PagesList from "components/userInterface/PagesList.svelte"
import NewScreenModal from "components/userInterface/NewScreenModal.svelte"
import { Button, Spacer, Modal, Heading } from "@budibase/bbui"
import { Modal } from "@budibase/bbui"
let modal
</script>
<Heading small>Screens</Heading>
<div class="title">
<h1>Screens</h1>
<i on:click={modal.show} class="ri-add-circle-fill" />
</div>
<PagesList />
<Button primary wide on:click={modal.show}>Create New Screen</Button>
<div class="nav-items-container">
<PageLayout layout={$store.pages[$store.currentPageName]} />
<ComponentsHierarchy screens={$store.screens} />
</div>
<Modal bind:this={modal}>
<NewScreenModal />
</Modal>
<style>
.title {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.title h1 {
font-size: var(--font-size-m);
font-weight: 500;
margin: 0;
}
.title i {
font-size: 20px;
}
.title i:hover {
cursor: pointer;
color: var(--blue);
}
</style>