retejs / context-menu-plugin

https://retejs.org
MIT License
11 stars 43 forks source link

Rete V2 : Customize context menu component (Vue.js) #73

Closed JosueGauthier closed 1 year ago

JosueGauthier commented 1 year ago

Hello, I would like to customize the shape, style, ... of my context menu component, but i found nothing except this issue : https://github.com/retejs/context-menu-plugin/issues/9 but it is a V1 example.

Is there a V2 functionality for render.addPreset(Presets.contextMenu.setup(cus)); like that ?

  render.addPreset(
    Presets.classic.setup({
      customize: {
   ....
      },
    })
  );

Thanks,

Ni55aN commented 1 year ago

https://retejs.org/docs/guides/renderers/vue#customize-context-menu

JosueGauthier commented 1 year ago

Thank you again, it works perfectly :)

For those who wants class selectors names, below a scss example :

@import "./vars";

[rete-context-menu] {
  width: 320px !important;
  border: none;

  .block {
    background: $selected-color;
    border: none;
  }

  .block.item {
    border: none;
    font-weight: 600;
    font-family: "PathWay", sans-serif;
  }

  .block.item:hover {
    background: white;
    color: $selected-color;
  }

  .block:first-child input {
    background: $background-color;
    border: none;
  }
  .block:first-child input:focus {
    background: white;
    border: none;
  }
  .block:first-child:hover {
    background: $selected-color;
    border: none;
  }
  .search {
    color: $selected-color;
    font-weight: 600;
    font-family: "PathWay", sans-serif;
  }
}