feat: switch from break-all to break-words

src/components/Positions.tsx

@@ -122,7 +122,7 @@ const Positions: Component<{
                     </th>
                     <td
                       classList={{
-                        "align-top break-all whitespace-normal": true,
+                        "align-top break-words whitespace-normal": true,
                         "border-b-0 pb-0": hasTwoRows(),
                       }}
                     >

src/components/Settings/Overlay.tsx

@@ -941,7 +941,7 @@ const SettingsOverlay: Component = () => {
                         {(error, idx) => (
                           <tr>
                             <th>{idx() + 1}</th>
-                            <td class="break-all">{error.path}</td>
+                            <td class="break-words">{error.path}</td>
                             <td>{error.message}</td>
                           </tr>
                         )}

src/components/SwissInvoice.tsx

@@ -140,7 +140,7 @@ const SwissInvoice: Component<
 
   return (
     <div class="break-inside-avoid pt-px">
-      <div class="swissinvoice hyphenate break-normal break-all -max-w-[1200px] aspect-[2/1] print:w-full flex-shrink-0 text-left print:text-black text-sm bg-white border-y border-black border-dashed grid grid-flow-col grid-cols-[29.5%_26.5%_auto] grid-rows-[auto_auto_1fr]">
+      <div class="swissinvoice hyphenate whitespace-normal break-words -max-w-[1200px] aspect-[2/1] print:w-full flex-shrink-0 text-left print:text-black text-sm bg-white border-y border-black border-dashed grid grid-flow-col grid-cols-[29.5%_26.5%_auto] grid-rows-[auto_auto_1fr]">
         <div class="col-span-1 row-span-1 p-10 pb-0 border-r border-black border-dashed">
           <HeaderEz>Empfangsschein</HeaderEz>
           <div class="leading-tight flex flex-col gap-4">
@@ -193,7 +193,7 @@ const SwissInvoice: Component<
 
         <div class="col-span-2 pl-10"></div>
 
-        <div class="leading-tight text-base col-span-1 row-span-2 p-10 flex flex-col gap-4">
+        <div class="overflow-hidden leading-tight text-base col-span-1 row-span-2 p-10 flex flex-col gap-4">
           <div>
             <HeaderZ>Konto / Zahlbar an</HeaderZ>
             <div>{spaceEveryX(props.value.iban)}</div>

src/routes/index.tsx

@@ -137,7 +137,7 @@ export default function Home() {
     );
 
     return (
-      <div class="break-all whitespace-normal">
+      <div class="break-words whitespace-normal">
         <Title>{titleMemo()}</Title>
         <Show when={localState.logo}>
           <div class="flex justify-end items-center h-20 mb-5">