From 856829b6056e2fbbbeec45d29d42a4b3379fa96b Mon Sep 17 00:00:00 2001
From: Dennis Postma <dennis@directonline.io>
Date: Sat, 19 Oct 2024 17:00:58 +0200
Subject: [PATCH] Possible fix for text alignment on Windows

---
 src/components/sprites/Character.vue | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/components/sprites/Character.vue b/src/components/sprites/Character.vue
index a5d4157..2ebbb45 100644
--- a/src/components/sprites/Character.vue
+++ b/src/components/sprites/Character.vue
@@ -1,12 +1,12 @@
 <template>
   <!--  Chat bubble -->
   <Container ref="charChatContainer" :depth="999" :x="currentX" :y="currentY">
-    <RoundRectangle @create="createChatBubble" :origin-x="0.5" :origin-y="7.5" :fillColor="0xffffff" :width="194" :height="21" :radius="20" />
-    <Text @create="createChatText" text="" :origin-x="0.5" :origin-y="10.9" :style="{ fontSize: 13, fontFamily: 'Arial', color: '#000' }" />
+    <RoundRectangle @create="createChatBubble" :origin-x="0.5" :origin-y="7.5" :fillColor="0xffffff" :width="194" :hHAeight="21" :radius="20" />
+    <Text @create="createChatText" :style="{ fontSize: 13, fontFamily: 'Arial', color: '#000' }" />
   </Container>
   <!--  Character name and health -->
   <Container :depth="999" :x="currentX" :y="currentY">
-    <Text @create="createText" :text="character.name" :origin-x="0.5" :origin-y="9" />
+    <Text @create="createText" :text="character.name" />
     <RoundRectangle :origin-x="0.5" :origin-y="18.5" :fillColor="0xffffff" :width="74" :height="6" :radius="5" />
     <RoundRectangle :origin-x="0.5" :origin-y="36.4" :fillColor="0x00b3b3" :width="70" :height="3" :radius="5" />
   </Container>
@@ -139,6 +139,7 @@ const createChatText = (text: Phaser.GameObjects.Text) => {
   text.setName(`${props.character.name}_chatText`)
   text.setFontSize(13)
   text.setFontFamily('Arial')
+  text.setOrigin(0.5, 10.9)
 
   // Fix text alignment on Windows and Android
   if (game.device.os.windows || game.device.os.android) {
@@ -149,6 +150,7 @@ const createChatText = (text: Phaser.GameObjects.Text) => {
 const createText = (text: Phaser.GameObjects.Text) => {
   text.setFontSize(13)
   text.setFontFamily('Arial')
+  text.setOrigin(0.5, 9)
 
   // Fix text alignment on Windows and Android
   if (game.device.os.windows || game.device.os.android) {