Light-client: Pop-up modal its background not blurry in Firefox

[weilbith]

Steps to Reproduce

1. Open dApp in Firefox web-browser
2. Do an action like mint SVT/tokens, a transfer, .. to get a pop-up modal

Expected Result

• blurry background as for example in Chromium

Actual Result

• clear background with all details

Additional Infos (Optional)

- Browser & version: Mozilla Firefox 77.0.1

[kelsos]

At least up to a point the blur filter was not supported by default in Firefox, and it was only behind a flag that you had to explicitly enable. https://www.reddit.com/r/FirefoxCSS/comments/d7bfmt/is_this_blur_possible_in_firefox/

[weilbith]

[weilbith]

Okay so not solvable for now?

[kelsos]

On 78b9 Firefox developer edition the flag is still disabled by default

I would guess yes, unsolvable until Firefox enables the flag for blur by default.

[weilbith]

Okay. So how do you proceed with such issues that become relevant later again?

[christianbrb]

There are places in the dApp where it is blurry in Firefox

[christianbrb]

For example on the token withdrawal screen

[kelsos]

@christianbrb it didn't look blurry to me.

I am not sure if achieving the same effect as the backdrop-filter is possible or easy. There are other blur filters but they apply on the element itself, not on the parent elements. I would say it does not make sense for me to try to work around a browser limitation at this point.

[christianbrb]

Deposit is also blurry in Firefox

I have withdrawn all my tokens :P

[kelsos]

Ok this is probably using the overlay instead of the backdrop and applies the blur filter on the overlay.

[weilbith]

So this are different components? :thinking:

[kelsos]

The dialogs should be based on the same component, but they might have some different flag/property. At some point we tried to apply the blur only to the card itself but that didn't really work due to the layout.

[christianbrb]

My tests have been executed with layout.css.backdrop-filter.enabled = true