fix: styling of batch list headers

frontend/src/components/Assessments.vue

@@ -1,7 +1,7 @@
 <template>
 	<div>
-		<div class="flex items-center justify-between">
-			<div class="text-lg font-semibold mb-4">
+		<div class="flex items-center justify-between mb-4">
+			<div class="text-lg font-semibold">
 				{{ __('Assessments') }}
 			</div>
 			<Button v-if="canSeeAddButton()" @click="showModal = true">
@@ -38,7 +38,10 @@
 					<ListRow :row="row" v-for="row in assessments.data">
 						<template #default="{ column, item }">
 							<ListRowItem :item="row[column.key]" :align="column.align">
-								<div>
+								<div v-if="column.key == 'assessment_type'">
+									{{ row[column.key] == 'LMS Quiz' ? 'Quiz' : 'Assignment' }}
+								</div>
+								<div v-else>
 									{{ row[column.key] }}
 								</div>
 							</ListRowItem>
@@ -177,10 +180,12 @@ const getAssessmentColumns = () => {
 		{
 			label: 'Assessment',
 			key: 'title',
+			width: '30rem',
 		},
 		{
 			label: 'Type',
 			key: 'assessment_type',
+			width: '10rem',
 		},
 	]
 
@@ -189,6 +194,7 @@ const getAssessmentColumns = () => {
 			label: 'Status/Score',
 			key: 'status',
 			align: 'center',
+			width: '10rem',
 		})
 	}
 	return columns

frontend/src/components/BatchCourses.vue

@@ -1,7 +1,7 @@
 <template>
 	<div>
 		<div class="flex items-center justify-between mb-4">
-			<div class="text-xl font-semibold">
+			<div class="text-lg font-semibold">
 				{{ __('Courses') }}
 			</div>
 			<Button v-if="canSeeAddButton()" @click="openCourseModal()">
@@ -110,7 +110,6 @@ const openCourseModal = () => {
 }
 
 const getCoursesColumns = () => {
-	console.log(courses.data)
 	return [
 		{
 			label: 'Title',

frontend/src/components/BatchStudents.vue

@@ -1,12 +1,14 @@
 <template>
-	<Button class="float-right mb-3" @click="openStudentModal()">
-		<template #prefix>
-			<Plus class="h-4 w-4" />
-		</template>
-		{{ __('Add') }}
-	</Button>
-	<div class="text-lg font-semibold mb-4">
-		{{ __('Students') }}
+	<div class="flex items-center justify-between mb-4">
+		<div class="text-lg font-semibold">
+			{{ __('Students') }}
+		</div>
+		<Button @click="openStudentModal()">
+			<template #prefix>
+				<Plus class="h-4 w-4" />
+			</template>
+			{{ __('Add') }}
+		</Button>
 	</div>
 	<div v-if="students.data?.length">
 		<ListView
@@ -147,7 +149,7 @@ const getStudentColumns = () => {
 			})
 		})
 	}
-	console.log(students.data?.[0].assessments)
+
 	if (students.data?.[0].assessments) {
 		Object.keys(students.data?.[0].assessments).forEach((assessment) => {
 			columns.push({