fix: resolve <Badge /> incorrect sizes (#22539)

This pull-request makes a few changes to our `<Badge />` component to
bring it inline with Figma.

* Added all variants to the stories of Figma (they can vary per
badge-type, so its better we track everything).
* Removed the `border` variant of the component, border variants should
be on all `sm` and `md`.
* Added a hover effect to the `default` variant (per-design).
* Resolved issue with sizings of `xs` and `sm` plus resolved
iconography.
* Resolved issue with icons not showing at all on `xs` variants.

site/src/modules/workspaces/DynamicParameter/DynamicParameter.tsx

@@ -141,7 +141,7 @@ const ParameterLabel: FC<ParameterLabelProps> = ({
 							<Tooltip>
 								<TooltipTrigger asChild>
 									<span className="flex items-center">
-										<Badge size="sm" variant="warning" border="none">
+										<Badge size="sm" variant="warning">
 											<TriangleAlert />
 											Immutable
 										</Badge>
@@ -159,7 +159,7 @@ const ParameterLabel: FC<ParameterLabelProps> = ({
 							<Tooltip>
 								<TooltipTrigger asChild>
 									<span className="flex items-center">
-										<Badge size="sm" variant="green" border="none">
+										<Badge size="sm" variant="green">
 											<Hourglass />
 											Ephemeral
 										</Badge>
@@ -211,7 +211,7 @@ const ParameterLabel: FC<ParameterLabelProps> = ({
 							<Tooltip>
 								<TooltipTrigger asChild>
 									<span className="flex items-center">
-										<Badge size="sm" variant="destructive" border="none">
+										<Badge size="sm" variant="destructive">
 											Required
 										</Badge>
 									</span>