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

removed LayoutEditor (not used)

This commit is contained in:
Michael Shanks 2020-08-17 16:43:54 +01:00
parent dd64b64ce3
commit 6214a2a7ea
2 changed files with 0 additions and 171 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/builder/src/components/userInterface/ComponentPropertiesPanel.svelte
View File

@ -11,7 +11,6 @@
CircleIndicator,
EventsIcon,
} from "components/common/Icons/"
import LayoutEditor from "./LayoutEditor.svelte"
import EventsEditor from "./EventsEditor"
import panelStructure from "./temporaryPanelStructure.js"
import CategoryTab from "./CategoryTab.svelte"

170
packages/builder/src/components/userInterface/LayoutEditor.svelte
View File

@ -1,170 +0,0 @@
<script>
import InputGroup from "../common/Inputs/InputGroup.svelte"
import LayoutTemplateControls from "./LayoutTemplateControls.svelte"
export let onStyleChanged = () => {}
export let component
const tbrl = [
{ placeholder: "T" },
{ placeholder: "R" },
{ placeholder: "B" },
{ placeholder: "L" },
]
const se = [{ placeholder: "START" }, { placeholder: "END" }]
const single = [{ placeholder: "" }]
$: layout = {
...component._styles.position,
...component._styles.layout,
}
$: layouts = {
templaterows: ["Grid Rows", single],
templatecolumns: ["Grid Columns", single],
}
$: display = {
direction: ["Direction", single],
align: ["Align", single],
justify: ["Justify", single],
}
$: positions = {
column: ["Column", se],
row: ["Row", se],
}
$: spacing = {
margin: ["Margin", tbrl, "small"],
padding: ["Padding", tbrl, "small"],
}
$: size = {
height: ["Height", single],
width: ["Width", single],
}
$: zindex = {
zindex: ["Z-Index", single],
}
const newValue = n => Array(n).fill("")
</script>
<h3>Layout</h3>
<div class="layout-pos">
{#each Object.entries(display) as [key, [name, meta, size]] (component._id + key)}
<div class="grid">
<h5>{name}:</h5>
<LayoutTemplateControls
onStyleChanged={_value => onStyleChanged('layout', key, _value)}
values={layout[key] || newValue(meta.length)}
propertyName={name}
{meta}
{size}
type="text" />
</div>
{/each}
</div>
<!-- <h4>Positioning</h4>
<div class="layout-pos">
{#each Object.entries(positions) as [key, [name, meta, size]] (component._id + key)}
<div class="grid">
<h5>{name}:</h5>
<InputGroup
onStyleChanged={_value => onStyleChanged('position', key, _value)}
values={layout[key] || newValue(meta.length)}
{meta}
{size} />
</div>
{/each}
</div> -->
<h3>Spacing</h3>
<div class="layout-spacing">
{#each Object.entries(spacing) as [key, [name, meta, size]] (component._id + key)}
<div class="grid">
<h5>{name}:</h5>
<InputGroup
onStyleChanged={_value => onStyleChanged('position', key, _value)}
values={layout[key] || newValue(meta.length)}
{meta}
{size}
type="text" />
</div>
{/each}
</div>
<h3>Size</h3>
<div class="layout-layer">
{#each Object.entries(size) as [key, [name, meta, size]] (component._id + key)}
<div class="grid">
<h5>{name}:</h5>
<InputGroup
onStyleChanged={_value => onStyleChanged('position', key, _value)}
values={layout[key] || newValue(meta.length)}
type="text"
{meta}
{size} />
</div>
{/each}
</div>
<h3>Order</h3>
<div class="layout-layer">
{#each Object.entries(zindex) as [key, [name, meta, size]] (component._id + key)}
<div class="grid">
<h5>{name}:</h5>
<InputGroup
onStyleChanged={_value => onStyleChanged('position', key, _value)}
values={layout[key] || newValue(meta.length)}
{meta}
{size} />
</div>
{/each}
</div>
<style>
h3 {
text-transform: uppercase;
font-size: 13px;
font-weight: 600;
color: var(--ink);
opacity: 0.6;
margin-bottom: 10px;
}
h4 {
text-transform: uppercase;
font-size: 10px;
font-weight: 600;
color: var(--ink);
opacity: 0.4;
margin-bottom: 10px;
}
h5 {
font-size: 13px;
font-weight: 400;
color: var(--ink);
opacity: 0.8;
padding-top: 13px;
margin-bottom: 0;
}
div > div {
display: grid;
grid-template-rows: 1fr;
grid-gap: 10px;
height: 40px;
margin-bottom: 15px;
}
.grid {
grid-template-columns: 70px 2fr;
}
</style>