feat(connection): update tag badges layout

MetaCubeX · Sep 16, 2023 · b7a0407 · b7a0407
1 parent 0015468
commit b7a0407
Showing 1 changed file with 4 additions and 4 deletions.
diff --git 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