fixed style

This commit is contained in:
2025-10-31 20:26:32 -06:00
parent 9e80880ed3
commit 1c6c68de6a
8 changed files with 94 additions and 65 deletions
+24 -38
View File
@@ -1,9 +1,9 @@
.pestaña {
position: absolute;
top: 50%;
left: 62%;
left: 62%;
transform: translate(-50%, -50%);
display: flex;
justify-content: space-around; /* espacio igual entre los tres textos */
align-items: center;
@@ -25,17 +25,17 @@
color: #b8870b; /* cambia de color al pasar el cursor */
}
.titulo-reporte{
font-weight: bold; /* negrita */
font-size: 24px; /* tamaño de texto */
.titulo-reporte {
font-weight: bold; /* negrita */
font-size: 24px; /* tamaño de texto */
font-family: Arial, sans-serif;
}
/*BUSCADOR*/
input[type="text"] {
width: 500px; /* más ancho, más largo */
padding: 7px; /* mantiene espacio cómodo dentro */
width: 500px; /* más ancho, más largo */
padding: 7px; /* mantiene espacio cómodo dentro */
font-size: 18px;
border: 1px solid #ccc;
border-radius: 4px;
@@ -54,33 +54,20 @@ button {
button:hover {
background-color: #0056b3;
}
.contenedor{
.contenedor {
margin-left: 80px;
}
.filtro-rec{
.filtro-rec {
border: 2px solid #003366; /* Color del borde */
border-radius: 10px; /* Bordes redondeados */
padding: 10px; /* Espacio interno */
margin: 80px 550px; /* Separación del resto del contenido */
background-color: #f9f9f9;
border-radius: 10px; /* Bordes redondeados */
padding: 10px; /* Espacio interno */
margin: 80px 550px; /* Separación del resto del contenido */
background-color: #f9f9f9;
position: relative;
left: 380px;
left: 380px;
font-family: Arial, sans-serif;
top: -570px; /* sube 50px respecto a su posición original */
}
/* Estilos para los selects */
select {
padding: 8px 12px;
border: 1px solid #003366;
border-radius: 5px;
background-color: white;
font-size: 14px;
width: 100%;
margin-bottom: 10px;
}
select:focus {
@@ -94,7 +81,6 @@ form[action="/buscar"] {
display: flex;
gap: 10px;
margin: 20px 0;
}
form[action="/buscar"] input {
@@ -116,8 +102,8 @@ form[action="/buscar"] button {
.botones-filtro {
display: flex;
justify-content: flex-end; /* botones a la derecha */
gap: 10px; /* espacio entre botones */
margin-top: 15px; /* separación del resto del formulario */
gap: 10px; /* espacio entre botones */
margin-top: 15px; /* separación del resto del formulario */
}
.aplicar {
@@ -140,17 +126,17 @@ form[action="/buscar"] button {
font-size: 14px;
}
.tabla-rec{
.tabla-rec {
border: 2px solid #003366; /* Color del borde */
border-radius: 10px; /* Bordes redondeados */
padding: 10px; /* Espacio interno */
margin: 50px 700px 0 80px; /* superior, derecha, inferior, izquierda */
background-color: #f9f9f9;
border-radius: 10px; /* Bordes redondeados */
padding: 10px; /* Espacio interno */
margin: 50px 700px 0 80px; /* superior, derecha, inferior, izquierda */
background-color: #f9f9f9;
font-family: Arial, sans-serif;
height: 400px;
height: 400px;
}
.boton-descargar{
.boton-descargar {
padding: 8px 12px;
font-size: 16px;
border: none;
@@ -160,4 +146,4 @@ form[action="/buscar"] button {
cursor: pointer;
right: 30px;
margin-left: 700px;
}
}
+17 -5
View File
@@ -69,16 +69,28 @@ label {
display: block;
text-align: start;
width: 100%;
margin-bottom: 5px;
font-weight: bold;
color: #333;
font-size: 14px;
}
img {
object-fit: cover;
}
label {
display: block;
margin-bottom: 5px;
font-weight: bold;
select {
color: #333;
font-size: 14px;
width: 100%;
display: block;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
padding: 8px 12px;
border: 1px solid #ccc;
border-radius: 8px;
background-color: white;
background-position: right 10px center;
background-repeat: no-repeat;
background-size: 12px;
}
+5 -7
View File
@@ -19,7 +19,6 @@
.barNavigation li {
transition: all 0.3s ease;
cursor: pointer;
color: white;
width: auto;
transition: background-color 0.3s ease;
font-size: 1.5rem;
@@ -96,7 +95,6 @@
display: flex;
justify-content: center;
align-items: center;
color: white;
width: 100%;
height: 100%;
font-size: 1.5rem;
@@ -111,7 +109,7 @@
border-radius: 6px;
cursor: pointer;
font-weight: bold;
font-size: 1.5rem;
font-size: 2rem;
display: flex;
align-items: center;
justify-content: center;
@@ -140,7 +138,7 @@
.barNavigation ul {
position: absolute;
background-color: #003e79;
background-color: #f4f5f7;
flex-direction: column;
padding: 10px 0;
align-items: center;
@@ -158,7 +156,7 @@
.barNavigation li:hover {
background-color: #d59f0f;
color: white;
color: black;
border-radius: 0;
border: none;
}
@@ -172,7 +170,7 @@
.logout-button {
margin-top: 10px;
font-size: 1rem;
font-size: 1.75rem;
padding: 6px 12px;
max-width: 180px;
}
@@ -183,6 +181,6 @@
}
.subMenu a span {
color: #fff;
color: black;
}
}
+25 -6
View File
@@ -9,13 +9,12 @@
.innerContainer {
max-width: 1000px;
width: 1000px;
width: 100%;
margin: 0 auto;
padding: 20px;
padding: 1rem 2rem;
}
h2 {
margin-top: 1rem;
text-align: center;
color: #0056b3;
margin-bottom: 20px;
@@ -25,7 +24,7 @@
.equipoForm {
display: flex;
gap: 30px;
gap: 1.5rem;
.column {
flex: 1;
@@ -88,7 +87,7 @@ textarea {
height: 100%;
.btnGuardar {
background-color: #ffb700;
color: #0056b3;
color: #ffffff;
border: none;
padding: 10px 20px;
border-radius: 6px;
@@ -117,8 +116,28 @@ textarea {
}
}
@media (max-width: 1075px) {
.equipoForm {
flex-wrap: wrap;
max-width: 100%;
.column {
flex: 1 1 calc(50% - 15px);
min-width: 250px;
.formGroup {
input,
select {
width: 100%;
font-size: 16px;
}
}
}
}
}
/* Responsive: en móvil, una columna */
@media (max-width: 768px) {
@media (max-width: 600px) {
.agregarEquipoContainer .innerContainer {
padding: 15px;
max-width: 90vw;
+14 -5
View File
@@ -180,13 +180,23 @@ export default function Page() {
<form className="equipoForm">
{/* Columna Izquierda */}
<div className="column">
<div className="formGroup">
<label>Numero de Inventario</label>
<input
required
type="text"
placeholder="Ingresa Inventario"
value={formData.serie}
onChange={(e) => handleInputChange("serie", e.target.value)}
/>
</div>
<div className="formGroup">
<label>Serie</label>
<input
required
type="text"
placeholder="Ingresa serie"
value={formData.serie}
value={""}
onChange={(e) => handleInputChange("serie", e.target.value)}
/>
</div>
@@ -234,7 +244,9 @@ export default function Page() {
))}
</select>
</div>
</div>
<div className="column">
<div className="formGroup">
<label>Estado</label>
<select
@@ -250,10 +262,7 @@ export default function Page() {
))}
</select>
</div>
</div>
{/* Columna Centro */}
<div className="column">
<div className="formGroup">
<label>Tipo de uso</label>
<select
@@ -316,7 +325,7 @@ export default function Page() {
<input
required
type="text"
placeholder="Selecciona adscripción"
placeholder="Escribe la adscripcion"
value={formData.adscripcion}
onChange={(e) =>
handleInputChange("adscripcion", e.target.value)
+2 -2
View File
@@ -33,8 +33,8 @@ export default function BarcodeScanner({ onScan }: BarcodeScannerProps) {
type: "LiveStream",
target: scannerRef.current,
constraints: {
width: 640,
height: 370,
width: 300,
height: 500,
facingMode: "environment",
},
},
+6 -1
View File
@@ -347,7 +347,12 @@ export default function Editar() {
<div className="formGroup">
<label>Responsable</label>
<input type="text" value={formData.responsable} disabled />
<input
type="text"
value={formData.responsable}
disabled
placeholder="Selecciona una Adscripcion"
/>
</div>
</div>
+1 -1
View File
@@ -13,6 +13,6 @@ export function middleware(request: NextRequest) {
}
export const config = {
matcher: ["/AgregarEquipo", "/Escaner"],
matcher: [],
};
//IO