formatting
This commit is contained in:
parent
e7b05cfd01
commit
55acdbde9b
3 changed files with 70 additions and 33 deletions
|
@ -1,4 +1,4 @@
|
||||||
<script>
|
<script>
|
||||||
import { MoreIcon } from "components/common/Icons"
|
import { MoreIcon } from "components/common/Icons"
|
||||||
import { store } from "builderStore"
|
import { store } from "builderStore"
|
||||||
import { getComponentDefinition } from "builderStore/store"
|
import { getComponentDefinition } from "builderStore/store"
|
||||||
|
@ -155,16 +155,52 @@
|
||||||
<MoreIcon />
|
<MoreIcon />
|
||||||
</button>
|
</button>
|
||||||
<ul class="menu" bind:this={dropdownEl} on:click={hideDropdown}>
|
<ul class="menu" bind:this={dropdownEl} on:click={hideDropdown}>
|
||||||
<li class="item" on:click={() => confirmDeleteDialog.show()}><i class="icon ri-delete-bin-2-line"></i>Delete</li>
|
<li class="item" on:click={() => confirmDeleteDialog.show()}>
|
||||||
<li class="item" on:click={moveUpComponent}><i class="icon ri-arrow-up-line"></i>Move up</li>
|
<i class="icon ri-delete-bin-2-line" />
|
||||||
<li class="item" on:click={moveDownComponent}><i class="icon ri-arrow-down-line"></i>Move down</li>
|
Delete
|
||||||
<li class="item" on:click={copyComponent}><i class="icon ri-repeat-one-line"></i>Duplicate</li>
|
</li>
|
||||||
<li class="item" on:click={() => storeComponentForCopy(true)}><i class="icon ri-scissors-cut-line"></i>Cut</li>
|
<li class="item" on:click={moveUpComponent}>
|
||||||
<li class="item" on:click={() => storeComponentForCopy(false)}><i class="icon ri-file-copy-line"></i>Copy</li>
|
<i class="icon ri-arrow-up-line" />
|
||||||
<hr class="hr-style">
|
Move up
|
||||||
<li class="item" class:disabled={noPaste} on:click={() => pasteComponent('above')}><i class="icon ri-insert-row-top"></i>Paste above</li>
|
</li>
|
||||||
<li class="item" class:disabled={noPaste} on:click={() => pasteComponent('below')}><i class="icon ri-insert-row-bottom"></i>Paste below</li>
|
<li class="item" on:click={moveDownComponent}>
|
||||||
<li class="item" class:disabled={noPaste || noChildrenAllowed} on:click={() => pasteComponent('inside')}><i class="icon ri-insert-column-right"></i>Paste inside</li>
|
<i class="icon ri-arrow-down-line" />
|
||||||
|
Move down
|
||||||
|
</li>
|
||||||
|
<li class="item" on:click={copyComponent}>
|
||||||
|
<i class="icon ri-repeat-one-line" />
|
||||||
|
Duplicate
|
||||||
|
</li>
|
||||||
|
<li class="item" on:click={() => storeComponentForCopy(true)}>
|
||||||
|
<i class="icon ri-scissors-cut-line" />
|
||||||
|
Cut
|
||||||
|
</li>
|
||||||
|
<li class="item" on:click={() => storeComponentForCopy(false)}>
|
||||||
|
<i class="icon ri-file-copy-line" />
|
||||||
|
Copy
|
||||||
|
</li>
|
||||||
|
<hr class="hr-style" />
|
||||||
|
<li
|
||||||
|
class="item"
|
||||||
|
class:disabled={noPaste}
|
||||||
|
on:click={() => pasteComponent('above')}>
|
||||||
|
<i class="icon ri-insert-row-top" />
|
||||||
|
Paste above
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
class="item"
|
||||||
|
class:disabled={noPaste}
|
||||||
|
on:click={() => pasteComponent('below')}>
|
||||||
|
<i class="icon ri-insert-row-bottom" />
|
||||||
|
Paste below
|
||||||
|
</li>
|
||||||
|
<li
|
||||||
|
class="item"
|
||||||
|
class:disabled={noPaste || noChildrenAllowed}
|
||||||
|
on:click={() => pasteComponent('inside')}>
|
||||||
|
<i class="icon ri-insert-column-right" />
|
||||||
|
Paste inside
|
||||||
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -235,6 +271,6 @@
|
||||||
|
|
||||||
.hr-style {
|
.hr-style {
|
||||||
margin: 8px 0;
|
margin: 8px 0;
|
||||||
color: var(--grey-dark)
|
color: var(--grey-dark);
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -14,7 +14,10 @@
|
||||||
|
|
||||||
<PagesList />
|
<PagesList />
|
||||||
|
|
||||||
<button class="newscreen" on:click={newScreen}><i class="icon ri-add-circle-fill"></i>Create New Screen</button>
|
<button class="newscreen" on:click={newScreen}>
|
||||||
|
<i class="icon ri-add-circle-fill" />
|
||||||
|
Create New Screen
|
||||||
|
</button>
|
||||||
|
|
||||||
<PageLayout layout={$store.pages[$store.currentPageName]} />
|
<PageLayout layout={$store.pages[$store.currentPageName]} />
|
||||||
|
|
||||||
|
|
|
@ -40,8 +40,7 @@
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<div
|
||||||
<div
|
|
||||||
class="budibase__nav-item root"
|
class="budibase__nav-item root"
|
||||||
class:selected={$store.currentComponentInfo._id === _layout.component.props._id}
|
class:selected={$store.currentComponentInfo._id === _layout.component.props._id}
|
||||||
on:click|stopPropagation={setCurrentScreenToLayout}>
|
on:click|stopPropagation={setCurrentScreenToLayout}>
|
||||||
|
@ -52,17 +51,16 @@
|
||||||
</span>
|
</span>
|
||||||
<i class="ri-layout-3-fill icon-big" />
|
<i class="ri-layout-3-fill icon-big" />
|
||||||
<span class="title">Master Screen</span>
|
<span class="title">Master Screen</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{#if $store.currentPreviewItem.name === _layout.title && _layout.component.props._children}
|
{#if $store.currentPreviewItem.name === _layout.title && _layout.component.props._children}
|
||||||
<ComponentsHierarchyChildren
|
<ComponentsHierarchyChildren
|
||||||
thisComponent={_layout.component.props}
|
thisComponent={_layout.component.props}
|
||||||
components={_layout.component.props._children}
|
components={_layout.component.props._children}
|
||||||
currentComponent={$store.currentComponentInfo} />
|
currentComponent={$store.currentComponentInfo} />
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
|
Loading…
Reference in a new issue