From b7a0407e42b4433766bda53c4dd7866dfe7c1cb3 Mon Sep 17 00:00:00 2001
From: kunish <kunish.butt@gmail.com>
Date: Sun, 17 Sep 2023 03:20:52 +0800
Subject: [PATCH] feat(connection): update tag badges layout

---
 src/components/ConnectionsSettingsModal.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/ConnectionsSettingsModal.tsx b/src/components/ConnectionsSettingsModal.tsx
index 59b210a4..ab0e6864 100644
--- a/src/components/ConnectionsSettingsModal.tsx
+++ b/src/components/ConnectionsSettingsModal.tsx
@@ -207,12 +207,12 @@ export const ConnectionsSettingsModal = (props: {
           <div class="flex flex-col gap-4">
             <TagClientSourceIPWithNameForm />
 
-            <div class="flex flex-wrap gap-2">
+            <div class="grid grid-cols-2 gap-2">
               <For each={clientSourceIPTags()}>
                 {({ tagName, sourceIP }) => (
-                  <div class="badge badge-primary badge-lg items-center gap-2">
-                    <span>
-                      {tagName} - {sourceIP}
+                  <div class="badge badge-primary w-full items-center gap-2 py-4">
+                    <span class="truncate">
+                      {tagName}({sourceIP})
                     </span>
 
                     <Button