box shadow and breakpoints issues, and display on rtl sites

also, you use jquery, when wordpress moves away from it. it just add bloated code. hopefully on next versions, this dependency will be dropped.

Hi @derrida

Thank you for the feedback.

1. Should be fixed with the latest update released today. ??
2. This is I suppose a standard behavior of how the CSS works. You have to set important on mobile as well. Or, point me to some better way to handle it.
3. I haven’t yet tested it with RTL, thank you for raising this. I will look into this.

jQuery:
It is being used only where necessary ( like tabs, accordion blocks ). If WordPress will drop it, I will surely do a workaround with pure JS solution. But I suppose its a better option for now.

Keep your suggestions coming.

hi
the box-shadow is indeed working after update.
in fact it is not recommanded to use the important unless it is neccesary. if you go with mobile first approach then you don’t need it. and if you do use it, then use it on ll breakpoints, otherwise the breakpoint with the important is the one that will be displayed.
so if i add margin to an element on the desktop, and this get the important, then on mobile that element will not be displayed correctly.
regarding jquery: hopefully you will remove it as dependency since you don’t need a library for some DOM manipulations.

also, it will be great if you can add position, so we can position absolute an element.

anyway, keep up with the good work.

• This reply was modified 4 years, 3 months ago by derrida.

Hi,

So what exactly do you suggest? I had optimize the way to have minimum need for using ‘important’.

The thing is that block/element gets bullied by multiple people, in simple. ??

That means the theme is applying the styling on the block as well as other plugins (maybe) and so is this plugin. So depending on what theme and plugins combination you are using and whose CSS gets precedence, you would need to use the ‘important’ on some occasions.

Now if you use it you will ultimately have to use it in different breakpoints as well. Is there any other solution to handle it? Let me know and I will work on that.

Thanks,
Munir

• This reply was modified 4 years, 3 months ago by Munir Kamal.

regarding colisions with other plugins, no worries there, cause i see you have a unique prefix to each class.
regarding the important, i would go with mobile first approach. that means, that the default styling is for mobile (but not in its own breakpoint), and then all others breakpoints just use the rule of the break point.
so for example: without breakpoint (which will be the mobile) i will put margin or padding 0, or nothing. and in tablent or desktop the margin or padding the user chose, without any important.
or if you do use the important, for colisions with other plugins, i would use it on every breakpoint.
as i said, i tried putting marging on desktop, and it get the important. then i put margin 0 on mobile. but the mobile one doesn’t get the important flag, so even on mobile, it display the desktop style, which obviously doesn’t work.

just my suggestion

Hi @derrida

Noted your suggestion. I will have to do my research on this, but I think the general mindset is toward desktop first as so is Gutenberg itself.

I will consider it if more users will suggest the same.

Regards,
Munir