downforacross / downforacross.com

Web frontend for downforacross.com -- continuation of stevenhao/crosswordsio
https://downforacrosscom.downforacross1.now.sh
MIT License
229 stars 90 forks source link

Fix blurry modals by overriding will-change property #165

Closed JohnHKoh closed 3 years ago

JohnHKoh commented 3 years ago

As of Chrome 53, the will-change CSS property will cause objects to not re-rasterize after a transform is applied. This causes the side effect of blurry images and texts. Read more about the issue here:

The SweetAlert library uses the will-change property to optimize their animations, but this causes an undesirable side-effect as the text, buttons, and edges of modals appear to be blurry. This change overrides the default CSS of SweetAlert to fix this. Take note of the subtle differences below (on Chrome 88.0.4324.190).

Before: image

After: image

vercel[bot] commented 3 years ago

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/downforacross/downforacross.com/DK682MEBysPFqpXkpEfMpgy62JNe
✅ Preview: https://downforacrossc-git-fork-johnhkoh-johnhkoh-fix-blurry-mod-b40286.vercel.app

stevenhao commented 3 years ago

nice digging. perhaps we should also open an issue in https://github.com/t4t5/sweetalert