From a5ce60175204fbe404ca7c7ec9a8869a7e630a5f Mon Sep 17 00:00:00 2001
From: Andrea Vos <andrea@avris.it>
Date: Fri, 9 Feb 2024 17:56:30 +0100
Subject: [PATCH] (blog)(design) use text-wrap: balance;

---
 components/BlogEntriesList.vue | 5 ++++-
 routes/blogEntry.vue           | 1 +
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/components/BlogEntriesList.vue b/components/BlogEntriesList.vue
index 623a0c3ec..b8d7e68a7 100644
--- a/components/BlogEntriesList.vue
+++ b/components/BlogEntriesList.vue
@@ -5,7 +5,7 @@
                 <nuxt-link v-if="post.hero" :to="generateLink(post.slug)" class="">
                     <img :src="post.hero" class="w-100" loading="lazy">
                 </nuxt-link>
-                <nuxt-link :to="generateLink(post.slug)" class="card-body text-center h4 p-3 mb-0">
+                <nuxt-link :to="generateLink(post.slug)" class="card-body text-center h4 p-3 mb-0 post-title">
                     <Spelling :text="post.title" />
                 </nuxt-link>
                 <div v-if="details" class="card-footer small">
@@ -91,4 +91,7 @@ export default {
     .columnist-wall > .columnist-column {
         transition: margin-top .2s ease-in-out;
     }
+    .post-title {
+        text-wrap: balance;
+    }
 </style>
diff --git a/routes/blogEntry.vue b/routes/blogEntry.vue
index 3145c6152..06dbaa751 100644
--- a/routes/blogEntry.vue
+++ b/routes/blogEntry.vue
@@ -75,6 +75,7 @@ export default {
 
         h1 {
             text-align: left;
+            text-wrap: balance;
         }
 
         img {