fix label not being rendered correctly

This commit is contained in:
Peter Clement 2021-09-16 12:15:32 +01:00
parent cd3beb3b6c
commit a871a3a44f
3 changed files with 25 additions and 12 deletions

View File

@ -6,7 +6,7 @@
import Heading from "../Typography/Heading.svelte"
export let title
export let fillWidth
let visible = false
export function show() {
@ -34,7 +34,7 @@
{#if visible}
<Portal>
<section class="drawer" transition:slide>
<section class:fillWidth class="drawer" transition:slide>
<header>
<div class="text">
<Heading size="XS">{title}</Heading>
@ -63,6 +63,10 @@
z-index: 2;
}
.fillWidth {
width: calc(100% - 260px) !important;
}
header {
display: flex;
justify-content: space-between;

View File

@ -76,7 +76,7 @@
<div class="fields">
{#each schemaProperties as [key, value]}
<div class="block-field">
<Label>{value.title || key}</Label>
<Label>{value.title || (key === "row" ? "Table" : key)}</Label>
{#if value.type === "string" && value.enum}
<Select
on:change={e => onChange(e, key)}
@ -102,6 +102,7 @@
/>
{:else}
<DrawerBindableInput
fillWidth
title={value.title}
panel={AutomationBindingPanel}
type="email"
@ -161,14 +162,17 @@
{bindings}
/>
{:else}
<DrawerBindableInput
title={value.title}
panel={AutomationBindingPanel}
type={value.customType}
value={inputData[key]}
on:change={e => onChange(e, key)}
{bindings}
/>
<div class="test">
<DrawerBindableInput
fillWidth
title={value.title}
panel={AutomationBindingPanel}
type={value.customType}
value={inputData[key]}
on:change={e => onChange(e, key)}
{bindings}
/>
</div>
{/if}
{/if}
</div>
@ -191,4 +195,8 @@
display: grid;
grid-gap: 5px;
}
.test :global(.drawer) {
width: 10000px !important;
}
</style>

View File

@ -14,6 +14,7 @@
export let placeholder
export let label
export let disabled = false
export let fillWidth = false
const dispatch = createEventDispatcher()
let bindingDrawer
@ -45,7 +46,7 @@
</div>
{/if}
</div>
<Drawer bind:this={bindingDrawer} {title}>
<Drawer {fillWidth} bind:this={bindingDrawer} {title}>
<svelte:fragment slot="description">
Add the objects on the left to enrich your text.
</svelte:fragment>