Some of the modals seem to be blurred in Chrome extension.

[peronczyk]

https://aeternity-blockchain.atlassian.net/browse/SW-511

Description

Some of the wallet modals seem to be blurred as if they are scaled. It is not only bad from design point of view but also makes the text less readable especially in the info modals. At first I thought it might be related to blurred background effect behind the modals but then I noticed that this bug is not observable in the “Send funds” modal.

Bug Description

Describe the bug Some of the wallet modals seem to be blurred as if they are scaled. (See attached screenshots) At first I thought it might be related to blurred background effect behind the modals but then I noticed that this bug is not observable in the “Send funds” modal.

Expected result Modal contents should not be blurred but sharp and clearly readable.

Steps to reproduce

1. Navigate to any info modal.
2. Observe how it looks blurred.

Environment

Windows, Chrome extension (not present in Firefox, not sure about other browsers and devices)

[peronczyk]

The issue was caused by the will-change: transform; CSS rule applied to modal windows. I removed this rule.

The modal before removing it looked like this:

After removing it:

Ready to be tested @Liubov-crypto @onvisions

[onvisions]

Thanks @peronczyk it seems this months old issue has been fixed with 1 line of CSS.

[Liubov-crypto]

The blurred modals have been fixed. found 1 tiny issue:

https://github.com/superhero-com/superhero-wallet/assets/69896204/3ef0ddb7-cf91-4c1e-a68c-70674a439ef3

[Liubov-crypto]

Fixed, LGTM