text-fit-component
Fits text to match the width of its parent
Last updated 3 years ago by tehshrike .
WTFPL · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install text-fit-component 
SYNC missed versions from official npm registry.

text-fit-component

See the demo

Puts text inside of another element at just the right font size so that it perfectly fits the width of its container.

Uses get-text-fit-size.

Automatically adjust on window resize.

Doesn't work in IE or Edge yet.

Example

<body>
	<h1 id="header"></h1>
	<p>Aw yeah</p>
</body>

const TextFit = require('text-fit-component')

new TextFit({
	target: document.getElementById('header'),
	data: {
		text: 'This is a cool header'
	}
})

This module is also usable as a Svelte component.

<h1 id="header">
	<TextFit text="This is a cool header" />
</h1>
<p>Aw yeah</p>

<script>
	import TextFit from 'text-fit-component'

	export default {
		components: {
			TextFit
		}
	}
</script>

License

WTFPL

Current Tags

  • 1.0.4                                ...           latest (3 years ago)

5 Versions

  • 1.0.4                                ...           3 years ago
  • 1.0.3                                ...           3 years ago
  • 1.0.2                                ...           3 years ago
  • 1.0.1                                ...           3 years ago
  • 1.0.0                                ...           3 years ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 0
Dependencies (1)
Dependents (0)
None

Copyright 2014 - 2016 © taobao.org |