bkwld / vue-unorphan

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

vue-unorphan

A Vue directive that implements unorphan.

Install

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

Vue

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

Nuxt

In nuxt.config.js:

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

Usage

Use in a Vue template like:

<h1 v-unorphan>A long title with many words that will wrap to multiple lines</h1>

Example

Before:

After:

vue-unorphan's Issues

Add an option to pass in a selector

Like in a v-html, to unorphan h2