This commit is contained in:
2026-07-01 15:28:02 -06:00
parent 9835ecfbb0
commit 7f9e7d1730
18 changed files with 1145 additions and 1065 deletions
+20 -34
View File
@@ -195,18 +195,15 @@
<div class="row justify-content-center align-items-center">
<div class="col-6">
<div class="card bg-white border-0 rounded-3 p-0 bx-shadow">
<div
class="p-3 pb-0 position-relative mb-3 w-100 animate__animated animate__flipInX text-center"
>
<div class="p-3 pb-0 position-relative mb-3 w-100 animate__animated animate__flipInX text-center">
<p class="mb-0">
El jabón que utilice para el lavado de manos de preferencia debe ser
<b class="text-lila-claro">líquido</b>, sin embargo, lo prioritario es que sea
exclusivo para cuando usted realice los recambios en casa.
<b class="text-lila-claro">líquido</b>, sin embargo, lo prioritario es que sea exclusivo para
cuando usted realice los recambios en casa.
</p>
<p>
<b class="text-lila-claro">Lo mismo ocurre con la toalla</b> que utilice para
secar sus manos.
<b class="text-lila-claro">Lo mismo ocurre con la toalla</b> que utilice para secar sus manos.
</p>
<p>
@@ -219,9 +216,7 @@
>
<p class="mb-0"><b>Veamos los pasos para un lavado de manos adecuado.</b></p>
</div>
<div
class="position-relative w-100 text-center animate__animated animate__zoomIn animate__delay-2s"
>
<div class="position-relative w-100 text-center animate__animated animate__zoomIn animate__delay-2s">
<div
class="btn-comenzar bg-primary d-inline-block px-3 py-2 text-center animate__animated animate__pulse animate__infinite"
>
@@ -251,7 +246,7 @@
<hr class="border border-2 border-verde-oscuro hr-style my-0 mb-3 opacity-100" />
</div>
</div>
<div class="col-11 mb-3 text-center">
<div class="col-11 mb-1 text-center">
<h4 class="fw-bold text-verde-pino">Lavado de manos: Técnica OMS</h4>
</div>
<div class="col-12 px-0 mb-3">
@@ -261,35 +256,32 @@
<div class="d-flex flex-row justify-content-center align-items-center gap-3">
<img src="img/book0.png" class="img-fluid" />
<p class="mb-0">
<strong>Instrucciones:</strong> Arrastre los pasos del lavado de manos para
colocarlos en el orden correcto.
<strong>Instrucciones:</strong> Arrastre los pasos del lavado de manos para colocarlos en el orden
correcto.
</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-12 mb-2 text-center">
<p class="small mb-0">"Estos son casos hipotéticos basados en las referencias bibliográficas."</p>
</div>
<div class="col-11">
<div class="row justify-content-center align-items-center">
<div class="col-12 anim1">
<div
class="d-flex flex-column w-100 position-relative gap-2 content-drags drag-list"
>
<div class="d-flex flex-column w-100 position-relative gap-2 content-drags drag-list">
<div class="drag-sortable" data-order="0">
<span class="drag-number"></span>
<span class="drag-icon">&#8597;</span>
Mójese las manos y aplique suficiente jabón para cubrir toda su superficie.
Frótelas entre sí.
Mójese las manos y aplique suficiente jabón para cubrir toda su superficie. Frótelas entre sí.
</div>
<div class="drag-sortable" data-order="1">
<span class="drag-number"></span>
<!-- MANO CON ANIMACIÓN -->
<span class="drag-hand-animate"
><i class="fa-duotone fa-solid fa-hand-pointer"></i
></span>
<span class="drag-hand-animate"><i class="fa-duotone fa-solid fa-hand-pointer"></i></span>
<span class="drag-icon">&#8597;</span>
Frótese la palma de la mano derecha contra el dorso de la mano izquierda
entrelazando los dedos.
Frótese la palma de la mano derecha contra el dorso de la mano izquierda entrelazando los dedos.
</div>
<div class="drag-sortable" data-order="2">
<span class="drag-number"></span>
@@ -304,14 +296,13 @@
<div class="drag-sortable" data-order="4">
<span class="drag-number"></span>
<span class="drag-icon">&#8597;</span>
Rodeando el pulgar izquierdo con la palma de la mano derecha frótese con un
movimiento de rotación y viceversa.
Rodeando el pulgar izquierdo con la palma de la mano derecha frótese con un movimiento de rotación y
viceversa.
</div>
<div class="drag-sortable" data-order="5">
<span class="drag-number"></span>
<span class="drag-icon">&#8597;</span>
Frótese la punta de los dedos de la mano derecha contra la palma de la mano
izquierda.
Frótese la punta de los dedos de la mano derecha contra la palma de la mano izquierda.
</div>
<div class="drag-sortable" data-order="6">
<span class="drag-number"></span>
@@ -352,10 +343,7 @@
<div class="col-12 text-center mb-3">
<h4 class="text-secondary fw-bold">Ha concluido la actividad.</h4>
</div>
<div
class="col-12 text-center col-reintentar animate__animated animate__zoomIn"
style="display: none"
>
<div class="col-12 text-center col-reintentar animate__animated animate__zoomIn" style="display: none">
<div
class="btn-reintentar rounded-3 bg-primary d-inline-block px-3 py-2 text-center animate__animated animate__pulse animate__infinite"
onclick="CourseNav.reload()"
@@ -476,9 +464,7 @@
}
function mostrarPopup(isCorrect) {
CourseNav.audioController.stopAllSoundsAndPlay(
isCorrect ? feedbackcorrect : feedbackincorrect
);
CourseNav.audioController.stopAllSoundsAndPlay(isCorrect ? feedbackcorrect : feedbackincorrect);
Swal.fire({
target: document.getElementById("wrap-course-content"),
imageUrl: isCorrect ? "img/good.png" : "img/bad.png",