search

GrapesJS / grapesjs

Free and Open source Web Builder Framework. Next generation tool for building templates without coding
https://grapesjs.com
BSD 3-Clause "New" or "Revised" License
22.36k stars 4.05k forks source link

Customize Blocks Styles - grapesjs Angular #3560

Closed hadeel94 closed 1 year ago

hadeel94 commented 3 years ago

I am new to grapes js , I am trying to make the blocks in a different style when dragging for example the image blocks 1 - when not dragged or hover takes style A . 2- when hover takes style B . 3- When dragged takes style C (when it is over the canvas).

can any one help me with this issue .

Thanks DASHBORAD – 12 DASHBORAD – 11 DASHBORAD – 9

ronaldohoch commented 3 years ago

Maybe with this events you can do it: https://grapesjs.com/docs/api/editor.html#blocks or https://grapesjs.com/docs/api/editor.html#canvas

artf commented 3 years ago

In such a case, probably a completely custom block manager UI is the only way (eg. rendered by your own BlockManager component in Angular). It should be possible already, but I'd prefer to take my time and update the Blocks documentation with all the steps and examples necessary to build the BlockManager UI from scratch.

hadeel94 commented 3 years ago

In such a case, probably a completely custom block manager UI is the only way (eg. rendered by your own BlockManager component in Angular). It should be possible already, but I'd prefer to take my time and update the Blocks documentation with all the steps and examples necessary to build the BlockManager UI from scratch.

Thanks for your response, I have other questions:

1- I am trying to add div with some style inside the canvas but it will not be editable or dragged just read-only, it is possible?

2- can I change the position of RTE as panel action on a fixed position.

Thank you very much, I would be glad if you answered my questions

artf commented 1 year ago

Closing this one as Blocks documentation was updated with a proper example for a custom Block Manager UI