https://github.com/bkwld/vue-unorphan

A Vue directive that implements the "unorphan" package to prevent line breaks between the last two words of an element.
https://github.com/bkwld/vue-unorphan

directive vue

Last synced: over 1 year ago
JSON representation

A Vue directive that implements the "unorphan" package to prevent line breaks between the last two words of an element.

• Host: GitHub
• URL: https://github.com/bkwld/vue-unorphan
• Owner: BKWLD
• License: mit
• Created: 2018-04-30T23:13:41.000Z (about 8 years ago)
• Default Branch: master
• Last Pushed: 2023-10-20T00:49:02.000Z (almost 3 years ago)
• Last Synced: 2025-03-28T15:15:04.540Z (over 1 year ago)
• Topics: directive, vue
• Language: JavaScript
• Homepage:
• Size: 115 KB
• Stars: 2
• Watchers: 2
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# vue-unorphan

A Vue directive that implements [unorphan](https://github.com/rstacruz/unorphan).

## Install

`yarn add vue-unorphan or npm install --save vue-unorphan`

#### Vue

```js

Vue = require('vue')

Vue.directive('unorphan', require('vue-unorphan'))

```

#### Nuxt

In `nuxt.config.js`:

```js

{

  modules: [ 'vue-unorphan/nuxt/module' ]

}

```

## Usage

Use in a Vue template like:

```html

A long title with many words that will wrap to multiple lines

```


## Example

Before:

![](http://yo.bkwld.com/2z0v35071m0F/Image%202018-04-30%20at%204.18.46%20PM.png)

After:

![](http://yo.bkwld.com/423M193i352i/Image%202018-04-30%20at%204.27.27%20PM.png)