Components corrupt grid items order inside the editor

Cwicly Plugin version: 1.4.1

Hi,

When using components in a grid, the order of items is corrupted by the presence of <style> and <svg> tags which alter the grid :nth-child() rules.
Order even changes according to the selected item in navigator :wink:

It doesn’t happen with non component blocks.

COMPONENTS:

OTHER BLOCKS:

Hello @yankiara,

Thank you for this report.

The Gutenberg block preview function adds those elements by default, and gives no way to remove them via a property unfortunately.
We might have a solution in the next update.

Cheers,

2 Likes

Hello @yankiara,

This should be addressed in 1.4.1.1.

I’d be grateful if you could let me know if you still experience the issue on your end.

Cheers,

Hi @Louis,

Thanks for the quick fix, but I’m afraid there’s still a problem.

Now order is OK when no component is selected inside the grid, but as soon as I select one, order seems to shift again.

It seems that order is altered only after the selected component, and when inspecting, it looks like if the selected component was duplicated, messing with nth-child().

Right order:

Wrong when component selected:

Hi @Louis,

I bump this because I’m afraid the recent events could bury it forever :wink:

Hello @yankiara,

There are a few things at play here that allow us to customise and modify components in one place, without having to switch the editor view (notice how the Gutenberg team have modified their pattern modification behaviour in WordPress 6.5).

With the ease of use in Cwicly components also comes the limitation when targeting elements by their index, affecting their index position when selected.

Currently, this is a side-effect that we cannot correct.

Cheers,

OK, thanks for the update.