style: 💄 Add text wrap balance in title card and center text for aling text when apply balance

src/components/svgCard.svelte

@@ -52,7 +52,7 @@
       alt={svgInfo.title}
     />
     <div class="mb-3 flex flex-col items-center justify-center">
-      <p class="truncate text-[15px] font-medium">{svgInfo.title}</p>
+      <p class="truncate text-[15px] font-medium text-balance text-center">{svgInfo.title}</p>
       <a
         href={`/directory/${svgInfo.category.toLowerCase()}`}
         class="text-sm lowercase text-neutral-500 hover:underline">{svgInfo.category}</a

tailwind.config.cjs

@@ -16,5 +16,13 @@ module.exports = {
       }
     }
   },
-  plugins: []
+  plugins: [
+    ({ addUtilities }) => {
+      addUtilities({
+        '.text-balance': {
+          'text-wrap': 'balance'
+        }
+      });
+    }
+  ]
 };