Prevent breaking last char in title like ? ! : ;

components/blog/BlogNextPrev.vue

@@ -12,7 +12,7 @@
       :to="next.path"
       class="group next-blog flex-1 py-8 text-right"
     >
-      <span class="group-hover:text-hover">
+      <span v-prevent-last-char-break class="group-hover:text-hover">
         {{ next.title }}
       </span>
       <fa icon="chevron-right" class="text-gray-300 ml-3 transition" />

components/page/PageHeader.vue

 <template>
   <div class="flex items-center justify-between">
     <h1
+      v-prevent-last-char-break
       class="text-3xl md:text-4xl 2xl:text-5xl bg-clip-text text-transparent bg-gradient-to-r from-purple-800 to-blue-600 font-extrabold leading-tight py-8"
     >
       {{ document.title }}

components/page/PageRelated.vue

@@ -10,7 +10,11 @@
         :key="index"
         class="block leading-5 mb-2 text-gray-500"
       >
-        <nuxt-link :to="item.path" class="hover:underline">
+        <nuxt-link
+          v-prevent-last-char-break
+          :to="item.path"
+          class="hover:underline"
+        >
           {{ item.title }}
         </nuxt-link>
       </li>

components/page/PageToc.vue

@@ -14,6 +14,7 @@
         }"
       >
         <nuxt-link
+          v-prevent-last-char-break
           :to="`#${link.id}`"
           class="inline-block transform duration-100 hover:translate-x-1"
         >

pages/lexique/_slug.vue

@@ -17,6 +17,7 @@
         <nuxt-link
           v-for="(item, index) of pagesWithTerm"
           :key="index"
+          v-prevent-last-char-break
           :to="item.path"
           class="block hover:text-hover mt-2"
         >

plugins/directives.client.js

@@ -7,3 +7,12 @@ Vue.directive('focus', {
     if (!('value' in binding) || binding.value) el.children[0].focus()
   },
 })
+
+// v-prevent-last-char-break
+Vue.directive('prevent-last-char-break', {
+  inserted(el, binding) {
+    const txt = el.innerHTML.trim()
+    if (/.*\W[?!:;]$/.test(txt))
+      el.innerHTML = txt.substr(0, txt.length - 2) + ' ' + txt.substr(-1)
+  },
+})