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

Created a simple Practice Badge to showcase when an exercise is a practice exercise

Browse Source
This commit is contained in:
Tiago Ribeiro
2024-11-16 12:03:08 +00:00
parent d564d86feb
commit 501606233f
9 changed files with 46 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/Exercises/FillBlanks/index.tsx
View File

@@ -7,6 +7,7 @@ import { CommonProps } from "..";
import Button from "../../Low/Button";
import { v4 } from "uuid";
import MCDropdown from "./MCDropdown";
import PracticeBadge from "@/components/Low/PracticeBadge";
const FillBlanks: React.FC<FillBlanksExercise & CommonProps> = ({
id,
@@ -196,7 +197,7 @@ const FillBlanks: React.FC<FillBlanksExercise & CommonProps> = ({
<div className="flex flex-col gap-4">
{!disableProgressButtons && progressButtons()}
<div className={clsx("flex flex-col gap-4 mt-4 h-full w-full", !disableProgressButtons && "mb-20")}>
<div className={clsx("flex flex-col gap-4 mt-4 h-full w-full relative", !disableProgressButtons && "mb-20")}>
{variant !== "mc" && (
<span className="text-sm w-full leading-6">
{prompt.split("\\n").map((line, index) => (
@@ -207,6 +208,7 @@ const FillBlanks: React.FC<FillBlanksExercise & CommonProps> = ({
))}
</span>
)}
{isPractice && <PracticeBadge className="w-fit self-end" />}
<span className="bg-mti-gray-smoke rounded-xl px-5 py-6">{memoizedLines}</span>
{variant !== "mc" && (
<div className="bg-mti-gray-smoke rounded-xl px-5 py-6 flex flex-col gap-4">
@@ -234,6 +236,7 @@ const FillBlanks: React.FC<FillBlanksExercise & CommonProps> = ({
</div>
</div>
)}
</div>
{!disableProgressButtons && progressButtons()}