Custom context pad element icon

Developers Modeler
1

Hi,
i want to create custom context pad element with a custom icon

i implemented ContextPadProvider and was able to create a new element, but the problem i’m not able to add my svg icon to the element, its shows empty element

  getContextPadEntries(element: Base): ContextPadItems{
        return {
            'newNode': {
                group: 'model',
                className: 'add-task-icon',
                title: 'Add a new node',
              
            }
        };
    }

//css

.add-task-icon{
  background: url('/assets/plus-icon.svg') !important;

}

i have looked at the bpmn example page, but i couldn’t find a solution for my problem

any idea how to do it ?

Thanks

2

Are you sure the SVG can be located? Have you checked the console?

3

yes it is
i use it in another component

4

It might be a problem with tree structure of your project.

Please share a running / prototypical example that clearly shows what you’re trying to achieve, what is working and what is not.

Use our existing starter projects to quickly hack it or share your existing, partial solution on GitHub. Provide the necessary pointers that allow us to quickly understand where you got stuck.

This way we may be able to help you in a constructive manner.

Thanks :heart:

5

i found the issue

the problem was my svg, it was too big for the context pad menu
so basically it was working, and it worked after i changed the size of the svg

thanks for the help :slight_smile:

image