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

Corrected some little bugs

Browse Source
This commit is contained in:
Tiago Ribeiro
2023-04-11 22:49:36 +01:00
parent 503a265da0
commit ca0584da2a
5 changed files with 10 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/Exercises/FillBlanks.tsx
View File

@@ -89,7 +89,7 @@ export default function FillBlanks({id, allowRepetition, prompt, solutions, text
const userSolution = userSolutions.find((x) => x.id === id);
return (
<button className="border-2 rounded-xl px-4 text-blue-400 border-blue-400" onClick={() => setCurrentBlankId(id)}>
<button className="border-2 rounded-xl px-4 text-blue-400 border-blue-400 my-2" onClick={() => setCurrentBlankId(id)}>
{userSolution ? userSolution.solution : id}
</button>
);

2
src/components/Exercises/WriteBlanks.tsx
View File

@@ -33,7 +33,7 @@ function Blank({
return (
<input
className={clsx("input border rounded-xl px-2 py-1 bg-white text-blue-400 border-blue-400")}
className={clsx("input border rounded-xl px-2 py-1 bg-white text-blue-400 border-blue-400 my-2")}
placeholder={id}
onChange={(e) => setUserInput(e.target.value)}
value={userInput}

10
src/components/Solutions/FillBlanks.tsx
View File

@@ -18,20 +18,22 @@ export default function FillBlanksSolutions({prompt, solutions, text, userSoluti
if (!userSolution) {
return (
<>
<button className={clsx("border-2 rounded-xl px-4 text-gray-500 border-gray-500")}>{solution.solution}</button>
<button className={clsx("border-2 rounded-xl px-4 text-gray-500 border-gray-500 my-2")}>{solution.solution}</button>
</>
);
}
if (userSolution.solution === solution.solution) {
return <button className={clsx("border-2 rounded-xl px-4 text-green-500 border-green-500")}>{solution.solution}</button>;
return <button className={clsx("border-2 rounded-xl px-4 text-green-500 border-green-500 my-2")}>{solution.solution}</button>;
}
if (userSolution.solution !== solution.solution) {
return (
<>
<button className={clsx("border-2 rounded-xl px-4 text-red-500 border-red-500 mr-1")}>{userSolution.solution}</button>
<button className={clsx("border-2 rounded-xl px-4 text-blue-400 border-blue-400")}>{solution.solution}</button>
<button className={clsx("border-2 rounded-xl px-4 text-red-500 border-red-500 mr-1 my-2")}>
{userSolution.solution}
</button>
<button className={clsx("border-2 rounded-xl px-4 text-green-400 border-green-400 my-2")}>{solution.solution}</button>
</>
);
}

1
src/components/Solutions/MultipleChoice.tsx
View File

@@ -74,6 +74,7 @@ function Question({
key={option.id}
onClick={() => (onSelectOption ? onSelectOption(option.id) : null)}
className={clsx("flex border-2 p-4 rounded-xl gap-2 cursor-pointer bg-white", optionColor(option.id))}>
{showSolution && optionBadge(option.id)}
<span className="font-bold">{option.id}.</span>
<span>{option.text}</span>
</div>

2
src/components/Solutions/WriteBlanks.tsx
View File

@@ -44,7 +44,7 @@ function Blank({
return (
<input
className={clsx("input border rounded-xl px-2 py-1 bg-white", !solutions && "text-blue-400 border-blue-400", getSolutionStyling())}
className={clsx("input border rounded-xl px-2 py-1 bg-white my-2", !solutions && "text-blue-400 border-blue-400", getSolutionStyling())}
placeholder={id}
onChange={(e) => setUserInput(e.target.value)}
value={!solutions ? userInput : solutions.join(" / ")}