fix(ui): added font preloading to fix ui jank when animating

peps commented 1 week ago

There's an issue with the fonts where they can "flash" for a split second when framer-motion animates a UI element. This was very obvious with the Toast component, but also happens when opening the history and navigating through the Settings section ( and all other framer-motion animations ).

I added preloading for all of the fonts to the index.html file to fix this issue.

I also removed the "Avenir" font since it wasn't being used anywhere.

BEFORE - notice the UI in the background jumping/flickering

https://www.loom.com/share/32506727a5a44c8da84bb329253d0397?sid=ca93879d-6500-4a2c-80fb-5e51aea9adab

FIXED - notice, it's rock solid now

https://www.loom.com/share/84005d97a2b34448a201acebaa2b4d89?sid=b6d6c97f-ad07-4959-9118-22a2b1a70f69

Tas4tari commented 6 days ago

Tested successfully on Windows 11, app version 0.7.0

Anziskavds commented 6 days ago

Tested successfully on MacBook Air 13 inch M1 2020 on Testnet v0.7.0.

tari-project / universe

fix(ui): added font preloading to fix ui jank when animating #1078