Swap Badge to inline-flex instead of inline-block wrapper div (viamro…

…botics#582)
ethanlookpotts · Sep 20, 2024 · 486bfac · 486bfac
1 parent 38816ad
commit 486bfac
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 25 deletions.
diff --git a/packages/core/package.json b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@viamrobotics/prime-core",
-  "version": "0.0.152",
+  "version": "0.0.153",
   "repository": {
     "type": "git",
     "url": "https://github.com/viamrobotics/prime.git",

diff --git a/packages/core/src/lib/badge.svelte b/packages/core/src/lib/badge.svelte
@@ -33,27 +33,25 @@ let extraClasses: cx.Argument = '';
 export { extraClasses as cx };
 </script>
 
-<div class="inline-block">
-  <small
-    class={cx(
-      'flex items-center gap-1 rounded-full border px-2.5 py-0.5 text-xs',
-      {
-        'border-success-medium bg-success-light text-success-dark':
-          variant === 'success',
-        'border-warning-medium bg-warning-light text-warning-dark':
-          variant === 'warning',
-        'border-danger-medium bg-danger-light text-danger-dark':
-          variant === 'danger',
-        'border-medium bg-disabled-light text-default': variant === 'inactive',
-        'border-info-medium bg-info-light text-info-dark':
-          variant === 'neutral' || variant === 'progress',
-      },
-      extraClasses
-    )}
-  >
-    {#if variant === 'progress'}
-      <Progress />
-    {/if}
-    {label}
-  </small>
-</div>
+<small
+  class={cx(
+    'inline-flex items-center gap-1 rounded-full border px-2.5 py-0.5 text-xs',
+    {
+      'border-success-medium bg-success-light text-success-dark':
+        variant === 'success',
+      'border-warning-medium bg-warning-light text-warning-dark':
+        variant === 'warning',
+      'border-danger-medium bg-danger-light text-danger-dark':
+        variant === 'danger',
+      'border-medium bg-disabled-light text-default': variant === 'inactive',
+      'border-info-medium bg-info-light text-info-dark':
+        variant === 'neutral' || variant === 'progress',
+    },
+    extraClasses
+  )}
+>
+  {#if variant === 'progress'}
+    <Progress />
+  {/if}
+  {label}
+</small>