From c641baec78a347cccce107953338c4f6e1f5ed7c Mon Sep 17 00:00:00 2001
From: LenaertsJ <julie.lenaerts@champs-libres.coop>
Date: Mon, 3 Feb 2025 21:02:44 +0000
Subject: [PATCH] Resolve "UX bug caused by 'Prettier' linter"

---
 .changes/unreleased/Fixed-20250203-123428.yaml       |  6 ++++++
 .../public/vuejs/_components/Entity/PersonText.vue   | 12 ++++++++----
 2 files changed, 14 insertions(+), 4 deletions(-)
 create mode 100644 .changes/unreleased/Fixed-20250203-123428.yaml

diff --git a/.changes/unreleased/Fixed-20250203-123428.yaml b/.changes/unreleased/Fixed-20250203-123428.yaml
new file mode 100644
index 000000000..6a7b1d161
--- /dev/null
+++ b/.changes/unreleased/Fixed-20250203-123428.yaml
@@ -0,0 +1,6 @@
+kind: Fixed
+body: Add definitive whitespace between span elements in vue PersonText component
+time: 2025-02-03T12:34:28.925596132+01:00
+custom:
+    Issue: "351"
+    SchemaChange: No schema change
diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Entity/PersonText.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Entity/PersonText.vue
index a811fcba2..f3005f235 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Entity/PersonText.vue
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Entity/PersonText.vue
@@ -2,21 +2,25 @@
   <span v-if="isCut">{{ cutText }}</span>
   <span v-else class="person-text">
     <span class="firstname">{{ person.firstName }}</span>
-    <span class="lastname">{{ person.lastName }}</span>
+    <!-- display: inline -->
+    <span class="lastname">&nbsp;{{ person.lastName }}</span>
     <span v-if="person.altNames && person.altNames.length > 0" class="altnames">
-      <span :class="'altname altname-' + altNameKey">
-        ({{ altNameLabel }})</span
+      <!-- display: inline -->
+      <span :class="'altname altname-' + altNameKey"
+        >&nbsp;({{ altNameLabel }})</span
       >
     </span>
+    <!-- display: inline -->
     <span v-if="person.suffixText" class="suffixtext"
       >&nbsp;{{ person.suffixText }}</span
     >
+    <!-- display: inline -->
     <span
       class="age"
       v-if="
         this.addAge && person.birthdate !== null && person.deathdate === null
       "
-      >{{ $tc("renderbox.years_old", person.age) }}</span
+      >&nbsp;{{ $tc("renderbox.years_old", person.age) }}</span
     >
     <span v-else-if="this.addAge && person.deathdate !== null">&nbsp;(‡)</span>
   </span>