From 6c50292a6603983d03f3d22b25db9602dd3c0b5b Mon Sep 17 00:00:00 2001
From: Jannat Patel <pateljannat2308@gmail.com>
Date: Mon, 21 Apr 2025 16:16:54 +0530
Subject: [PATCH] fix: tags spacing on course cards

---
 frontend/src/components/CourseCard.vue | 14 +++++++++-----
 frontend/src/pages/CourseDetail.vue    |  2 +-
 2 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/frontend/src/components/CourseCard.vue b/frontend/src/components/CourseCard.vue
index d26f5130..98093808 100644
--- a/frontend/src/components/CourseCard.vue
+++ b/frontend/src/components/CourseCard.vue
@@ -9,16 +9,20 @@
 			:class="{ 'default-image': !course.image }"
 			:style="{ backgroundImage: 'url(\'' + encodeURI(course.image) + '\')' }"
 		>
-			<div
-				class="flex items-center flex-wrap space-x-1 relative top-4 px-2 w-fit"
-			>
-				<Badge v-if="course.featured" variant="subtle" theme="green" size="md">
+			<div class="flex items-center flex-wrap relative top-4 px-2 w-fit">
+				<Badge
+					v-if="course.featured"
+					variant="subtle"
+					theme="green"
+					size="md"
+					class="mb-1 mr-1"
+				>
 					{{ __('Featured') }}
 				</Badge>
 				<div
 					v-if="course.tags"
 					v-for="tag in course.tags?.split(', ')"
-					class="text-xs bg-white text-gray-800 px-2 py-0.5 rounded-md"
+					class="text-xs bg-white text-gray-800 px-2 py-0.5 rounded-md mb-1 mr-1"
 				>
 					{{ tag }}
 				</div>
diff --git a/frontend/src/pages/CourseDetail.vue b/frontend/src/pages/CourseDetail.vue
index 561c9362..eaa9d7ac 100644
--- a/frontend/src/pages/CourseDetail.vue
+++ b/frontend/src/pages/CourseDetail.vue
@@ -56,7 +56,7 @@
 							<CourseInstructors :instructors="course.data.instructors" />
 						</div>
 					</div>
-					<div v-if="course.data.tags" class="flex mt-4 w-fit">
+					<div v-if="course.data.tags" class="flex my-4 w-fit">
 						<Badge
 							theme="gray"
 							size="lg"