il manque simplement à centrer le boutton réponse

This commit is contained in:
JubaAzul 2025-03-14 20:03:14 -04:00
parent 731841a315
commit 33d81ac604
2 changed files with 35 additions and 28 deletions

View file

@ -99,8 +99,8 @@ const MultipleChoiceQuestionDisplay: React.FC<Props> = (props) => {
{!showAnswer && handleOnSubmitAnswer && ( {!showAnswer && handleOnSubmitAnswer && (
<Button <Button
className='submit-button' className='submit-button'
variant="contained" variant="contained"
onClick={() => onClick={() =>
answer !== "" && handleOnSubmitAnswer && handleOnSubmitAnswer(answer) answer !== "" && handleOnSubmitAnswer && handleOnSubmitAnswer(answer)
} }

View file

@ -21,7 +21,6 @@
.question-wrapper { .question-wrapper {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center;
} }
.question-wrapper .katex { .question-wrapper .katex {
@ -29,7 +28,8 @@
} }
.katex * { .katex * {
font-family: 'KaTeX_Main' /* to display characters like \neq properly */ font-family: 'KaTeX_Main'
/* to display characters like \neq properly */
} }
.circle { .circle {
@ -95,15 +95,11 @@
} }
.answer-positive-weight { .answer-positive-weight {
background-color: hsl( background-color: hsl(120, 100%, 90%);
120, 100%, 90%
);
} }
.answer-zero-or-less-weight { .answer-zero-or-less-weight {
background-color: hsl( background-color: hsl(0, 100%, 90%);
0, 100%, 90%
);
} }
.answer-text.selected { .answer-text.selected {
@ -117,7 +113,8 @@
} }
.feedback-container { .feedback-container {
display: inline-block !important; /* override the parent */ display: inline-block !important;
/* override the parent */
align-items: center; align-items: center;
margin-left: 1.1rem; margin-left: 1.1rem;
position: relative; position: relative;
@ -154,6 +151,7 @@
border-radius: 6px; border-radius: 6px;
box-shadow: 0px 2px 5px hsl(0, 0%, 74%); box-shadow: 0px 2px 5px hsl(0, 0%, 74%);
} }
.false-feedback { .false-feedback {
position: relative; position: relative;
padding: 0 1rem; padding: 0 1rem;
@ -169,26 +167,37 @@
} }
.correct-answer-text { .correct-answer-text {
text-align: left; /* Align text to the left */ text-align: left;
width: 100%; /* Ensure it takes the full width of its container */ /* Align text to the left */
width: 100%;
/* Ensure it takes the full width of its container */
} }
.accepted-answers { .accepted-answers {
display: inline-block; /* Display elements side by side */ display: inline-block;
border-radius: 6px; /* Add rounded corners */ /* Display elements side by side */
padding: 0.5rem; /* Add padding for spacing */ border-radius: 6px;
margin: 0.5rem; /* Add margin for spacing between elements */ /* Add rounded corners */
background-color: hsl(0, 0%, 87%); /* Optional: Add a background color for emphasis */ padding: 0.5rem;
/* Add padding for spacing */
margin: 0.5rem;
/* Add margin for spacing between elements */
background-color: hsl(0, 0%, 87%);
/* Optional: Add a background color for emphasis */
} }
.question-feedback-validation{
font-size: 1.8rem; /* Increase the font size */ .question-feedback-validation {
font-weight: bold; /* Make the text bold */ font-size: 1.8rem;
/* Increase the font size */
font-weight: bold;
/* Make the text bold */
width: 100%; width: 100%;
height: 100%; height: 100%;
margin: 0 auto; margin: 0 auto;
} }
.question-title{
.question-title {
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
margin-top: 1.5rem; margin-top: 1.5rem;
width: 100%; width: 100%;
@ -196,14 +205,12 @@
font-weight: bold; font-weight: bold;
} }
.question-content{ .question-content {
margin-bottom: 1rem; margin-bottom: 1rem;
} }
.submit-button{
width: 20%;
}
.submit-button {
width: min-content;
margin-left: 19rem;}