update

contenido/06.html

@@ -15,19 +15,19 @@
     width: 23%;
   }
 </style>
-<div class='page-sco py-2 py-md-4 h-100'>
-  <div class='container h-100'>
-    <div class='row justify-content-center align-items-center h-100'>
-      <div class='col-12'>
-        <div class='row justify-content-center'>
+<div class="page-sco py-2 py-md-4 h-100">
+  <div class="container h-100">
+    <div class="row justify-content-center align-items-center h-100">
+      <div class="col-12">
+        <div class="row justify-content-center">
           <div class="col-11 mb-2">
-            <h2 class="text-center fw-bold text-primary">¿Cómo funciona la diálisis peritoneal?</h2>
-            <hr class="border border-3 border-verde-oscuro hr-style mx-auto my-0">
+            <h2 class="text-center fw-bold text-primary">¿Cómo funciona la diálisis peritoneal?<sup class="fw-bold">1,2,4,6</sup></h2>
+            <hr class="border border-3 border-verde-oscuro hr-style mx-auto my-0" />
           </div>
           <div class="col-9 mb-3">
             <div class="card border-0 my-2 rounded bg-secondary shadow p-3 text-center">
               <div class="d-flex justify-content-center align-items-center flex-row">
-                <img src="img/2.1.png" class="img-fluid mx-3">
+                <img src="img/2.1.png" class="img-fluid mx-3" />
                 <p class="mb-0"><strong>Instrucciones:</strong> Arrastra los pasos del recambio para colocarlos en el orden correcto.</p>
               </div>
             </div>
@@ -47,8 +47,8 @@
 <div class="d-none">
   <div id="pop0">
     <div class="container-fluid">
-      <div class=" w-100 text-center">
-        <img src="img/3.5.png" class="img-fluid">
+      <div class="w-100 text-center">
+        <img src="img/3.5.png" class="img-fluid" />
       </div>
       <div class="row justify-content-center">
         <div class="col-12 text-center mb-2">
@@ -63,7 +63,7 @@
 </div>
 <script>
   $(function () {
-    "use strict";
+    'use strict';
     $('.wrap-course-content').addClass('fake');
 
     // Función para mezclar array (algoritmo Fisher-Yates)
@@ -141,30 +141,29 @@
       containment: '#activity1',
       cursor: 'grabbing',
       tolerance: 'pointer',
-      helper: "clone",
+      helper: 'clone',
       cursorAt: { top: 50, left: 50 },
       cancel: '.locked',
       update: function (event, ui) {
         // updateCardNumbers();
         if (checkOrder()) {
           $('#sortable-cards').sortable('disable');
-          const html = $("#pop0").html();
+          const html = $('#pop0').html();
           Swal.fire({
             html: html,
             target: document.getElementById('wrap-course-content'),
             customClass: {
               popup: 'pop_html_style border border-3 border-primary rounded-4',
-              confirmButton: 'btn text-white bg-primary amor fw-semibold animate__animated animate__pulse animate__infinite'
+              confirmButton: 'btn text-white bg-primary amor fw-semibold animate__animated animate__pulse animate__infinite',
             },
-            confirmButtonText: "Cerrar",
+            confirmButtonText: 'Cerrar',
             showConfirmButton: true,
             allowOutsideClick: false,
             allowEscapeKey: false,
             focusConfirm: false,
-            backdrop: "rgba(65, 60, 60, .95)",
-            width: "35em",
-            didOpen: () => {
-            },
+            backdrop: 'rgba(65, 60, 60, .95)',
+            width: '35em',
+            didOpen: () => {},
             didClose: () => {
               CourseNav.audioController.stopAudio();
               //CourseNav.soundClick();
@@ -199,7 +198,7 @@
       },
       stop: function (event, ui) {
         ui.item.removeClass('ui-sortable-helper');
-      }
+      },
     });
 
     // Hacer las tarjetas arrastrables