Is it possible to add classname for 3 sections for toolbar?

[devto11pm]

I think we should add more class for 3 section in toolbar for easy customize style.

In Toolbar.svelte

<nav class="{$theme.toolbar}">
    {#each Object.keys(sections) as key}
        <div class="ec-toolbar-{key}">
            {#each sections[key] as buttons}
                {#if buttons.length > 1}
                    <div class="{$theme.buttonGroup}">
                        <Buttons {buttons}/>
                    </div>
                {:else}
                    <Buttons {buttons}/>
                {/if}
            {/each}
        </div>
    {/each}
</nav>

In index.scss

/* Toolbar */
.ec-toolbar {
  flex: 0 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1em;

  .ec-toolbar-start {
    //add something or do not set
  }

  .ec-toolbar-center {
    //add something or do not set
  }

  .ec-toolbar-end {
    //add something or do not set
  }

  > * {
    margin-bottom: -.5em;

    > * {
      margin-bottom: .5em;

      &:not(:last-child) {
        margin-right: .75em;
      }
    }
  }
}

[vkurko]

Good idea! Thank you. I'll implement it in the next release.

[vkurko]

The CSS classes ec-start/ec-center/ec-end should be applied to the toolbar sections in v3.1.0. Please check.

[devto11pm]

The CSS classes ec-start/ec-center/ec-end should be applied to the toolbar sections in v3.1.0. Please check.

yes. thank you