alex/canvasManagement
1
0
Fork 0
mirror of https://github.com/alexmickelson/canvasManagement.git synced 2026-03-25 23:28:33 -06:00
Code Issues Packages Projects Releases Wiki Activity

got help toggle

Browse Source
This commit is contained in:
Alex Mickelson
2024-09-18 13:31:22 -06:00
parent 49c5ae789a
commit 69043fa36d
3 changed files with 73 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
Management.Web/Pages/QuizForm/QuizFormPage.razor
View File

@@ -213,6 +213,7 @@ this is a matching question
toggle help toggle help
</button> </button>
</div> </div>
<section class="p-2"> <section class="p-2">
@if (quizContext.Quiz != null) @if (quizContext.Quiz != null)
{ {

77
nextjs/src/app/course/[courseName]/modules/[moduleName]/quiz/[quizName]/EditQuiz.tsx
View File

@@ -19,6 +19,47 @@ import { getCourseUrl } from "@/services/urlUtils";
import { useCourseContext } from "@/app/course/[courseName]/context/courseContext"; import { useCourseContext } from "@/app/course/[courseName]/context/courseContext";
import Link from "next/link"; import Link from "next/link";
const helpString = `QUESTION REFERENCE
---
Points: 2
this is a question?
*a) correct
b) not correct
---
points: 1
question goes here
[*] correct
[ ] not correct
[] not correct
---
the points default to 1?
*a) true
b) false
---
Markdown is supported
- like
- this
- list
[*] true
[ ] false
---
This is a one point essay question
essay
---
points: 4
this is a short answer question
short_answer
---
points: 4
the underscore is optional
short answer
---
this is a matching question
^ left answer - right dropdown
^ other thing - another option`;
export default function EditQuiz({ export default function EditQuiz({
moduleName, moduleName,
quizName, quizName,
@@ -61,25 +102,27 @@ export default function EditQuiz({
}, [moduleName, quiz, quizName, quizText, updateQuizMutation]); }, [moduleName, quiz, quizName, quizText, updateQuizMutation]);
return ( return (
<> <div className="h-full flex flex-col w-full">
{showHelp && <div className="w-72"> help here</div>} <div className={"min-h-0 flex flex-row "}>
<div className="h-full flex flex-col"> {showHelp && (
<div className="columns-2 min-h-0 flex-1"> <pre className="flex-shrink max-w-96">
<div className="flex-1 h-full"> <code>{helpString}</code>
<MonacoEditor value={quizText} onChange={setQuizText} /> </pre>
</div> )}
<div className="h-full"> <div className="flex-1 h-full">
<div className="text-red-300">{error && error}</div> <MonacoEditor value={quizText} onChange={setQuizText} />
<QuizPreview quiz={quiz} /> </div>
</div> <div className="flex-1 h-full">
<div className="text-red-300">{error && error}</div>
<QuizPreview quiz={quiz} />
</div> </div>
<QuizButtons
moduleName={moduleName}
quizName={quizName}
toggleHelp={() => setShowHelp((h) => !h)}
/>
</div> </div>
</> <QuizButtons
moduleName={moduleName}
quizName={quizName}
toggleHelp={() => setShowHelp((h) => !h)}
/>
</div>
); );
} }

23
nextjs/src/app/layout.tsx
View File

@@ -23,17 +23,18 @@ export default async function RootLayout({
return ( return (
<html lang="en"> <html lang="en">
<head> <head></head>
</head> <body className="flex justify-center">
<body className="bg-slate-900 h-screen p-1 text-slate-300"> <div className="bg-slate-900 h-screen p-1 text-slate-300 w-full">
<MyToaster /> <MyToaster />
<Suspense> <Suspense>
<Providers> <Providers>
<HydrationBoundary state={dehydratedState}> <HydrationBoundary state={dehydratedState}>
{children} {children}
</HydrationBoundary> </HydrationBoundary>
</Providers> </Providers>
</Suspense> </Suspense>
</div>
</body> </body>
</html> </html>
); );