fix: spacing and widths

frontend/src/components/BatchCard.vue

@@ -3,7 +3,7 @@
 		class="flex flex-col shadow hover:bg-gray-100 rounded-md p-4 h-full"
 		style="min-height: 150px"
 	>
-		<div class="text-xl font-semibold mb-2">
+		<div class="text-lg leading-5 font-semibold mb-2">
 			{{ batch.title }}
 		</div>
 		<Badge
@@ -22,18 +22,17 @@
 		>
 			{{ __('Sold Out') }}
 		</Badge>
-		<div class="short-introduction">
+		<div class="short-introduction text-sm text-gray-700">
 			{{ batch.description }}
 		</div>
+		<div v-if="batch.amount" class="font-semibold mb-4">
+			{{ batch.price }}
+		</div>
 		<div class="flex flex-col space-y-2 mt-auto">
-			<div v-if="batch.amount" class="font-semibold text-lg">
-				{{ batch.price }}
-			</div>
-
 			<DateRange
 				:startDate="batch.start_date"
 				:endDate="batch.end_date"
-				class="text-sm text-gray-700 mb-3"
+				class="text-sm text-gray-700"
 			/>
 			<div class="flex items-center text-sm text-gray-700">
 				<Clock class="h-4 w-4 stroke-1.5 mr-2 text-gray-700" />
@@ -50,18 +49,21 @@
 					{{ batch.timezone }}
 				</span>
 			</div>
-			<div v-if="batch.instructors?.length" class="flex avatar-group overlap">
+		</div>
-				<div
+		<div
-					class="h-6 mr-1"
+			v-if="batch.instructors?.length"
-					:class="{ 'avatar-group overlap': batch.instructors.length > 1 }"
+			class="flex avatar-group overlap mt-4"
-				>
+		>
-					<UserAvatar
+			<div
-						v-for="instructor in batch.instructors"
+				class="h-6 mr-1"
-						:user="instructor"
+				:class="{ 'avatar-group overlap': batch.instructors.length > 1 }"
-					/>
+			>
-				</div>
+				<UserAvatar
-				<CourseInstructors :instructors="batch.instructors" />
+					v-for="instructor in batch.instructors"
+					:user="instructor"
+				/>
 			</div>
+			<CourseInstructors :instructors="batch.instructors" />
 		</div>
 	</div>
 </template>
@@ -88,7 +90,7 @@ const props = defineProps({
 	text-overflow: ellipsis;
 	width: 100%;
 	overflow: hidden;
-	margin: 0.25rem 0 1.25rem;
+	margin: 0.25rem 0 1rem;
 	line-height: 1.5;
 }
 

frontend/src/components/CourseCard.vue

@@ -72,7 +72,7 @@
 				{{ course.title }}
 			</div>
 
-			<div class="short-introduction">
+			<div class="short-introduction text-gray-700 text-sm">
 				{{ course.short_introduction }}
 			</div>
 

frontend/src/components/Quiz.vue

@@ -269,17 +269,19 @@ const quiz = createResource({
 	cache: ['quiz', props.quizName],
 	auto: true,
 	onSuccess(data) {
-		shuffleQuiz()
+		populateQuestions()
 	},
 })
 
-const shuffleQuiz = () => {
+const populateQuestions = () => {
 	let data = quiz.data
 	if (data.shuffle_questions) {
 		questions = shuffleArray(data.questions)
-	}
+		if (data.limit_questions_to) {
-	if (data.limit_questions_to) {
+			questions = questions.slice(0, data.limit_questions_to)
-		questions = questions.slice(0, data.limit_questions_to)
+		}
+	} else {
+		questions = data.questions
 	}
 }
 
@@ -322,7 +324,7 @@ const attempts = createResource({
 watch(
 	() => quiz.data,
 	() => {
-		if (quiz.data) {
+		if (quiz.data && quiz.data.max_attempts) {
 			attempts.reload()
 			resetQuiz()
 		}
@@ -476,7 +478,7 @@ const submitQuiz = () => {
 
 const createSubmission = () => {
 	quizSubmission.reload().then(() => {
-		attempts.reload()
+		if (quiz.data && quiz.data.max_attempts) attempts.reload()
 	})
 }
 
@@ -485,7 +487,7 @@ const resetQuiz = () => {
 	selectedOptions.splice(0, selectedOptions.length, ...[0, 0, 0, 0])
 	showAnswers.length = 0
 	quizSubmission.reset()
-	shuffleQuiz()
+	populateQuestions()
 }
 
 const getSubmissionColumns = () => {

frontend/src/pages/JobDetail.vue

@@ -50,9 +50,9 @@
 				</Button>
 			</div>
 		</header>
-		<div v-if="job.data" class="w-3/4 mx-auto">
+		<div v-if="job.data" class="max-w-3xl mx-auto">
 			<div class="p-4">
-				<div class="flex mb-4">
+				<div class="flex mb-10">
 					<img
 						:src="job.data.company_logo"
 						class="w-16 h-16 rounded-lg object-contain mr-4"
@@ -62,40 +62,36 @@
 						<div class="text-2xl font-semibold mb-4">
 							{{ job.data.job_title }}
 						</div>
-						<div class="grid grid-cols-3 gap-8">
+						<div
-							<div class="grid grid-cols-1 gap-2">
+							class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-10 gap-y-2 md:gap-y-4"
-								<div class="flex items-center space-x-2">
+						>
-									<Building2 class="h-4 w-4 stroke-1.5" />
+							<div class="flex items-center space-x-2">
-									<span>{{ job.data.company_name }}</span>
+								<Building2 class="h-4 w-4 stroke-1.5" />
-								</div>
+								<span>{{ job.data.company_name }}</span>
-								<div class="flex items-center space-x-2">
-									<MapPin class="h-4 w-4 stroke-1.5" />
-									<span>{{ job.data.location }}</span>
-								</div>
 							</div>
-							<div class="grid grid-cols-1 gap-2">
+							<div class="flex items-center space-x-2">
-								<div class="flex items-center space-x-2">
+								<MapPin class="h-4 w-4 stroke-1.5" />
-									<ClipboardType class="h-4 w-4 stroke-1.5" />
+								<span>{{ job.data.location }}</span>
-									<span>{{ job.data.type }}</span>
-								</div>
-								<div class="flex items-center space-x-2">
-									<CalendarDays class="h-4 w-4 stroke-1.5" />
-									<span>{{
-										dayjs(job.data.creation).format('DD MMM YYYY')
-									}}</span>
-								</div>
 							</div>
-							<div class="grid grid-cols-1 h-fit">
+							<div class="flex items-center space-x-2">
-								<div
+								<ClipboardType class="h-4 w-4 stroke-1.5" />
-									v-if="applicationCount.data"
+								<span>{{ job.data.type }}</span>
-									class="flex items-center space-x-2"
+							</div>
+							<div class="flex items-center space-x-2">
+								<CalendarDays class="h-4 w-4 stroke-1.5" />
+								<span>
+									{{ dayjs(job.data.creation).format('DD MMM YYYY') }}
+								</span>
+							</div>
+							<div
+								v-if="applicationCount.data"
+								class="flex items-center space-x-2"
+							>
+								<SquareUserRound class="h-4 w-4 stroke-1.5" />
+								<span
+									>{{ applicationCount.data }}
+									{{ __('applications received') }}</span
 								>
-									<SquareUserRound class="h-4 w-4 stroke-1.5" />
-									<span
-										>{{ applicationCount.data }}
-										{{ __('applications received') }}</span
-									>
-								</div>
 							</div>
 						</div>
 					</div>

lms/hooks.py

@@ -176,7 +176,10 @@ update_website_context = [
 ]
 
 jinja = {
-	"methods": ["lms.lms.utils.get_signup_optin_checks"],
+	"methods": [
+		"lms.lms.utils.get_signup_optin_checks",
+		"lms.lms.utils.get_tags",
+	],
 	"filters": [],
 }
 ## Specify the additional tabs to be included in the user profile page.

lms/lms/doctype/lms_question/lms_question.json

@@ -195,7 +195,8 @@
  ],
  "index_web_pages_for_search": 1,
  "links": [],
- "modified": "2024-05-24 16:12:26.331351",
+ "make_attachments_public": 1,
+ "modified": "2024-08-01 13:01:55.000072",
  "modified_by": "Administrator",
  "module": "LMS",
  "name": "LMS Question",