devops/encoach_frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improved the overall sizing of the Reading exam

Browse Source
This commit is contained in:
Tiago Ribeiro
2023-09-03 20:47:24 +01:00
parent 1a0ec780b9
commit 578f42d9b1
2 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/Exercises/MultipleChoice.tsx
View File

@@ -16,7 +16,7 @@ function Question({
return ( return (
<div className="flex flex-col gap-10"> <div className="flex flex-col gap-10">
<span className="">{prompt}</span> <span className="">{prompt}</span>
<div className="flex justify-between"> <div className="flex flex-wrap gap-4 justify-between">
{variant === "image" && {variant === "image" &&
options.map((option) => ( options.map((option) => (
<div <div
@@ -90,7 +90,7 @@ export default function MultipleChoice({id, prompt, type, questions, userSolutio
return ( return (
<> <>
<div className="flex flex-col gap-2 mt-4 h-full mb-20 bg-mti-gray-smoke rounded-xl px-16 py-8"> <div className="flex flex-col gap-2 mt-4 h-fit mb-20 bg-mti-gray-smoke rounded-xl px-16 py-8">
<span className="text-xl font-semibold">{prompt}</span> <span className="text-xl font-semibold">{prompt}</span>
{questionIndex < questions.length && ( {questionIndex < questions.length && (
<Question <Question

4
src/exams/Reading.tsx
View File

@@ -166,7 +166,7 @@ export default function Reading({exam, showSolutions = false, onFinish}: Props)
}; };
const renderText = () => ( const renderText = () => (
<div className="flex flex-col gap-6 w-full bg-mti-gray-seasalt rounded-xl py-8 px-16"> <div className="flex flex-col gap-6 w-full bg-mti-gray-seasalt rounded-xl py-8 px-16 mt-4">
<div className="flex flex-col w-full gap-2"> <div className="flex flex-col w-full gap-2">
<h4 className="text-xl font-semibold"> <h4 className="text-xl font-semibold">
Please read the following excerpt attentively, you will then be asked questions about the text you&apos;ve read. Please read the following excerpt attentively, you will then be asked questions about the text you&apos;ve read.
@@ -198,7 +198,7 @@ export default function Reading({exam, showSolutions = false, onFinish}: Props)
disableTimer={showSolutions} disableTimer={showSolutions}
label={exerciseIndex === -1 ? undefined : convertCamelCaseToReadable(exam.exercises[exerciseIndex].type)} label={exerciseIndex === -1 ? undefined : convertCamelCaseToReadable(exam.exercises[exerciseIndex].type)}
/> />
<div className="flex gap-4 mb-20"> <div className="grid grid-cols-2 gap-4 mb-20 w-full">
{renderText()} {renderText()}
{exerciseIndex > -1 && {exerciseIndex > -1 &&
exerciseIndex < exam.exercises.length && exerciseIndex < exam.exercises.length &&