Estandard

This commit is contained in:
Your Name
2025-01-23 15:23:18 -06:00
parent 004562fd74
commit 1d68651576
2 changed files with 43 additions and 21 deletions

View File

@@ -262,15 +262,20 @@
:class="{ 'table-warning': registro.reposicion_id }"> :class="{ 'table-warning': registro.reposicion_id }">
<td class="text-center align-middle px-2">{{ registro.registro_fecha_ideal }} <td class="text-center align-middle px-2">{{ registro.registro_fecha_ideal }}
</td> </td>
<td class="text-center align-middle px-2">{{ registro.salon }}</td> <td class="text-center align-middle px-2">{{
<td class="align-middle px-2"> `${registro.salon?.slice(0,15)}${registro.salon?.length > 15 ? '...' : ''}` }}</td>
<td class="align-middle px-2 d-flex justify-content-center">
<div class="w-75 d-flex justify-content-between" style="font-size: 1.2rem">
<span>
<strong>{{ registro.profesor_clave }}</strong> <strong>{{ registro.profesor_clave }}</strong>
{{ registro.profesor_nombre }} {{ registro.profesor_nombre }}
<button type="button" class="ml-3 btn btn-sm btn-outline-primary" </span>
<a class="ml-3 text-info" style="cursor: pointer; font-size: 1.5rem;"
@click="store.current.clase_vista = registro; detalle.obtener_detalle(registro.horario_id, registro.profesor_id, registro.registro_fecha_ideal)" @click="store.current.clase_vista = registro; detalle.obtener_detalle(registro.horario_id, registro.profesor_id, registro.registro_fecha_ideal)"
data-toggle="modal" data-target="#ver-detalle"> data-toggle="modal" data-target="#ver-detalle">
<i class="ing-ojo"></i> detalle <i class="ing-ojo"></i>
</button> </a>
</div>
</td> </td>
@@ -315,7 +320,7 @@
<strong class="badge border border-primary">Observaciones:</strong> <strong class="badge border border-primary">Observaciones:</strong>
<small class="text-truncate">{{`${registro.comentario?.slice(0,25)} <small class="text-truncate">{{`${registro.comentario?.slice(0,25)}
${registro.comentario.length ${registro.comentario.length
> 10 ? '...' : ''}`}}</small> > 25 ? '...' : ''}`}}</small>
</div> </div>
</div> </div>
</td> </td>
@@ -392,6 +397,11 @@
<div class="modal-dialog modal-dialog-centered modal-xl" v-if="clase_vista"> <div class="modal-dialog modal-dialog-centered modal-xl" v-if="clase_vista">
<div class="modal-content"> <div class="modal-content">
<div class="modal-body detalle"> <div class="modal-body detalle">
<nav style="cursor: pointer;" class="modal-close pe-auto"
@click="$('#ver-detalle').modal('hide');">
<i class="ing-cancelar text-danger"></i>
</nav>
<section class="profesor"> <section class="profesor">
<img class="profesor-icon" src="fonts/svg/portrait.svg" alt="profesor"> <img class="profesor-icon" src="fonts/svg/portrait.svg" alt="profesor">
<div> <div>
@@ -431,7 +441,8 @@
</div> </div>
<div class="pp-card" style="grid-row: span 8"> <div class="pp-card" style="grid-row: span 8">
<div class="bg-primary text-white">{{clase_vista.carrera}}</div> <div class="bg-primary text-white">{{clase_vista.carrera}}</div>
<main class="horario_clase d-flex flex-column justify-content-center px-4" style="gap: .5rem;"> <main class="horario_clase d-flex flex-column justify-content-center px-4"
style="gap: .5rem;">
<span class="materia_nombre">{{clase_vista.materia}}</span> <span class="materia_nombre">{{clase_vista.materia}}</span>
<span class="horario text-dark mb-2"> <span class="horario text-dark mb-2">
<section class="la-salle-regular"> <section class="la-salle-regular">

View File

@@ -38,7 +38,8 @@
fill: #001d68; fill: #001d68;
} }
.profesor-nombre, .materia_nombre { .profesor-nombre,
.materia_nombre {
font-size: 1.5rem; font-size: 1.5rem;
font-weight: 900; font-weight: 900;
font-family: 'La Salle Display Regular'; font-family: 'La Salle Display Regular';
@@ -81,16 +82,19 @@
background-color: #969696; background-color: #969696;
} }
.detalle > main { .detalle>main {
display: grid; display: grid;
gap: 2rem; gap: 2rem;
grid-template-columns: repeat(2, 1fr); grid-template-columns: repeat(2, 1fr);
} }
/* Media query for mobile devices */ /* Media query for mobile devices */
@media (max-width: 768px) { /* Adjust the max-width as needed for your target screen size */ @media (max-width: 768px) {
.detalle > main {
grid-template-columns: 1fr; /* Single column */ /* Adjust the max-width as needed for your target screen size */
.detalle>main {
grid-template-columns: 1fr;
/* Single column */
} }
} }
@@ -111,7 +115,7 @@
padding: 1rem; padding: 1rem;
} }
.pp-card > div { .pp-card>div {
border-start-start-radius: 1rem; border-start-start-radius: 1rem;
border-start-end-radius: 1rem; border-start-end-radius: 1rem;
padding-inline: 1.5rem; padding-inline: 1.5rem;
@@ -173,12 +177,19 @@
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
} }
.modal-close {
position: absolute;
top: 0;
right: 0;
margin: 2rem;
}
.facultad { .facultad {
font-family: 'La Salle Display Heavy'; font-family: 'La Salle Display Regular';
font-size: 1.4rem; font-size: 1.4rem;
color: #969696; color: #969696;
position: absolute; position: absolute;
bottom: 0; bottom: 0;
right: 0; right: 0;
margin: 1rem; margin: 2rem;
} }