From 6e02cb553853c528559e9481586747ac6966bb64 Mon Sep 17 00:00:00 2001
From: Lias Kleisa <kleisa@puzzle.ch>
Date: Wed, 5 Jun 2024 15:49:57 +0200
Subject: [PATCH] Add hyphens to svg bubble on word break

---
 frontend/src/app/diagram/svgGeneration.ts | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/frontend/src/app/diagram/svgGeneration.ts b/frontend/src/app/diagram/svgGeneration.ts
index 8049c4db6a..e08baf0ed2 100644
--- a/frontend/src/app/diagram/svgGeneration.ts
+++ b/frontend/src/app/diagram/svgGeneration.ts
@@ -18,7 +18,7 @@ export function generateObjectiveSVG(title: string, teamName: string, iconFuncti
   <foreignObject x="30" y="25" width="100px" height="100px">
     <div xmlns="http://www.w3.org/1999/xhtml"
          style="width: 100%; height: 100%; display: flex; justify-content: center; align-items: center">
-      <p xmlns="http://www.w3.org/1999/xhtml">
+      <p xmlns="http://www.w3.org/1999/xhtml" lang="de">
         ${title}
       </p>
       <style>
@@ -33,6 +33,7 @@ export function generateObjectiveSVG(title: string, teamName: string, iconFuncti
           text-overflow: ellipsis;
           word-break: break-word;
           text-align: center;
+          hyphens: auto;
         }
       </style>
     </div>
@@ -68,7 +69,7 @@ export function generateKeyResultSVG(title: string, teamName: string, background
   <foreignObject x="18" y="12" width="80px" height="80px">
     <div xmlns="http://www.w3.org/1999/xhtml"
          style="width: 100%; height: 100%; display: flex; justify-content: center; align-items: center">
-      <p xmlns="http://www.w3.org/1999/xhtml">
+      <p xmlns="http://www.w3.org/1999/xhtml" lang="de">
         ${title}
       </p>
       <style>
@@ -83,6 +84,7 @@ export function generateKeyResultSVG(title: string, teamName: string, background
           text-overflow: ellipsis;
           word-break: break-word;
           text-align: center;
+          hyphens: auto;
         }
       </style>
     </div>
@@ -118,7 +120,7 @@ export function generateNeutralKeyResultSVG(title: string, teamName: string) {
   <foreignObject x="18" y="12" width="80px" height="80px">
     <div xmlns="http://www.w3.org/1999/xhtml"
          style="width: 100%; height: 100%; display: flex; justify-content: center; align-items: center">
-      <p xmlns="http://www.w3.org/1999/xhtml">
+      <p xmlns="http://www.w3.org/1999/xhtml" lang="de">
         ${title}
       </p>
       <style>
@@ -133,6 +135,7 @@ export function generateNeutralKeyResultSVG(title: string, teamName: string) {
           text-overflow: ellipsis;
           word-break: break-word;
           text-align: center;
+          hyphens: auto;
         }
       </style>
     </div>