CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-10-04 03:54:37 +13:00
Code Issues Projects Releases Wiki Activity

Fix some issues with dropzone height and ensure field alignment settings are ignored unless used inside a form block

Browse source
This commit is contained in:
Andrew Kingston 2023-10-27 08:50:26 +01:00
parent 77cd723315
commit e2c2f5e2a6
4 changed files with 26 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
packages/bbui/src/Form/Core/Dropzone.svelte
View file

@ -384,7 +384,7 @@
} }
.compact .placeholder, .compact .placeholder,
.compact img { .compact img {
margin: 10px 16px; margin: 8px 16px;
} }
.compact img { .compact img {
height: 90px; height: 90px;
@ -454,6 +454,12 @@
color: var(--red); color: var(--red);
} }
.spectrum-Dropzone {
height: 220px;
}
.compact .spectrum-Dropzone {
height: 40px;
}
.spectrum-Dropzone.disabled { .spectrum-Dropzone.disabled {
pointer-events: none; pointer-events: none;
background-color: var(--spectrum-global-color-gray-200); background-color: var(--spectrum-global-color-gray-200);
@ -461,10 +467,6 @@
.disabled .spectrum-Heading--sizeL { .disabled .spectrum-Heading--sizeL {
color: var(--spectrum-alias-text-color-disabled); color: var(--spectrum-alias-text-color-disabled);
} }
.compact .spectrum-Dropzone {
padding-top: 8px;
padding-bottom: 8px;
}
.compact .spectrum-IllustratedMessage-description { .compact .spectrum-IllustratedMessage-description {
margin: 0; margin: 0;
} }
@ -475,7 +477,6 @@
flex-wrap: wrap; flex-wrap: wrap;
justify-content: center; justify-content: center;
} }
.tag { .tag {
margin-top: 8px; margin-top: 8px;
} }

2
packages/client/src/components/app/blocks/form/InnerFormBlock.svelte
View file

@ -233,7 +233,7 @@
{/if} {/if}
{#key fields} {#key fields}
<BlockComponent type="container"> <BlockComponent type="container">
<div class="fields" class:mobile={$context.device.mobile}> <div class="form-block fields" class:mobile={$context.device.mobile}>
{#each fields as field, idx} {#each fields as field, idx}
{#if getComponentForField(field) && field.active} {#if getComponentForField(field) && field.active}
<BlockComponent <BlockComponent

38
packages/client/src/components/app/forms/AttachmentField.svelte
View file

@ -79,27 +79,19 @@
bind:fieldApi bind:fieldApi
defaultValue={[]} defaultValue={[]}
> >
<div class="minHeightWrapper"> {#if fieldState}
{#if fieldState} <CoreDropzone
<CoreDropzone value={fieldState.value}
value={fieldState.value} disabled={fieldState.disabled}
disabled={fieldState.disabled} error={fieldState.error}
error={fieldState.error} on:change={handleChange}
on:change={handleChange} {processFiles}
{processFiles} {deleteAttachments}
{deleteAttachments} {handleFileTooLarge}
{handleFileTooLarge} {handleTooManyFiles}
{handleTooManyFiles} {maximum}
{maximum} {extensions}
{extensions} {compact}
{compact} />
/> {/if}
{/if}
</div>
</Field> </Field>
<style>
.minHeightWrapper {
min-height: 80px;
}
</style>

6
packages/client/src/components/app/forms/Field.svelte
View file

@ -102,13 +102,13 @@
</div> </div>
<style> <style>
.spectrum-Form-item.span-2 { :global(.form-block .spectrum-Form-item.span-2) {
grid-column: span 2; grid-column: span 2;
} }
.spectrum-Form-item.span-3 { :global(.form-block .spectrum-Form-item.span-3) {
grid-column: span 3; grid-column: span 3;
} }
.spectrum-Form-item.span-6 { :global(.form-block .spectrum-Form-item.span-6) {
grid-column: span 6; grid-column: span 6;
} }
.spectrum-Form-item.above { .spectrum-Form-item.above {