From 573b790478907457d4e0f5d2fecf89af6ab362ca Mon Sep 17 00:00:00 2001
From: Gauthier Roebroeck <gauthier.roebroeck@gmail.com>
Date: Tue, 29 Jul 2025 14:32:57 +0800
Subject: [PATCH] position of the release card chips

---
 next-ui/src/components/release/Card.mdx |  2 +-
 next-ui/src/components/release/Card.vue | 64 ++++++++++++-------------
 2 files changed, 32 insertions(+), 34 deletions(-)

diff --git a/next-ui/src/components/release/Card.mdx b/next-ui/src/components/release/Card.mdx
index ed4c40a1..1e22db22 100644
--- a/next-ui/src/components/release/Card.mdx
+++ b/next-ui/src/components/release/Card.mdx
@@ -8,4 +8,4 @@ import * as Stories from './Card.stories';
 
 A card showing the details of a Komga release.
 
-<Canvas of={Stories.Default} />
+<Canvas of={Stories.LatestAndCurrent} />
diff --git a/next-ui/src/components/release/Card.vue b/next-ui/src/components/release/Card.vue
index a957ecd8..287ed52a 100644
--- a/next-ui/src/components/release/Card.vue
+++ b/next-ui/src/components/release/Card.vue
@@ -1,44 +1,42 @@
 <template>
   <v-card>
     <template #title>
-      <div>
+      <span class="d-inline-flex ga-2 align-center">
         <a
           :href="release.url"
           target="_blank"
-          class="text-h4 font-weight-medium link-underline me-2"
+          class="text-h4 font-weight-medium link-underline"
           >{{ release.version }}</a
         >
-        <span class="d-inline-flex mt-n3 ga-2 ms-2">
-          <v-chip
-            v-if="current"
-            size="small"
-            rounded
-            color="info"
-          >
-            {{
-              $formatMessage({
-                description:
-                  'Updates view: badge showing next to the currently installed release number',
-                defaultMessage: 'Installed',
-                id: 'WADecv',
-              })
-            }}
-          </v-chip>
-          <v-chip
-            v-if="latest"
-            size="small"
-            rounded
-          >
-            {{
-              $formatMessage({
-                description: 'Updates view: badge showing next to the latest release number',
-                defaultMessage: 'Latest',
-                id: '2Bh8F2',
-              })
-            }}
-          </v-chip>
-        </span>
-      </div>
+        <v-chip
+          v-if="current"
+          size="small"
+          rounded
+          color="info"
+        >
+          {{
+            $formatMessage({
+              description:
+                'Updates view: badge showing next to the currently installed release number',
+              defaultMessage: 'Installed',
+              id: 'WADecv',
+            })
+          }}
+        </v-chip>
+        <v-chip
+          v-if="latest"
+          size="small"
+          rounded
+        >
+          {{
+            $formatMessage({
+              description: 'Updates view: badge showing next to the latest release number',
+              defaultMessage: 'Latest',
+              id: '2Bh8F2',
+            })
+          }}
+        </v-chip>
+      </span>
     </template>
 
     <template #subtitle>