Blurry effect on edit and delete submenu icons on migrated pages

[colinegin]

In newly migrated pages, there is a "blurry" effect on submenu icons for edit and remove options. This might be related to a change in their size, which should not happen.
Ex :

[sarjon]

This happened to me before as well, make sure your browser zoom is at 100%, but I guess it should be fixed anyway.

[zuk3975]

I found out that this behavior is associated with bootstrap dropdown, so i doubt we can do anything.
The thing is that on toggle it puts style with transform:translate3d('x', 'y', 0) and this causes the blur. There are workarounds for this particular css attribute (for example putting transform:translateX('x') translateY('y')), but we cannot change the behavior of bootstrap anyway.

[colinegin]

Alright thanks for your feedback @zuk3975 , since there's nothing we can do yet, I remove it from the 1.7.6 kanban.
@matks , for a future version we'll see if there's something we can do to improve it.

[davidglezz]

It is easy to fix adding single line of code.

You can just turn off the transform placement on Popper to make it only use top/left for positioning instead. Then you can use transform for any animations/transitions as you wish.

Popper.Defaults.modifiers.computeStyle.gpuAcceleration = false;

twbs/bootstrap#23378 (comment)

[NeOMakinG]

Still unfixable without a bootstrap update of UIKit and BO Themes

[colinegin]

Alright so I guess this will be fixed with 178 once the UI kit has been updated ?

[NeOMakinG]

Well it seems like I can yes, gonna work on this

[LouiseBonnard]

On hold, waiting for the merge of the UI kit.

[davidglezz]

twbs/bootstrap#30811 (comment)

[NeOMakinG]

@davidglezz It will probably fixed on next uikit release, or on new major version :/

I say that because we noticed that it wasn't here with uikit on the develop branch, but overwhise it will probably be fixed later with the PR you linked, thanks :)

[NeOMakinG]

Looks fine now on develop, should be fixed :)