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

Formatting update

This commit is contained in:
Joe 2020-05-29 18:32:52 +01:00
parent cee06067a8
commit 1c541c684e
8 changed files with 41 additions and 96 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/builder/src/components/common/AppNotification.svelte
View File

@ -71,7 +71,7 @@
margin-left: 20px;
}
:global(.refresh-page-button):hover{
:global(.refresh-page-button):hover {
background: var(--grey-light);
}
</style>

15
packages/builder/src/components/common/Switcher.svelte
View File

@ -9,9 +9,6 @@
let selectedIndex = 0
const isSelected = tab => selected === tab
</script>
<div class="root">
@ -19,9 +16,7 @@
<div class="switcher">
{#each tabs as tab}
<button
class:selected={selected === tab}
on:click={() => selectTab(tab)}>
<button class:selected={selected === tab} on:click={() => selectTab(tab)}>
{tab}
</button>
{/each}
@ -30,13 +25,13 @@
<div class="panel">
{#if selectedIndex === 0}
<slot name="0"></slot>
<slot name="0" />
{:else if selectedIndex === 1}
<slot name="1"></slot>
<slot name="1" />
{:else if selectedIndex === 2}
<slot name="2"></slot>
<slot name="2" />
{:else if selectedIndex === 3}
<slot name="3"></slot>
<slot name="3" />
{/if}
</div>

5
packages/builder/src/components/userInterface/ComponentSelectionList.svelte
View File

@ -33,15 +33,14 @@
const onComponentChosen = component => {
store.addChildComponent(component._component)
toggleTab("Navigate")
// Get ID path
const path = store.getPathToComponent($store.currentComponentInfo)
// Go to correct URL
$goto(`./:page/:screen/${path}`)
}
</script>

2
packages/builder/src/components/userInterface/ComponentsHierarchy.svelte
View File

@ -61,7 +61,7 @@
{/if}
</span>
<i class="ri-artboard-2-fill icon"></i>
<i class="ri-artboard-2-fill icon" />
<span class="title">{screen.title}</span>
</div>

83
packages/builder/src/components/userInterface/FrontendNavigatePane.svelte
View File

@ -4,7 +4,7 @@
import PageLayout from "components/userInterface/PageLayout.svelte"
import PagesList from "components/userInterface/PagesList.svelte"
import NewScreen from "components/userInterface/NewScreen.svelte"
const newScreen = () => {
newScreenPicker.show()
}
@ -14,15 +14,10 @@
<PagesList />
<button
class="newscreen"
on:click={newScreen}>
Create New Screen
</button>
<button class="newscreen" on:click={newScreen}>Create New Screen</button>
<PageLayout layout={$store.pages[$store.currentPageName]} />
<div class="nav-items-container">
<ComponentsHierarchy screens={$store.screens} />
</div>
@ -30,59 +25,25 @@
<NewScreen bind:this={newScreenPicker} />
<style>
.newscreen {
cursor: pointer;
border: 1px solid var(--grey-dark);
border-radius: 3px;
width: 100%;
padding: 8px 16px;
margin: 12px 0px;
display: flex;
justify-content: center;
align-items: center;
background: white;
color: var(--ink);
font-size: 14px;
font-weight: 500;
transition: all 2ms;
}
.newscreen {
cursor: pointer;
border: 1px solid var(--grey-dark);
border-radius: 3px;
width: 100%;
padding: 8px 16px;
margin: 12px 0px;
display: flex;
justify-content: center;
align-items: center;
background: white;
color: var(--ink);
font-size: 14px;
font-weight: 500;
transition: all 2ms;
}
.newscreen:hover {
background: var(--grey-light);
}
.newscreen:hover {
background: var(--grey-light);
}
.components-nav-header {
font-size: 13px;
color: var(--ink);
margin-top: 20px;
font-weight: 600;
opacity: 0.4;
letter-spacing: 1px;
}
.nav-group-header {
display: flex;
font-size: 0.9rem;
font-weight: bold;
justify-content: space-between;
align-items: center;
}
.nav-group-header > span:nth-child(3) {
margin-left: 5px;
vertical-align: bottom;
grid-column-start: title;
margin-top: auto;
}
.border-line {
border-bottom: 1px solid #d8d8d8;
}
.components-list-container {
padding: 20px 0px 0 0;
}
</style>
</style>

5
packages/builder/src/components/userInterface/PageLayout.svelte
View File

@ -55,8 +55,8 @@
class:rotate={$store.currentPreviewItem.name !== _layout.title}>
<ArrowDownIcon />
</span>
<i class="ri-layout-3-fill icon-big"></i>
<span class="title">Master Screen</span>
<i class="ri-layout-3-fill icon-big" />
<span class="title">Master Screen</span>
</div>
{#if $store.currentPreviewItem.name === _layout.title && _layout.component.props._children}
@ -79,7 +79,6 @@
onOk={() => store.deleteComponent(componentToDelete)} />
<style>
.pagelayoutSection {
margin: 20px 0px 0px 0px;
}

13
packages/builder/src/components/userInterface/PagesList.svelte
View File

@ -28,13 +28,11 @@
</script>
<div class="root">
{#each pages as { title, id }}
<button
class:active={id === $params.page}
on:click={() => changePage(id)}>
{title}
</button>
{/each}
{#each pages as { title, id }}
<button class:active={id === $params.page} on:click={() => changePage(id)}>
{title}
</button>
{/each}
</div>
<style>
@ -63,5 +61,4 @@
background: var(--ink-light);
color: var(--white);
}
</style>

12
packages/builder/src/pages/[application]/frontend/_layout.svelte
View File

@ -26,11 +26,9 @@
}
})
let confirmDeleteDialog
let componentToDelete = ""
let settingsView
const settings = () => {
settingsView.show()
@ -50,21 +48,20 @@
<div class="ui-nav">
<Switcher bind:this={leftNavSwitcher} tabs={["Navigate", "Add"]}>
<Switcher bind:this={leftNavSwitcher} tabs={['Navigate', 'Add']}>
<div slot="0">
<FrontendNavigatePane />
</div>
<div slot="1">
<ComponentSelectionList toggleTab={leftNavSwitcher.selectTab} />
<ComponentSelectionList toggleTab={leftNavSwitcher.selectTab} />
</div>
</Switcher>
</div>
<div class="preview-pane">
{#if $store.currentPageName && $store.currentPageName.length > 0}
<CurrentItemPreview />
<CurrentItemPreview />
{/if}
</div>
@ -76,8 +73,6 @@
</div>
<ConfirmDialog
bind:this={confirmDeleteDialog}
title="Confirm Delete"
@ -133,5 +128,4 @@
.nav-group-header > div:nth-child(3):hover {
color: var(--primary75);
}
</style>