New “small” badge style

Author: samejr

apps/webapp/app/components/primitives/Badge.tsx

@@ -6,6 +6,8 @@ const variants = {
     "grid place-items-center rounded-full px-2 h-5 tracking-wider text-xxs bg-charcoal-750 text-text-bright uppercase whitespace-nowrap",
   "extra-small":
     "grid place-items-center border border-charcoal-650 rounded-sm px-1 h-4 text-xxs bg-background-bright text-blue-500 whitespace-nowrap",
+  small:
+    "grid place-items-center border border-charcoal-650 rounded-sm px-1.5 h-5 text-xs bg-background-bright text-blue-500 whitespace-nowrap",
   "outline-rounded":
     "grid place-items-center rounded-full px-1 h-4 tracking-wider text-xxs border border-blue-500 text-blue-500 uppercase whitespace-nowrap",
   rounded:

apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.regions/route.tsx

@@ -234,7 +234,7 @@ export default function Page() {
                               isSticky
                               visibleButtons={
                                 region.isDefault ? (
-                                  <Badge variant="outline-rounded" className="inline-grid">
+                                  <Badge variant="small" className="inline-grid">
                                     Default
                                   </Badge>
                                 ) : (