svelte-tree
svelte-tree copied to clipboard
Add props.class attributes
This allows the svg paths that draw the arrows to be styled. Here's an example of responding to global CSS (dark-mode) class changes
<div class="parent">
<Tree class="treeClass" tree={structureTree} let:node>
{#if node.children}
<div class="tree-node">{node.name}</div>
{:else}
<div class="label-node"><AbilityBug ability={getAbilityBySkill(node.id)}></AbilityBug></div>
{/if}
</Tree>
</div>
<style>
.tree-node {
line-height: 1.8;
}
:global(body.dark-mode) .parent :global(.treeClass) {
fill: #bfc2c7;
}
</style>