From abd314495789ab842cc161cb8a91ec440f8eb3bb Mon Sep 17 00:00:00 2001
From: ibolton336 <ibolton@redhat.com>
Date: Thu, 7 Sep 2023 17:01:09 -0400
Subject: [PATCH] Fix css

---
 .../components/dynamic-assessment-button.css  |  9 +++++++++
 .../components/dynamic-assessment-button.tsx  | 20 ++++++-------------
 2 files changed, 15 insertions(+), 14 deletions(-)
 create mode 100644 client/src/app/pages/applications/assessment-actions/components/dynamic-assessment-button.css

diff --git a/client/src/app/pages/applications/assessment-actions/components/dynamic-assessment-button.css b/client/src/app/pages/applications/assessment-actions/components/dynamic-assessment-button.css
new file mode 100644
index 0000000000..4689a73371
--- /dev/null
+++ b/client/src/app/pages/applications/assessment-actions/components/dynamic-assessment-button.css
@@ -0,0 +1,9 @@
+.continue-button {
+  background-color: var(--pf-v5-global--success-color--100) !important;
+  margin-right: 10px;
+}
+
+.retake-button {
+  background-color: var(--pf-v5-global--warning-color--100) !important  ;
+  margin-right: 10px;
+}
diff --git a/client/src/app/pages/applications/assessment-actions/components/dynamic-assessment-button.tsx b/client/src/app/pages/applications/assessment-actions/components/dynamic-assessment-button.tsx
index 3a533d88c8..9de819e0dc 100644
--- a/client/src/app/pages/applications/assessment-actions/components/dynamic-assessment-button.tsx
+++ b/client/src/app/pages/applications/assessment-actions/components/dynamic-assessment-button.tsx
@@ -5,14 +5,11 @@ import {
   InitialAssessment,
   Questionnaire,
 } from "@app/api/models";
-import {
-  useCreateAssessmentMutation,
-  useFetchAssessmentsByAppId,
-} from "@app/queries/assessments";
+import { useCreateAssessmentMutation } from "@app/queries/assessments";
 import { Button } from "@patternfly/react-core";
 import React, { FunctionComponent } from "react";
 import { useHistory } from "react-router-dom";
-import spacing from "@patternfly/react-styles/css/utilities/Spacing/spacing";
+import "./dynamic-assessment-button.css";
 
 enum AssessmentAction {
   Take = "Take",
@@ -52,14 +49,12 @@ const DynamicAssessmentButton: FunctionComponent<
     }
   };
 
-  const determineButtonBackgroundColor = () => {
+  const determineButtonClassName = () => {
     const action = determineAction();
     if (action === AssessmentAction.Continue) {
-      return "#5ba353"; // Continue background color
+      return "continue-button";
     } else if (action === AssessmentAction.Retake) {
-      return "#F0AB01"; // Retake background color
-    } else {
-      return ""; // Default background color for "Take"
+      return "retake-button";
     }
   };
 
@@ -100,12 +95,9 @@ const DynamicAssessmentButton: FunctionComponent<
   return (
     <div>
       <Button
-        className={spacing.mrSm}
         type="button"
         variant="primary"
-        style={{
-          backgroundColor: determineButtonBackgroundColor(),
-        }}
+        className={determineButtonClassName()}
         onClick={() => {
           onHandleAssessmentAction();
         }}