style: centered keyword items in the packages card (#854)

afterfiveguy · AbderrahmenMHEMED · danielroe · web-flow · commit 23d2ab32b14a · 2026-02-03T22:19:24.000Z
Co-authored-by: abderrahmen.mhemed &lt;abderrahmen.mhemed@wevioo.com&gt;
Co-authored-by: Daniel Roe &lt;daniel@roe.dev&gt;
diff --git a/app/components/Package/Card.vue b/app/components/Package/Card.vue
@@ -160,7 +160,7 @@ const pkgDescription = useMarkdown(() => ({
     <div
       v-if="result.package.keywords?.length"
       :aria-label="$t('package.card.keywords')"
-      class="relative z-10 flex flex-wrap gap-1.5 mt-3 pt-3 border-t border-border list-none m-0 p-0 pointer-events-none"
+      class="relative z-10 flex flex-wrap gap-1.5 mt-3 pt-3 border-t border-border list-none m-0 p-0 pointer-events-none items-center"
     >
       <TagButton
         v-for="keyword in result.package.keywords.slice(0, 5)"

Original file line number	Diff line number	Diff line change
`@@ -160,7 +160,7 @@ const pkgDescription = useMarkdown(() => ({`
`160`	`160`	`<div`
`161`	`161`	`v-if="result.package.keywords?.length"`
`162`	`162`	`:aria-label="$t('package.card.keywords')"`
`163`		`- class="relative z-10 flex flex-wrap gap-1.5 mt-3 pt-3 border-t border-border list-none m-0 p-0 pointer-events-none"`
	`163`	`+ class="relative z-10 flex flex-wrap gap-1.5 mt-3 pt-3 border-t border-border list-none m-0 p-0 pointer-events-none items-center"`
`164`	`164`	`>`
`165`	`165`	`<TagButton`
`166`	`166`	`v-for="keyword in result.package.keywords.slice(0, 5)"`