1
0
Fork 0
mirror of synced 2024-08-15 01:51:33 +12:00

component ndentation

This commit is contained in:
Gerard Burns 2023-08-21 07:37:16 +01:00
parent a34390c986
commit e6a712f880
2 changed files with 13 additions and 3 deletions

View file

@ -21,6 +21,7 @@
export let id export let id
export let showTooltip = false export let showTooltip = false
export let selectedBy = null export let selectedBy = null
export let compact = false
const scrollApi = getContext("scroll") const scrollApi = getContext("scroll")
const dispatch = createEventDispatcher() const dispatch = createEventDispatcher()
@ -80,8 +81,9 @@
{#if withArrow} {#if withArrow}
<div <div
class:opened class:opened
class:relative={indentLevel === 0} class:relative={indentLevel === 0 && !compact}
class:absolute={indentLevel > 0} class:absolute={indentLevel > 0 && !compact}
class:compact
class="icon arrow" class="icon arrow"
on:click={onIconClick} on:click={onIconClick}
> >
@ -194,6 +196,13 @@
padding: 8px; padding: 8px;
margin-left: -8px; margin-left: -8px;
} }
.compact {
position: absolute;
left: 4px;
padding: 8px;
margin-left: -8px;
}
.icon.arrow :global(svg) { .icon.arrow :global(svg) {
width: 12px; width: 12px;
height: 12px; height: 12px;

View file

@ -107,6 +107,7 @@
id={`component-${component._id}`} id={`component-${component._id}`}
> >
<NavItem <NavItem
compact
scrollable scrollable
draggable draggable
on:dragend={dndStore.actions.reset} on:dragend={dndStore.actions.reset}
@ -117,7 +118,7 @@
text={getComponentText(component)} text={getComponentText(component)}
icon={getComponentIcon(component)} icon={getComponentIcon(component)}
withArrow={componentHasChildren(component)} withArrow={componentHasChildren(component)}
indentLevel={level + 1} indentLevel={level}
selected={$store.selectedComponentId === component._id} selected={$store.selectedComponentId === component._id}
{opened} {opened}
highlighted={isChildOfSelectedComponent(component)} highlighted={isChildOfSelectedComponent(component)}