feat: remove class button-div-style from constants.tsx file

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"
+                        ? "h-4 w-4 rounded-full bg-status-green opacity-100"
-                        : "w-4 h-4 rounded-full bg-ring opacity-0 hidden animate-spin",
+                        : "hidden h-4 w-4 animate-spin rounded-full bg-ring opacity-0",
-                      "absolute w-4 hover:text-accent-foreground hover:transition-all ease-in-out duration-200"
+                      "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"
+                        ? "h-4 w-4 rounded-full  bg-status-red opacity-100"
-                        : "w-4 h-4 rounded-full bg-ring opacity-0 hidden animate-spin",
+                        : "hidden h-4 w-4 animate-spin rounded-full bg-ring opacity-0",
-                      "absolute w-4 hover:text-accent-foreground hover:transition-all ease-in-out duration-200"
+                      "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"
+                        ? "h-4 w-4 rounded-full  bg-status-yellow opacity-100"
-                        : "w-4 h-4 rounded-full bg-ring opacity-0 hidden animate-spin",
+                        : "hidden h-4 w-4 animate-spin rounded-full bg-ring opacity-0",
-                      "absolute w-4 hover:text-accent-foreground hover:transition-all ease-in-out duration-200"
+                      "absolute w-4 duration-200 ease-in-out hover:text-accent-foreground hover:transition-all"
                     )}
                   ></div>
                 </div>

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

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
   }

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={() => {