Vue component that scales its child node in relation to its parent node's width
Install the package from npm by running
$ npm i --save vue-responsive-text
or
$ yarn add vue-responsive-text
Import the component as you would any other and place responsive text as the component's child.
<template>
<VueResponsiveText>
this text will scale
</VueResponsiveText>
</template>
<script>
import VueResponsiveText from 'vue-responsive-text'
export default {
...
components: {
VueResponsiveText
}
};
</script>
Prop | Type | Required | Default | Description |
---|---|---|---|---|
transition | number | false | 0 | Transition duration in ms |
This component was inspired by @foisonocean's 'react-dynamic-font'.
This project is open to and encourages contributions! Feel free to discuss any bug fixes/features in the issues. If you wish to work on this project:
- Fork the project
- Create your feature branch (
git checkout -b new-feature-branch
) - Commit your changes (
git commit -am 'add new feature'
) - Push to the branch (
git push origin new-feature-branch
) - Submit a pull request!