From 6992fe58223d61786fe4b0a9036893b09b49e23f Mon Sep 17 00:00:00 2001
From: ayan4m1 <andrew@bulletlogic.com>
Date: Wed, 17 Apr 2024 07:06:15 -0400
Subject: [PATCH] increase q/a font size and fix value hiding after question
 asked

---
 src/components/trivia/game.js   | 16 ++++++++++++----
 src/components/trivia/game.scss |  1 +
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/src/components/trivia/game.js b/src/components/trivia/game.js
index b7ef816..ed17610 100644
--- a/src/components/trivia/game.js
+++ b/src/components/trivia/game.js
@@ -72,7 +72,7 @@ export default function TriviaGame({ data }) {
                   <Fragment>
                     <Row>
                       <Col>
-                        <p>{selectedQuestion.answer}</p>
+                        <p>Answer: {selectedQuestion.answer}</p>
                       </Col>
                     </Row>
                     <Row>
@@ -81,7 +81,7 @@ export default function TriviaGame({ data }) {
                           variant="success"
                           onClick={() => {
                             setSelectedQuestion((prevVal) => {
-                              prevVal.value = '';
+                              prevVal.value = -1;
                               return null;
                             });
                             setRevealed(false);
@@ -120,9 +120,17 @@ export default function TriviaGame({ data }) {
                       xs={12}
                       key={index}
                       className={classNames('trivia-card')}
-                      onClick={() => setSelectedQuestion(question)}
+                      onClick={() =>
+                        setSelectedQuestion((prevVal) => {
+                          if (!prevVal?.value) {
+                            return question;
+                          } else {
+                            return null;
+                          }
+                        })
+                      }
                     >
-                      ${question.value}
+                      {question.value > 0 && `$${question.value}`}
                     </Col>
                   ))}
                 </Row>
diff --git a/src/components/trivia/game.scss b/src/components/trivia/game.scss
index ed204fb..4b7f8da 100644
--- a/src/components/trivia/game.scss
+++ b/src/components/trivia/game.scss
@@ -25,6 +25,7 @@
   display: flex;
   align-items: center;
   background-color: #060ce9;
+  font-size: 28px;
 
   > .container-fluid {
     text-align: center;