fix: certified participants page mobile layout

frontend/src/pages/Batch.vue

@@ -13,7 +13,7 @@
 				</template>
 			</Button>
 		</header>
-		<div v-if="batch.data" class="grid grid-cols-[70%,30%] h-full">
+		<div v-if="batch.data" class="grid grid-cols-[70%,30%] h-screen">
 			<div class="border-r-2">
 				<Tabs v-model="tabIndex" :tabs="tabs" tablistClass="overflow-x-visible">
 					<template #tab="{ tab, selected }" class="overflow-x-hidden">

frontend/src/pages/CertifiedParticipants.vue

@@ -3,23 +3,22 @@
 		class="sticky top-0 z-10 flex items-center justify-between border-b bg-white px-3 py-2.5 sm:px-5"
 	>
 		<Breadcrumbs :items="breadcrumbs" />
+		<div>
+			<FormControl
+				type="text"
+				placeholder="Search Participants"
+				v-model="searchQuery"
+				@input="participants.reload()"
+			>
+				<template #prefix>
+					<Search class="w-4" name="search" />
+				</template>
+			</FormControl>
+		</div>
 	</header>
 
-	<div class="m-5">
-		<FormControl
-			type="text"
-			placeholder="Search Participants"
-			v-model="searchQuery"
-			@input="participants.reload()"
-			size="md"
-		>
-			<template #prefix>
-				<Search class="w-4" name="search" />
-			</template>
-		</FormControl>
-	</div>
-	<div class="grid grid-cols-3 gap-4 m-5">
-		<div v-for="participant in participants.data">
+	<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 m-5">
+		<div v-if="participants.data" v-for="participant in participants.data">
 			<router-link
 				:to="{
 					name: 'Profile',
@@ -62,6 +61,7 @@ const searchQuery = ref('')
 const participants = createResource({
 	url: 'lms.lms.api.get_certified_participants',
 	method: 'GET',
+	cache: ['certified_participants'],
 	makeParams() {
 		return {
 			search_query: searchQuery.value,

frontend/src/pages/ProfileCertificates.vue

@@ -34,13 +34,9 @@ const props = defineProps({
 })
 
 const certificates = createResource({
-	url: 'frappe.client.get_list',
+	url: 'lms.lms.api.get_certificates',
 	params: {
-		doctype: 'LMS Certificate',
-		fields: ['name', 'course', 'course_title', 'issue_date', 'template'],
-		filters: {
-			member: props.profile.data.name,
-		},
+		member: props.profile.data.name,
 	},
 	auto: true,
 })