diff --git a/frontend/components/review-2024/Review2024Page/index.tsx b/frontend/components/review-2024/Review2024Page/index.tsx
index b445ac6e..0b222df0 100644
--- a/frontend/components/review-2024/Review2024Page/index.tsx
+++ b/frontend/components/review-2024/Review2024Page/index.tsx
@@ -22,8 +22,9 @@ export function Review2024Page() {
const [selectedTab, setSelectedTab] = useState('overview');
- const [quizPoints, setQuizPoints] = useState(1);
+ const [quizPoints, setQuizPoints] = useState(0);
const [quizProgress, setQuizProgress] = useState(0);
+ const [answerStatus, setAnswerStatus] = useState<'correct' | 'wrong' | null>(null);
//
// B. Render components
@@ -50,8 +51,10 @@ export function Review2024Page() {
{selectedTab === 'quiz' && (
diff --git a/frontend/components/review-2024/Review2024QuizPoints/styles.module.css b/frontend/components/review-2024/Review2024QuizPoints/styles.module.css
index 78e8dabd..9382fdf5 100644
--- a/frontend/components/review-2024/Review2024QuizPoints/styles.module.css
+++ b/frontend/components/review-2024/Review2024QuizPoints/styles.module.css
@@ -8,7 +8,7 @@
align-items: center;
justify-content: center;
width: 100%;
- padding: 10px 20px;
+ padding: 30px;
font-size: 20px;
font-weight: var(--font-weight-bold);
line-height: 1;
@@ -18,7 +18,7 @@
border-radius: 18px;
}
-@media (width <= 400px) {
+@media (width <= 650px) {
.container {
border-radius: 0;
}
diff --git a/frontend/components/review-2024/Review2024QuizQuestion/index.tsx b/frontend/components/review-2024/Review2024QuizQuestion/index.tsx
index 10a48009..ae3512a5 100644
--- a/frontend/components/review-2024/Review2024QuizQuestion/index.tsx
+++ b/frontend/components/review-2024/Review2024QuizQuestion/index.tsx
@@ -52,7 +52,7 @@ export function Review2024QuizQuestion({ answerStatus, onAnswer, onClickNext, pr
>
-
{t('progress', { current: progress, total: allQuizData.length })}
+
{t('progress', { current: progress + 1, total: allQuizData.length })}
{t('points', { points: quizData._points })}
diff --git a/frontend/components/review-2024/Review2024QuizQuestion/styles.module.css b/frontend/components/review-2024/Review2024QuizQuestion/styles.module.css
index 65d1b6a3..e386149e 100644
--- a/frontend/components/review-2024/Review2024QuizQuestion/styles.module.css
+++ b/frontend/components/review-2024/Review2024QuizQuestion/styles.module.css
@@ -9,16 +9,19 @@
justify-content: flex-start;
width: 100%;
overflow: hidden;
+ background-color: var(--color-system-background-100);
border: 2px solid var(--color-border);
border-radius: 18px;
+ box-shadow: 0 0 15px 0 rgb(0 0 0 / 15%);
--animation-duration-open: 600ms;
--animation-duration-close: 600ms;
}
-@media (width <= 400px) {
+@media (width <= 650px) {
.container {
border-radius: 0;
+ box-shadow: unset;
}
}
diff --git a/frontend/components/review-2024/Review2024QuizWrapper/index.tsx b/frontend/components/review-2024/Review2024QuizWrapper/index.tsx
index 6dbf36be..57403c00 100644
--- a/frontend/components/review-2024/Review2024QuizWrapper/index.tsx
+++ b/frontend/components/review-2024/Review2024QuizWrapper/index.tsx
@@ -10,22 +10,23 @@ import { Review2024QuizFinalResult } from '@/components/review-2024/Review2024Qu
import { Review2024QuizPoints } from '@/components/review-2024/Review2024QuizPoints';
import { Review2024QuizQuestion } from '@/components/review-2024/Review2024QuizQuestion';
import { useTranslations } from 'next-intl';
-import { useState } from 'react';
import styles from './styles.module.css';
/* * */
interface Props {
+ answerStatus: 'correct' | 'wrong' | null
points: number
progress: number
+ setAnswerStatus: (value: 'correct' | 'wrong' | null) => void
setPoints: (value: number) => void
setProgress: (value: number) => void
}
/* * */
-export function Review2024QuizWrapper({ points, progress, setPoints, setProgress }: Props) {
+export function Review2024QuizWrapper({ answerStatus, points, progress, setAnswerStatus, setPoints, setProgress }: Props) {
//
//
@@ -33,8 +34,6 @@ export function Review2024QuizWrapper({ points, progress, setPoints, setProgress
const t = useTranslations('review-2024.Review2024QuizWrapper');
- const [answerStatus, setAnswerStatus] = useState<'correct' | 'wrong' | null>(null);
-
//
// B. Handle actions
@@ -42,7 +41,7 @@ export function Review2024QuizWrapper({ points, progress, setPoints, setProgress
if (answerStatus === null) {
if (answerData.is_correct) {
setAnswerStatus('correct');
- setPoints(points);
+ setPoints(points + (allQuizData[progress]?._points || 0));
}
else {
setAnswerStatus('wrong');
@@ -60,9 +59,11 @@ export function Review2024QuizWrapper({ points, progress, setPoints, setProgress
if (progress >= allQuizData.length) {
return (
-
-
-
+
+
+
);
}
diff --git a/frontend/i18n/translations/pt.json b/frontend/i18n/translations/pt.json
index 2a97c057..7d1eab16 100644
--- a/frontend/i18n/translations/pt.json
+++ b/frontend/i18n/translations/pt.json
@@ -1206,7 +1206,7 @@
"points": "Já tens {points, plural, =1 {# ponto} other {# pontos}}!"
},
"Review2024QuizPoints": {
- "points": "Já tens {points, plural, =1 {# ponto} other {# pontos}}"
+ "points": "{points, plural, =0 {Joga para ganhar pontos!} =1 {Já tens # ponto} other {Já tens # pontos}}"
},
"Review2024QuizQuestion": {
"next_question": "Próxima Pergunta ›",