Make it more obvious that multi select cells have overflow when using small line height
This commit is contained in:
parent
2f97787dfb
commit
91b2f4165d
|
@ -19,6 +19,7 @@
|
|||
export let updateValue = rows.actions.updateValue
|
||||
export let invertX = false
|
||||
export let invertY = false
|
||||
export let contentLines = 1
|
||||
|
||||
const emptyError = writable(null)
|
||||
|
||||
|
@ -84,5 +85,6 @@
|
|||
{readonly}
|
||||
{invertY}
|
||||
{invertX}
|
||||
{contentLines}
|
||||
/>
|
||||
</GridCell>
|
||||
|
|
|
@ -12,6 +12,7 @@
|
|||
export let api
|
||||
export let invertX = false
|
||||
export let invertY = false
|
||||
export let contentLines
|
||||
|
||||
let isOpen = false
|
||||
let focusedOptionIdx = null
|
||||
|
@ -86,7 +87,11 @@
|
|||
class:open
|
||||
on:click|self={editable ? open : null}
|
||||
>
|
||||
<div class="values" on:click={editable ? open : null}>
|
||||
<div
|
||||
class="values"
|
||||
class:wrap={contentLines > 1}
|
||||
on:click={editable ? open : null}
|
||||
>
|
||||
{#each values as val}
|
||||
{@const color = getOptionColor(val)}
|
||||
{#if color}
|
||||
|
@ -160,6 +165,9 @@
|
|||
grid-row-gap: var(--cell-padding);
|
||||
overflow: hidden;
|
||||
padding: var(--cell-padding);
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
.values.wrap {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.text {
|
||||
|
|
|
@ -15,6 +15,7 @@
|
|||
selectedCellMap,
|
||||
focusedRow,
|
||||
columnHorizontalInversionIndex,
|
||||
contentLines,
|
||||
} = getContext("grid")
|
||||
|
||||
$: rowSelected = !!$selectedRows[row._id]
|
||||
|
@ -44,6 +45,7 @@
|
|||
focused={$focusedCellId === cellId}
|
||||
selectedUser={$selectedCellMap[cellId]}
|
||||
width={column.width}
|
||||
contentLines={$contentLines}
|
||||
/>
|
||||
{/each}
|
||||
</div>
|
||||
|
|
|
@ -21,6 +21,7 @@
|
|||
focusedRow,
|
||||
scrollLeft,
|
||||
dispatch,
|
||||
contentLines,
|
||||
} = getContext("grid")
|
||||
|
||||
$: rowCount = $rows.length
|
||||
|
@ -85,6 +86,7 @@
|
|||
selectedUser={$selectedCellMap[cellId]}
|
||||
width={$stickyColumn.width}
|
||||
column={$stickyColumn}
|
||||
contentLines={$contentLines}
|
||||
/>
|
||||
{/if}
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue