Created by: gurudeb
Description of PR
For smaller screen resolutions the counter values were overlapping producing a bad UX. This PR fixes that issue by reducing the font sizes of counters for smaller screen resolutions. There are 2 additional media queries present which reduces the font size in steps i.e. for width 480px and below the counter font size has been reduced from 24px to 21px and for width below 380px the font size has been reduced further to 18px. This fixes the counter overlapping issue. Future scope has also been considered such as when counter value changes to larger digits e.g. active cases reach a 6 digit count (currently active cases are in 5 digit count). There also this fix will work. All regression scenarios has been considered and tested to be working properly.
Relevant Issues
Fixes #1924 (closed)
Checklist
-
Compiles and passes lint tests -
Properly formatted -
Tested on desktop -
Tested on phone
Screenshots
Issue screenshot:
After fix screenshot:
