fix label not being rendered correctly
This commit is contained in:
parent
cd3beb3b6c
commit
a871a3a44f
|
@ -6,7 +6,7 @@
|
||||||
import Heading from "../Typography/Heading.svelte"
|
import Heading from "../Typography/Heading.svelte"
|
||||||
|
|
||||||
export let title
|
export let title
|
||||||
|
export let fillWidth
|
||||||
let visible = false
|
let visible = false
|
||||||
|
|
||||||
export function show() {
|
export function show() {
|
||||||
|
@ -34,7 +34,7 @@
|
||||||
|
|
||||||
{#if visible}
|
{#if visible}
|
||||||
<Portal>
|
<Portal>
|
||||||
<section class="drawer" transition:slide>
|
<section class:fillWidth class="drawer" transition:slide>
|
||||||
<header>
|
<header>
|
||||||
<div class="text">
|
<div class="text">
|
||||||
<Heading size="XS">{title}</Heading>
|
<Heading size="XS">{title}</Heading>
|
||||||
|
@ -63,6 +63,10 @@
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.fillWidth {
|
||||||
|
width: calc(100% - 260px) !important;
|
||||||
|
}
|
||||||
|
|
||||||
header {
|
header {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
|
|
@ -76,7 +76,7 @@
|
||||||
<div class="fields">
|
<div class="fields">
|
||||||
{#each schemaProperties as [key, value]}
|
{#each schemaProperties as [key, value]}
|
||||||
<div class="block-field">
|
<div class="block-field">
|
||||||
<Label>{value.title || key}</Label>
|
<Label>{value.title || (key === "row" ? "Table" : key)}</Label>
|
||||||
{#if value.type === "string" && value.enum}
|
{#if value.type === "string" && value.enum}
|
||||||
<Select
|
<Select
|
||||||
on:change={e => onChange(e, key)}
|
on:change={e => onChange(e, key)}
|
||||||
|
@ -102,6 +102,7 @@
|
||||||
/>
|
/>
|
||||||
{:else}
|
{:else}
|
||||||
<DrawerBindableInput
|
<DrawerBindableInput
|
||||||
|
fillWidth
|
||||||
title={value.title}
|
title={value.title}
|
||||||
panel={AutomationBindingPanel}
|
panel={AutomationBindingPanel}
|
||||||
type="email"
|
type="email"
|
||||||
|
@ -161,14 +162,17 @@
|
||||||
{bindings}
|
{bindings}
|
||||||
/>
|
/>
|
||||||
{:else}
|
{:else}
|
||||||
<DrawerBindableInput
|
<div class="test">
|
||||||
title={value.title}
|
<DrawerBindableInput
|
||||||
panel={AutomationBindingPanel}
|
fillWidth
|
||||||
type={value.customType}
|
title={value.title}
|
||||||
value={inputData[key]}
|
panel={AutomationBindingPanel}
|
||||||
on:change={e => onChange(e, key)}
|
type={value.customType}
|
||||||
{bindings}
|
value={inputData[key]}
|
||||||
/>
|
on:change={e => onChange(e, key)}
|
||||||
|
{bindings}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
|
@ -191,4 +195,8 @@
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-gap: 5px;
|
grid-gap: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.test :global(.drawer) {
|
||||||
|
width: 10000px !important;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -14,6 +14,7 @@
|
||||||
export let placeholder
|
export let placeholder
|
||||||
export let label
|
export let label
|
||||||
export let disabled = false
|
export let disabled = false
|
||||||
|
export let fillWidth = false
|
||||||
|
|
||||||
const dispatch = createEventDispatcher()
|
const dispatch = createEventDispatcher()
|
||||||
let bindingDrawer
|
let bindingDrawer
|
||||||
|
@ -45,7 +46,7 @@
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
<Drawer bind:this={bindingDrawer} {title}>
|
<Drawer {fillWidth} bind:this={bindingDrawer} {title}>
|
||||||
<svelte:fragment slot="description">
|
<svelte:fragment slot="description">
|
||||||
Add the objects on the left to enrich your text.
|
Add the objects on the left to enrich your text.
|
||||||
</svelte:fragment>
|
</svelte:fragment>
|
||||||
|
|
Loading…
Reference in New Issue