fix: align end

Author: araujogui

apps/site/components/EOL/VulnerabilityChips/VulnerabilityChip/index.tsx

@@ -20,11 +20,7 @@ const VulnerabilityChip: FC<VulnerabilityChipProps> = ({
   const t = useTranslations();
 
   return (
-    <Badge
-      size="small"
-      kind={SEVERITY_KIND_MAP[severity] as BadgeKind}
-      className="mr-1"
-    >
+    <Badge size="small" kind={SEVERITY_KIND_MAP[severity] as BadgeKind}>
       {count > 0 ? <span className={styles.chipCount}>{count}</span> : null}
       {t(`components.eolChip.severity.${severity}`)}
     </Badge>

apps/site/components/EOL/VulnerabilityChips/index.tsx

@@ -23,7 +23,7 @@ const VulnerabilityChips: FC<VulnerabilityChipsProps> = ({
   );
 
   return (
-    <div className="vulnerability-chips">
+    <div className="flex flex-row flex-wrap gap-2 max-sm:justify-end">
       {SEVERITY_ORDER.filter(severity => groupedBySeverity[severity] > 0).map(
         severity => (
           <VulnerabilityChip

packages/ui-components/src/styles/markdown.css

@@ -184,15 +184,16 @@ main {
           block
           border-b
           py-2
-          pl-[50%]
+          pl-[33%]
           text-right
           text-neutral-600
           before:absolute
           before:left-0
           before:top-1/2
-          before:w-1/2
+          before:w-1/3
           before:-translate-y-1/2
           before:break-words
+          before:text-left
           before:font-medium
           before:text-neutral-700
           before:content-[attr(data-label)]