fix: arreglar afectos visuales

This commit is contained in:
christian.julian 2025-06-15 18:52:49 -06:00
parent de0d0f1477
commit 6cc55397cd
1 changed files with 106 additions and 0 deletions

View File

@ -324,6 +324,12 @@ main .title {
font-weight: 600; font-weight: 600;
margin-bottom: 10px; margin-bottom: 10px;
} }
main .subtitle {
font-size: 22px;
margin-top: 20px;
}
main .breadcrumbs { main .breadcrumbs {
display: flex; display: flex;
grid-gap: 6px; grid-gap: 6px;
@ -581,3 +587,103 @@ main .btn-send:hover {
} }
/* Transición base para todos */
select,
input[type="date"],
button {
transition: all 0.3s ease;
}
/* Selects e inputs de fecha */
select#id_rango_edad,
select#id_genero,
select#id_examen,
input[type="date"] {
width: 100%;
padding: 8px 12px;
border: 1px solid #ccc;
border-radius: 6px;
font-size: 14px;
background-color: #fff;
color: #333;
font-family: inherit;
box-shadow: 0 0 0 0 rgba(53, 36, 91, 0); /* Inicial */
}
select#id_rango_edad:focus,
select#id_genero:focus,
select#id_examen:focus,
input[type="date"]:focus {
border-color: #35245b;
outline: none;
box-shadow: 0 0 8px 2px rgba(53, 36, 91, 0.2);
}
/* Botones */
button#buscar,
button#limpiar,
button#limpiar2 {
padding: 8px 20px;
font-size: 14px;
border: 1px solid #35245b;
border-radius: 6px;
background-color: #fff;
color: #35245b;
cursor: pointer;
font-family: inherit;
margin-top: 10px;
margin-right: 10px;
position: relative;
overflow: hidden;
}
button#buscar:hover,
button#limpiar:hover,
button#limpiar2:hover {
background-color: #35245b;
color: white;
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(53, 36, 91, 0.2);
}
/* Efecto de "pulse" al hacer clic */
button#buscar:active,
button#limpiar:active,
button#limpiar2:active {
transform: scale(0.98);
box-shadow: 0 2px 6px rgba(53, 36, 91, 0.15);
}
.fechas-wrapper {
display: flex;
flex-wrap: wrap;
gap: 20px;
margin: 10px 0 20px;
}
.fecha-item {
flex: 1;
min-width: 220px;
}
.fecha-item label {
display: block;
margin-bottom: 5px;
font-weight: 500;
}
.fecha-item input[type="date"] {
width: 100%;
padding: 8px 12px;
border: 1px solid #ccc;
border-radius: 6px;
font-size: 14px;
font-family: inherit;
transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.fecha-item input[type="date"]:focus {
border-color: #35245b;
box-shadow: 0 0 8px 2px rgba(53, 36, 91, 0.2);
outline: none;
}