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

Remove scrolling from tables when not required and stop selects from updating their own state locally

This commit is contained in:
Andrew Kingston 2022-12-20 17:12:36 +00:00
parent 75af4cbfbf
commit 5d74763c42
2 changed files with 9 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
packages/bbui/src/Form/Select.svelte
View File

@ -1,7 +1,6 @@
<script> <script>
import Field from "./Field.svelte" import Field from "./Field.svelte"
import Select from "./Core/Select.svelte" import Select from "./Core/Select.svelte"
import { createEventDispatcher } from "svelte"
export let value = null export let value = null
export let label = undefined export let label = undefined
@ -21,12 +20,6 @@
export let sort = false export let sort = false
export let tooltip = "" export let tooltip = ""
const dispatch = createEventDispatcher()
const onChange = e => {
value = e.detail
dispatch("change", e.detail)
}
const extractProperty = (value, property) => { const extractProperty = (value, property) => {
if (value && typeof value === "object") { if (value && typeof value === "object") {
return value[property] return value[property]
@ -51,7 +44,7 @@
{getOptionIcon} {getOptionIcon}
{getOptionColour} {getOptionColour}
{isOptionEnabled} {isOptionEnabled}
on:change={onChange} on:change
on:click on:click
/> />
</Field> </Field>

10
packages/bbui/src/Table/Table.svelte
View File

@ -300,7 +300,11 @@
</slot> </slot>
</div> </div>
{:else} {:else}
<div class="spectrum-Table" style={`${heightStyle}${gridStyle}`}> <div
class="spectrum-Table"
class:no-scroll={!rowCount}
style={`${heightStyle}${gridStyle}`}
>
{#if fields.length} {#if fields.length}
<div class="spectrum-Table-head"> <div class="spectrum-Table-head">
{#if showEditColumn} {#if showEditColumn}
@ -443,7 +447,6 @@
/* Wrapper */ /* Wrapper */
.wrapper { .wrapper {
position: relative; position: relative;
z-index: 0;
--table-bg: var(--spectrum-global-color-gray-50); --table-bg: var(--spectrum-global-color-gray-50);
--table-border: 1px solid var(--spectrum-alias-border-color-mid); --table-border: 1px solid var(--spectrum-alias-border-color-mid);
--cell-padding: var(--spectrum-global-dimension-size-250); --cell-padding: var(--spectrum-global-dimension-size-250);
@ -470,6 +473,9 @@
display: grid; display: grid;
overflow: auto; overflow: auto;
} }
.spectrum-Table.no-scroll {
overflow: visible;
}
/* Header */ /* Header */
.spectrum-Table-head { .spectrum-Table-head {