update two colors (brandSuccess, brandDanger), change tabs text color in review mode (TestScreen)

src/libs/native-base/variables/platform.ts

@@ -131,8 +131,8 @@ export default {
   // Color
   brandPrimary: '#448AFF',
   brandInfo: '#62B1F6',
-  brandSuccess: '#5cb85c',
-  brandDanger: '#d9534f',
+  brandSuccess: '#4caf50',
+  brandDanger: '#f44336',
   brandWarning: '#f0ad4e',
   brandDark: '#000',
   brandLight: '#a9a9a9',

src/screens/TestScreen/components/Test/Test.tsx

@@ -1,5 +1,6 @@
 import React, { useRef, useState } from 'react';
 import { Question as QuestionT, Answer } from 'libs/graphql';
+import { useVariables } from 'libs/native-base';
 
 import { ScrollableTab, Tab, Tabs } from 'native-base';
 import Question from './Question';
@@ -16,6 +17,7 @@ const Test = ({ questions }: TestProps) => {
   const [selectedAnswers, setSelectedAnswers] = useState<Answer[]>(
     new Array(questions.length).fill(''),
   );
+  const variables = useVariables();
 
   const createSelectAnswerHandler = (index: number) => (answer: Answer) => {
     if (reviewMode) {
@@ -36,8 +38,20 @@ const Test = ({ questions }: TestProps) => {
       }}
     >
       {questions.map((question, index) => {
+        const color =
+          selectedAnswers[index] === question.correctAnswer
+            ? variables.buttonSuccessBg
+            : variables.buttonDangerBg;
+        const textStyle = {
+          color,
+        };
         return (
-          <Tab key={question.id} heading={`Pytanie ${index + 1}`}>
+          <Tab
+            key={question.id}
+            heading={`Pytanie ${index + 1}`}
+            textStyle={reviewMode ? textStyle : []}
+            activeTextStyle={reviewMode ? textStyle : []}
+          >
             <Question
               question={question}
               reviewMode={reviewMode}