Añadidos iconos a botones en pantalla final

Author: sergio-jr-dev

package.json

@@ -10,6 +10,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@tabler/icons-react": "^3.26.0",
     "canvas-confetti": "^1.9.3",
     "marked": "^14.1.3",
     "react": "^18.3.1",

pnpm-lock.yaml

@@ -1,5 +1,6 @@
 import { useContext } from 'react';
 import { QuizContext } from '../../../context/QuizContext';
+import { IconReload, IconReportAnalytics } from '@tabler/icons-react';
 
 import './score.css';
 
@@ -19,6 +20,7 @@ export const Score = () => {
       : percentage >= 60
       ? '¡Buen intento!'
       : '¡Sigue practicando!';
+
   return (
     <article className="score">
       <h2 className="message">{message}</h2>
@@ -43,9 +45,13 @@ export const Score = () => {
           onClick={() => setShowResults(true)}
           hidden={showResults === true}
         >
+          <IconReportAnalytics stroke={2} />
           Ver resultados
         </button>
-        <button onClick={handleRestart}>Jugar de nuevo</button>
+        <button onClick={handleRestart}>
+          <IconReload stroke={2} />
+          Jugar de nuevo
+        </button>
       </div>
     </article>
   );

src/components/finalView/score/Score.jsx

@@ -1,4 +1,10 @@
 .buttons {
   display: flex;
   column-gap: 1rem;
+
+  button {
+    display: flex;
+    align-items: center;
+    column-gap: 0.3rem;
+  }
 }

src/components/quiz/buttons/buttons.css

@@ -4,7 +4,7 @@ import { questions } from '../data/questions';
 import confetti from 'canvas-confetti';
 
 export const QuizContextProvider = ({ children }) => {
-  const [currentQuestion, setCurrentQuestion] = useState(0);
+  const [currentQuestion, setCurrentQuestion] = useState(24);
   const [selectedOption, setSelectedOption] = useState(null);
   const [score, setScore] = useState(0);
   const [completed, setCompleted] = useState(false);