Global Styles not applied in Editor

[Jonas]

Description:

In global styles I defined my headings in the “Custom” section so that I can use Heading Classes like .h3 in my design.

But when I now apply the class .h3 to a <h2> heading the .h3 styling does not get applied. The heading still looks like a <h2>.
In the frontend it works. There my <h2> heading now looks like a H3 heading.

Environment info

• WordPress version: latest
• Cwicly Plugin version: latest

[StrangeTech]

Hi @Jonas,

I believe you are right about this one and I was easily able to replicate it.

Hello @Louis,

I did some quick checking and it appears that this is a specificity issue caused by the way Cwicly is parsing the custom rules and adding them to the .editor-styles-wrapper

Effectively, it is only prefixing .editor-styles-wrapper for the first selector in the rule, any further comma delimited selectors are not being prefixed which is causing them to be lower specificity.

Hopefully the fix is as simple as splitting by comma first prefixing each selector and then joining again by comma (while avoiding any issues with commas in attribute strings, etc).