make the charts responsive

hatemhosny / racing-bars

Bar chart race made easy 🎉

https://racing-bars.hatemhosny.dev/

MIT License

75 stars 4 forks source link

Closed hatemhosny closed 2 months ago

hatemhosny commented 2 months ago

What kind of change does this PR introduce?

feature

What is the current behavior?

Currently, on small screens the chart overflows outside overlay, text overlaps & icons overflow outside bars

What is the new behavior (if this is a feature change)?

now the text size and control & overlay buttons are responsive. The chart overflow outside overlays & icons overflow outside bars are fixed.

netlify[bot] commented 2 months ago

Name	Link
Latest commit	572a516723c397b4d1f25ac501fa36289b41c183
Latest deploy log	https://app.netlify.com/sites/racingbars/deploys/66d8bec3f2b60500082967e6
Deploy Preview	https://deploy-preview-194--racingbars.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

github-actions[bot] commented 2 months ago

Latest commit: 572a516723c397b4d1f25ac501fa36289b41c183
Last updated: Sep 4, 2024 8:10pm (UTC)

Playground	Link
JavaScript (ESM)	https://livecodes.io?x=code/N4IgLglmA2CmIC4QCkCGA3...
JavaScript (UMD)	https://livecodes.io?x=code/N4IgLglmA2CmIC4QCkCGA3...
React	https://livecodes.io?x=code/N4IgLglmA2CmIC4QCVYEMD...
Svelte	https://livecodes.io?x=code/N4IgLglmA2CmIC4QGUButp...
TypeScript	https://livecodes.io?x=code/N4IgLglmA2CmIC4QBUCeAH...
Vue	https://livecodes.io?x=code/N4IgLglmA2CmIC4QDUCu8A...

See documentations for usage instructions.

cloudflare-workers-and-pages[bot] commented 2 months ago

Latest commit:	`572a516`
Status:	✅ Deploy successful!
Preview URL:	https://a09b688f.racing-bars.pages.dev
Branch Preview URL:	https://responsive.racing-bars.pages.dev