Responsive styles order inconsistency inside editor

** Cwicly Plugin version: **


It looks like there’s some inconsistency with style inclusion order between breakpoints inside the editor.

For instance, if I set a default color for headings in a Cwicly stylesheet and a color for H1 in editor global styles, then the stylesheet color takes precedence over global style when changing breakpoint, although it is OK with desktop breakpoint.

After inspecting code, it seems that Cwicly global styles and stylesheets are not included in the same order between breakpoints.



First breakpoint:

Hi @yankiara,

Thank you for taking the time to report this!

I can confirm that there is a bug in the editor that is causing an inconsistency with style inclusion order between breakpoints.
Specifically, the bug is being caused by having “body” included as part of the targeting for H1.

Apologies for any inconvenience this may have caused you, please know that we are working on finding a fix for this issue as quickly as possible.

Hi @Araminta and thx for your answer!

Mmmmmh, here is what I see, and there is no ‘body’ anywhere, selectors are the same.

For me it is just the ordering of CSS inclusion: On desktop, global styles are included AFTER stylesheets, so they take precedence, and it is the contrary on tablet.




Hello @yankiara,

Thanks for this report.

Indeed, there is an inconsistency between backend breakpoints, but also frontend styles priority as you pointed out here: CSS stylesheets order (much appreciated).

We will be addressing this in the next update. As to the priority of global stylesheets vs global styles, the workflow you point out is definitely valid which should also be taken into consideration.



As mentioned previously, should fix the issue of differently ordered stylesheets on backend vs frontend.

As to the specific order stylesheets are loaded, allowing the user to modify seems to be the way to go.

Thanks for bringing this up, @yankiara.

1 Like