Improved the overall sizing of the Reading exam
This commit is contained in:
@@ -16,7 +16,7 @@ function Question({
|
||||
return (
|
||||
<div className="flex flex-col gap-10">
|
||||
<span className="">{prompt}</span>
|
||||
<div className="flex justify-between">
|
||||
<div className="flex flex-wrap gap-4 justify-between">
|
||||
{variant === "image" &&
|
||||
options.map((option) => (
|
||||
<div
|
||||
@@ -90,7 +90,7 @@ export default function MultipleChoice({id, prompt, type, questions, userSolutio
|
||||
|
||||
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>
|
||||
{questionIndex < questions.length && (
|
||||
<Question
|
||||
|
||||
@@ -166,7 +166,7 @@ export default function Reading({exam, showSolutions = false, onFinish}: Props)
|
||||
};
|
||||
|
||||
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">
|
||||
<h4 className="text-xl font-semibold">
|
||||
Please read the following excerpt attentively, you will then be asked questions about the text you've read.
|
||||
@@ -198,7 +198,7 @@ export default function Reading({exam, showSolutions = false, onFinish}: Props)
|
||||
disableTimer={showSolutions}
|
||||
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()}
|
||||
{exerciseIndex > -1 &&
|
||||
exerciseIndex < exam.exercises.length &&
|
||||
|
||||
Reference in New Issue
Block a user