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: