From a35529d59f3c1a1342a37ad22f9246fef0bd84ae Mon Sep 17 00:00:00 2001
From: Igor Carvalho <igorsilvabhz6@gmail.com>
Date: Tue, 4 Jul 2023 17:08:13 -0300
Subject: [PATCH] feat: remove class button-div-style from constants.tsx file

---
 .../src/CustomNodes/GenericNode/index.tsx      | 18 +++++++++---------
 src/frontend/src/constants.tsx                 |  8 --------
 src/frontend/src/index.css                     |  3 +++
 src/frontend/src/pages/MainPage/index.tsx      |  3 +--
 4 files changed, 13 insertions(+), 19 deletions(-)

diff --git a/src/frontend/src/CustomNodes/GenericNode/index.tsx b/src/frontend/src/CustomNodes/GenericNode/index.tsx
index e9caf7cc1..32cee565d 100644
--- a/src/frontend/src/CustomNodes/GenericNode/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/index.tsx
@@ -134,25 +134,25 @@ export default function GenericNode({
                   <div
                     className={classNames(
                       validationStatus && validationStatus.valid
-                        ? "w-4 h-4 rounded-full bg-status-red opacity-100"
-                        : "w-4 h-4 rounded-full bg-ring opacity-0 hidden animate-spin",
-                      "absolute w-4 hover:text-accent-foreground hover:transition-all ease-in-out duration-200"
+                        ? "h-4 w-4 rounded-full bg-status-green opacity-100"
+                        : "hidden h-4 w-4 animate-spin rounded-full bg-ring opacity-0",
+                      "absolute w-4 duration-200 ease-in-out hover:text-accent-foreground hover:transition-all"
                     )}
                   ></div>
                   <div
                     className={classNames(
                       validationStatus && !validationStatus.valid
-                        ? "w-4 h-4 rounded-full  bg-status-red opacity-100"
-                        : "w-4 h-4 rounded-full bg-ring opacity-0 hidden animate-spin",
-                      "absolute w-4 hover:text-accent-foreground hover:transition-all ease-in-out duration-200"
+                        ? "h-4 w-4 rounded-full  bg-status-red opacity-100"
+                        : "hidden h-4 w-4 animate-spin rounded-full bg-ring opacity-0",
+                      "absolute w-4 duration-200 ease-in-out hover:text-accent-foreground hover:transition-all"
                     )}
                   ></div>
                   <div
                     className={classNames(
                       !validationStatus || isBuilding
-                        ? "w-4 h-4 rounded-full  bg-status-yellow opacity-100"
-                        : "w-4 h-4 rounded-full bg-ring opacity-0 hidden animate-spin",
-                      "absolute w-4 hover:text-accent-foreground hover:transition-all ease-in-out duration-200"
+                        ? "h-4 w-4 rounded-full  bg-status-yellow opacity-100"
+                        : "hidden h-4 w-4 animate-spin rounded-full bg-ring opacity-0",
+                      "absolute w-4 duration-200 ease-in-out hover:text-accent-foreground hover:transition-all"
                     )}
                   ></div>
                 </div>
diff --git a/src/frontend/src/constants.tsx b/src/frontend/src/constants.tsx
index 99a1beb7f..4dfcbc898 100644
--- a/src/frontend/src/constants.tsx
+++ b/src/frontend/src/constants.tsx
@@ -179,14 +179,6 @@ export const COLUMN_DIV_STYLE =
  */
 export const NAV_DISPLAY_STYLE =
   " w-full flex justify-between py-12 pb-2 px-6 ";
-
-/**
- * The base text for subtitle of code dialog
- * @constant
- */
-export const BUTTON_DIV_STYLE = " flex gap-2 ";
-(" focus:ring-1 focus:ring-offset-1 focus:ring-ring focus:outline-none ");
-
 /**
  * Header text for user projects
  * @constant
diff --git a/src/frontend/src/index.css b/src/frontend/src/index.css
index 15a0b4b2e..077297311 100644
--- a/src/frontend/src/index.css
+++ b/src/frontend/src/index.css
@@ -143,6 +143,9 @@ The cursor: default; property value restores the browser's default cursor style
 
 
 @layer components {
+  .button-div-style {
+    @apply gap-2 flex
+  }
   .input-primary:focus{
     @apply focus:placeholder-transparent focus:ring-ring focus:border-ring
   }
diff --git a/src/frontend/src/pages/MainPage/index.tsx b/src/frontend/src/pages/MainPage/index.tsx
index 657ae8bd8..0b45a94ae 100644
--- a/src/frontend/src/pages/MainPage/index.tsx
+++ b/src/frontend/src/pages/MainPage/index.tsx
@@ -5,7 +5,6 @@ import { Button } from "../../components/ui/button";
 import { Link, useNavigate } from "react-router-dom";
 import { CardComponent } from "../../components/cardComponent";
 import { USER_PROJECTS_HEADER } from "../../constants";
-import { BUTTON_DIV_STYLE } from "../../constants";
 export default function HomePage() {
   const { flows, setTabId, downloadFlows, uploadFlows, addFlow, removeFlow } =
     useContext(TabsContext);
@@ -20,7 +19,7 @@ export default function HomePage() {
           <Home className="w-6" />
           {USER_PROJECTS_HEADER}
         </span>
-        <div className={`${BUTTON_DIV_STYLE}`}>
+        <div className="button-div-style">
           <Button
             variant="primary"
             onClick={() => {