CIDWA/front-AT
12
0
Fork 0
Code Issues Pull Requests Actions Releases Wiki Activity

tring to fix styles problems

Browse Source
This commit is contained in:
IO420
2025-10-02 20:47:38 -06:00
parent 70dc03d6d6
commit f07954eef2
24 changed files with 362 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/Components/ActivosMantenimiento/Areas.tsx
+3 -4
View File
@@ -37,11 +37,10 @@ export default function Areas() {
return (
<form className="containerForm" onSubmit={handleActualizar}>
<label className="label">Áreas disponibles:</label>
<div className="groupInput" style={{display:"flex", flexDirection:"column"}}>
{/* Select de áreas */}
<label className="label">Áreas</label>
<div className="groupInput">
<select value={area} onChange={(e) => setArea(e.target.value)}>
<option value="">-- Áreas disponibles --</option>
<option value="">-- Áreas --</option>
<option value="PECERA">PECERA</option>
<option value="JAULA">JAULA</option>
<option value="HUACAL">HUACAL</option>
app/Components/ActivosMantenimiento/MesasDisponibles.tsx
+33
View File
@@ -0,0 +1,33 @@
import styles from "./Page.module.css";
export default async function MesasDisponibles() {
return (
<section className="containerSection">
<div className={styles.tableContainer}>
<table className={styles.machineTable}>
<thead>
<tr style={{fontSize:"15px"}}>
<th>Mesa</th>
<th>Activo</th>
</tr>
</thead>
<tbody>
{/* {machines.map((machine, index) => (
<tr key={index}>
<td>{machine.ubicacion}</td>
<td>{machine.nombre}</td>
<td>{machine.plataforma}</td>
<td>{machine.area}</td>
<td className={machine.disponible ? "disponible" : ""}>
{machine.disponible ? "si" : "no"}
</td>
</tr>
))} */}
</tbody>
</table>
</div>
</section>
);
}
//IO
app/Components/ActivosMantenimiento/Page.module.css
+70
View File
@@ -0,0 +1,70 @@
.tableContainer {
overflow-y: auto;
overflow-x: auto;
border-radius: 4px;
border: 1px solid #cfcfcf;
max-height: 430px;
scrollbar-color: rgb(1, 92, 184) rgba(0, 0, 0, 0);
background-color: #f9f9f9;
width: 100%;
}
.machineTable {
width: 100%;
border-collapse: collapse;
table-layout: auto;
}
.machineTable th,
.machineTable td {
padding: 10px;
text-align: center;
border-bottom: 1px solid #cfcfcf;
word-wrap: break-word;
overflow-wrap: break-word;
}
.machineTable th {
position: sticky;
top: 0px;
background-color: rgb(1, 92, 184);
color: white;
}
.machineTable tr {
min-width: 400px;
}
.disponible {
display: flex;
width: 100%;
height: 100%;
background-color: green;
color: green;
font-weight: bold;
}
.ocupado {
color: red;
font-weight: bold;
}
.actions {
text-align: center;
}
.resetButton {
padding: 8px 16px;
background-color: #ff4d4d;
color: white;
border: none;
border-radius: 6px;
cursor: pointer;
font-weight: bold;
transition: 0.3s;
}
.resetButton:hover {
background-color: #cc0000;
}
app/Components/BitacoraSanciones/BitacoraAlumno.tsx
+1 -1
View File
@@ -15,7 +15,7 @@ function BitacoraAlumno() {
return (
<>
<SearchDate />
<div className={styles.tableContainer}>
<div className={styles.tableContainer} style={{marginTop:"1rem"}}>
<table className={styles.machineTable}>
<thead>
<tr>
app/Components/BitacoraSanciones/BitacoraEquipo.tsx
+1 -1
View File
@@ -33,7 +33,7 @@ function BitacoraEquipo() {
</button>
</div>
</form>
<div className={styles.tableContainer}>
<div className={styles.tableContainer} style={{marginTop:"1rem"}}>
<table className={styles.machineTable}>
<thead>
<tr>
app/Components/BitacoraSanciones/BitacoraMesas.tsx
+1 -1
View File
@@ -18,7 +18,7 @@ function BitacoraMesas() {
return (
<>
<SearchDate />
<div className={styles.tableContainer}>
<div className={styles.tableContainer} style={{marginTop:"1rem"}}>
<table className={styles.machineTable}>
<thead>
<tr>
app/Components/BitacoraSanciones/Sanciones.tsx
+1 -1
View File
@@ -20,7 +20,7 @@ export default async function Sanciones(props: { student?: Student }) {
Nombre={props.student.nombre}
/>
<TableSancion />
<TableSancion />
</>
)}
</>
app/Components/BitacoraSanciones/TableSancion.tsx
+2 -3
View File
@@ -41,8 +41,7 @@ export default function TableSancion() {
return (
<>
<h1>{sanciones}</h1>
<div className={styles.tableContainer}>
<div className={styles.tableContainer} style={{margin:"1rem 0"}}>
<table className={styles.machineTable}>
<thead>
<tr>
@@ -65,7 +64,7 @@ export default function TableSancion() {
</select>
</div>
</form>
<button className="button buttonSearch" onClick={handlebutton}>
<button className="button buttonSearch" style={{margin:"1rem 0"}} onClick={handlebutton}>
Aplicar sanción
</button>
</>
app/Components/Equipos/Page.module.css
+70
View File
@@ -0,0 +1,70 @@
.tableContainer {
overflow-y: auto;
overflow-x: auto;
border-radius: 4px;
border: 1px solid #cfcfcf;
max-height: 430px;
scrollbar-color: rgb(1, 92, 184) rgba(0, 0, 0, 0);
background-color: #f9f9f9;
width: 100%;
}
.machineTable {
width: 100%;
border-collapse: collapse;
table-layout: auto;
}
.machineTable th,
.machineTable td {
padding: 10px;
text-align: center;
border-bottom: 1px solid #cfcfcf;
word-wrap: break-word;
overflow-wrap: break-word;
}
.machineTable th {
position: sticky;
top: 0px;
background-color: rgb(1, 92, 184);
color: white;
}
.machineTable tr {
min-width: 400px;
}
.disponible {
display: flex;
width: 100%;
height: 100%;
background-color: green;
color: green;
font-weight: bold;
}
.ocupado {
color: red;
font-weight: bold;
}
.actions {
text-align: center;
}
.resetButton {
padding: 8px 16px;
background-color: #ff4d4d;
color: white;
border: none;
border-radius: 6px;
cursor: pointer;
font-weight: bold;
transition: 0.3s;
}
.resetButton:hover {
background-color: #cc0000;
}
app/Components/Equipos/equipos.tsx
+1 -1
View File
@@ -74,7 +74,7 @@ export default function Equipos() {
<option value="4">mmmmm</option>
<option value="5">mmmmm</option>
</select>
<div className="containerButton">
<div className="containerButton" style={{marginTop:"1rem"}}>
<button className="button buttonSearch">Nuevo</button>
<button className="button buttonSearch">Editar</button>
</div>
app/Components/Equipos/tableequipos.tsx
+63
View File
@@ -0,0 +1,63 @@
import styles from "./Page.module.css";
export default async function TableEquipos() {
return (
<section className="containerSection">
<div className={styles.tableContainer}>
<table className={styles.machineTable}>
<thead>
<tr style={{fontSize:"15px"}}>
<th>Ubicación</th>
<th>Nombre</th>
<th>Plataforma</th>
<th>Área</th>
<th>Activo</th>
</tr>
<tr>
<th>
<select style={{ minWidth: "50px" }}>
<option style={{ minWidth: "50px" }}>pcnet1</option>
</select>
</th>
<th>
<select style={{ minWidth: "50px" }}>
<option style={{ minWidth: "50px" }}>mostrar todos</option>
</select>
</th>
<th>
<select style={{ minWidth: "50px" }}>
<option style={{ minWidth: "50px" }}>windows</option>
</select>
</th>
<th>
<select style={{ minWidth: "50px" }}>
<option style={{ minWidth: "50px" }}>mostrar Todo</option>
</select>
</th>
<th>
<select style={{ minWidth: "50px" }}>
<option style={{ minWidth: "50px" }}>si</option>
</select>
</th>
</tr>
</thead>
<tbody>
{/* {machines.map((machine, index) => (
<tr key={index}>
<td>{machine.ubicacion}</td>
<td>{machine.nombre}</td>
<td>{machine.plataforma}</td>
<td>{machine.area}</td>
<td className={machine.disponible ? "disponible" : ""}>
{machine.disponible ? "si" : "no"}
</td>
</tr>
))} */}
</tbody>
</table>
</div>
</section>
);
}
//IO
app/Components/EviarMensaje/EnviarMensaje.tsx
+4 -1
View File
@@ -51,6 +51,7 @@ const EnviarMensaje = ({ titulo, opciones }: EnviarMensajeProps) => {
</option>
))}
</select>
<input type="checkbox" style={{minWidth:"20px", width:"20px",maxWidth:"30px"}}/>
</div>
{/* Mensaje personalizado */}
@@ -62,10 +63,12 @@ const EnviarMensaje = ({ titulo, opciones }: EnviarMensajeProps) => {
onChange={(e) => setCustomMsg(e.target.value)}
placeholder="Escribe tu mensaje..."
/>
<input type="checkbox" style={{minWidth:"20px", width:"20px",maxWidth:"30px"}}/>
</div>
{/* Botón de enviar */}
<button className="button buttonSearch" type="submit">
<button className="button buttonSearch" type="submit" style={{marginTop:"1rem"}}>
Mandar mensaje
</button>
</form>
app/Components/QuitarSancion/Page.module.css
-1
View File
@@ -6,7 +6,6 @@
max-height: 430px;
scrollbar-color: rgb(1, 92, 184) rgba(0, 0, 0, 0);
background-color: #f9f9f9;
width: 65%;
}
.machineTable {
app/Components/QuitarSancion/QuitarSancion.tsx
+2 -2
View File
@@ -16,7 +16,7 @@ function QuitarSancion() {
const [quitarSanciones, SetQuitarSanciones] = useState<quitarSanciones[]>([]);
return (
<section className="containerSection">
<div className={styles.tableContainer}>
<div className={styles.tableContainer} style={{margin:"1rem 0"}}>
<table className={styles.machineTable}>
<thead>
<tr>
@@ -42,7 +42,7 @@ function QuitarSancion() {
</tbody>
</table>
</div>
<button className="button buttonSearch">Quitar Sanción</button>
<button className="button buttonSearch" style={{marginTop:"1rem"}}>Quitar Sanción</button>
</section>
);
}