{"repo":"shuding/react-wrap-balancer","free":true,"listed":false,"github":"https://github.com/shuding/react-wrap-balancer","clone":"git clone https://github.com/shuding/react-wrap-balancer.git","description":"Simple React Component That Makes Titles More Readable","language":"HTML","stars":4206,"topics":["react","typography","wrapping"],"license":"MIT","category":"ui-components","readme_excerpt":"Introduction React Wrap Balancer is a simple React Component that makes your titles more readable in different viewport sizes. It improves the wrapping to avoid situations like single word in the last line, makes the content more “balanced”: Usage To start using the library, install it to your project: And wrap text content with it: is the main component of the library. It will automatically balance the text content inside it. It accepts the following props: - as ( optional ): The HTML tag to be used to wrap the text content. Default to span . - ratio ( optional ): The ratio of “balance-ness”, 0 If you have multiple components used, it’s recommended (but optional) to also use to wrap the entire app. This will make them share the re-balance logic and reduce the HTML size: For full documentation and use cases, please visit react-wrap-balancer.vercel.app . Browser Support Information Desktop: Browser Min Version :-------: :-----------: Chrome 64 Edge 79 Safari 13.1 FireFox 69 Opera 51 IE No Support Mobile: Browser Min Version :---------------: :-----------: Chrome 64 Safari 13.4 Firefox 69 Opera 47 WebView Android 64 Cross-browser compatibility issues are mainly due to the fact that lib uses the ResizeObserver API. More information about this API can be found at this link. If you are using a browser which version is lower than the versions in the table, please consider adding polyfill for this API or upgrade your browser. About This project was inspired by Adobe’s balance-text p","default_branch":null,"files":null,"tree":[],"storefront":"/r/shuding","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/shuding/react-wrap-balancer/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}