styles changes

2025-10-08 12:01:52 -06:00
parent b507eb157b
commit c6c42e914a
15 changed files with 345 additions and 192 deletions
@@ -1,50 +1,49 @@
-'use client'
+"use client";

 import { useState, ReactNode } from "react";
-import "./StepNavigator.css"
+import "./StepNavigator.css";

 interface StepNavigatorProps {
-    totalSteps: number;
-    children: ReactNode[];
-    onFinish?: () => void;
+  totalSteps: number;
+  children: ReactNode[];
+  onFinish?: () => void;
 }

-export default function StepNavigator({ totalSteps, children, onFinish }: StepNavigatorProps) {
-    const [step, setStep] = useState(1);
+export default function StepNavigator({
+  totalSteps,
+  children,
+  onFinish,
+}: StepNavigatorProps) {
+  const [step, setStep] = useState(1);

-    const handleNext = (e: React.MouseEvent<HTMLButtonElement>) => {
-        e.preventDefault();
-        if (step < totalSteps) setStep(step + 1);
-        else if (onFinish) onFinish();
-    };
+  const handleNext = (e: React.MouseEvent<HTMLButtonElement>) => {
+    e.preventDefault();
+    if (step < totalSteps) setStep(step + 1);
+    else if (onFinish) onFinish();
+  };

-    const handlePrev = (e: React.MouseEvent<HTMLButtonElement>) => {
-        e.preventDefault();
-        if (step > 1) setStep(step - 1);
-    };
+  const handlePrev = (e: React.MouseEvent<HTMLButtonElement>) => {
+    e.preventDefault();
+    if (step > 1) setStep(step - 1);
+  };

-    return (
-        <section className="stepNavigator">
-            {children[step - 1]}
+  return (
+    <section className="stepNavigator">
+      {children[step - 1]}

-            <div className="absoluteButton">
-                {step > 1 && (
-                    <button
-                        onClick={handlePrev}
-                        className="button buttonSearch">
-                        Atrás
-                    </button>
-                )}
+      <div className="absoluteButton">
+        {step > 1 && (
+          <button onClick={handlePrev} className="button buttonSearch">
+            Atrás
+          </button>
+        )}

-                {step < totalSteps &&
-                    <button
-                        onClick={handleNext}
-                        className="button buttonSearch"
-                    >
-                        Siguiente
-                    </button>
-}
-            </div>
-        </section>
-    );
+        {step < totalSteps && (
+          <button onClick={handleNext} className="button buttonSearch">
+            Siguiente
+          </button>
+        )}
+      </div>
+    </section>
+  );
 }