new structure

2025-09-12 13:17:01 -04:00
parent 5ca821d0bc
commit e0a1058231
36 changed files with 175 additions and 59 deletions
@@ -0,0 +1,56 @@
+"use client";
+import { useState } from "react";
+import SearchUser from "../../Components/SearchUser/searchUser";
+import styleprograms from "./programas.module.css";
+
+export default function Page() {
+  const [Editar, setEditar] = useState(true);
+
+  const handleEditar = () => {
+    setEditar(false);
+  };
+
+  return (
+    <>
+      {Editar ? (
+        <section className="containersection">
+          <h3 className="title"> ID </h3>
+          <label className="label">Programas</label>
+          <input
+            type="text"
+            //value={user}
+            //onChange={(e) => setUser(e.target.value)}
+            placeholder="Coloca "
+          />
+          <div className="margin">
+            <button className="button buttonSearch" onClick={handleEditar}>
+              Editar
+            </button>
+            <button className={`button buttonSearch ${styleprograms.button}`}>
+              Nuevo
+            </button>
+          </div>
+        </section>
+      ) : (
+        <section className="containersection">
+          <div>ID</div>
+          <h2 className="title"> PROGRAMAS </h2>
+          <label className="label">Programas</label>
+          <input
+            type="text"
+            //value={user}
+            //onChange={(e) => setUser(e.target.value)}
+            placeholder="Coloca "
+          />
+          <div className="margin">
+            <button className="button buttonSearch">Insertar</button>
+
+            <button className={`button buttonSearch ${styleprograms.button}`}>
+              Cancelar
+            </button>
+          </div>
+        </section>
+      )}
+    </>
+  );
+}
@@ -0,0 +1,13 @@
+.containersection {
+  width: 100%; /* Que use todo el ancho */
+  display: block; /* Evita que Flex/Grid lo centre */
+  text-align: left; /* Alinea el texto e inputs a la izquierda */
+  margin: 20px 0 0 20px; /* Espacio arriba y a la izquierda */
+}
+.margin {
+  margin: 10px 10px;
+}
+.button {
+  margin-left: 20px;
+  margin-top: 20px;
+}