Issue #1822Opened February 21, 2019by arthuralmeidap1 reactions

[QUESTION] - Add style sector for specific Css rule

Question

Hey @artf ,

COuld you give your help on this one? I want to disable the user to able to select the wrapper block (body) but I still want to let them style it. So I was thinking to add a custom sector that would be displayed for all blocks but, the styles applied in that sector would be applied specifically into a css rule. Is there a way to achieve that? I spend some time digging the code but I didn't figure out a way to do it

Answers (3)

arthuralmeidapMarch 7, 20191 reactions

There are several drawbacks to my approach but, since on this app we are not using the Selectors for the Style Manager, look what I did;

I added a custom target property to my new sector. I started to listen the change:open for each sector and if the sector has my new custom prop I set the css rule that I want as target using editor.StyleManager.setTarget('.my-class', { targetIsClass: true }); otherwise I set the current selected block like editor.StyleManager.setTarget(editor.getSelected());

arthuralmeidapFebruary 21, 20190 reactions

Just an example:

The user has selected a Text Block. On the Style Manager panel, would display as it is today. The css selectors applied to it and the sections like General or Decorations to style it and besides that would have some Global section that apply the styling for a specific css rule

artfFebruary 22, 20190 reactions

Yeah I think it's possible, you should append a new sector with your inputs manually on editor load and on input change update the wrapper style editor.getWrapper().addStyle({ color: yourInputEl.value }) or if you need some specific CSS rule editor.CssComposer.setRule('.your-class', { color: '...' });

Related Questions and Answers

Continue research with similar issue discussions.

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.