Merge branch 'main' of https://dev.e-360.com.mx/Besins/Ogestan_Drossagyn_Papilocare
This commit is contained in:
@@ -20,7 +20,6 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.shadow-vx {
|
.shadow-vx {
|
||||||
|
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -30,6 +29,11 @@
|
|||||||
|
|
||||||
.btn-arrow {
|
.btn-arrow {
|
||||||
max-width: 85px;
|
max-width: 85px;
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-arrow.visible {
|
||||||
|
display: inline-block !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media(min-width: 991px) {
|
@media(min-width: 991px) {
|
||||||
@@ -59,7 +63,6 @@
|
|||||||
padding-top: 70px !important;
|
padding-top: 70px !important;
|
||||||
margin-top: -50px !important;
|
margin-top: -50px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
<div
|
<div
|
||||||
id="sec0"
|
id="sec0"
|
||||||
@@ -190,23 +193,33 @@
|
|||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
<div class="position-relative shadow-vx flex-fill order-1 order-md-2 rounded-3">
|
<div class="position-relative shadow-vx flex-fill order-1 order-md-2 rounded-3">
|
||||||
<div class="card bg-green-2 border-0 rounded-3 shadow-none p-3 position-relative z-3" style="border-bottom-right-radius: 0 !important; border-bottom-left-radius: 0 !important;">
|
<div
|
||||||
|
class="card bg-green-2 border-0 rounded-3 shadow-none p-3 position-relative z-3"
|
||||||
|
style="border-bottom-right-radius: 0 !important; border-bottom-left-radius: 0 !important;"
|
||||||
|
>
|
||||||
<div class="row justify-content-center align-items-center">
|
<div class="row justify-content-center align-items-center">
|
||||||
<div class="col-12 col-md-7 col-xl-7 mb-3 mb-md-0">
|
<div class="col-12 col-md-7 col-xl-7 mb-3 mb-md-0">
|
||||||
<h1 class="fw-bold text-primary">OGestan<sup>®</sup> Plus</h1>
|
<h1 class="fw-bold text-primary">OGestan<sup>®</sup> Plus</h1>
|
||||||
<ol>
|
<ol>
|
||||||
<li><strong>Número</strong> de componentes <span class="fw-bold text-primary h3">19</span>.</li>
|
<li><strong>Número</strong> de componentes <span
|
||||||
|
class="fw-bold text-primary h3">19</span>.</li>
|
||||||
<li>Cantidad de <strong>Omega 3</strong> (DHA 250 mg, EPA 50 mg).</li>
|
<li>Cantidad de <strong>Omega 3</strong> (DHA 250 mg, EPA 50 mg).</li>
|
||||||
<li>Contenido de <strong>Vitamina D</strong> (10 mcg)</li>
|
<li>Contenido de <strong>Vitamina D</strong> (10 mcg)</li>
|
||||||
<li>Diferenciación del hierro (hierro <strong>bisglicinato</strong>).</li>
|
<li>Diferenciación del hierro (hierro <strong>bisglicinato</strong>).</li>
|
||||||
</ol>
|
</ol>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-7 col-md-4 text-center">
|
<div class="col-7 col-md-4 text-center">
|
||||||
<img src="img/06.8.png" class="img-fluid">
|
<img
|
||||||
|
src="img/06.8.png"
|
||||||
|
class="img-fluid"
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="swiper cid1 position-relative z-1" style="display:none;">
|
<div
|
||||||
|
class="swiper cid1 position-relative z-1"
|
||||||
|
style="display:none;"
|
||||||
|
>
|
||||||
<div class="swiper-wrapper">
|
<div class="swiper-wrapper">
|
||||||
<div class="swiper-slide">
|
<div class="swiper-slide">
|
||||||
<div class="card bg-var-2 card-competencia border-0 rounded-3 shadow-none p-3">
|
<div class="card bg-var-2 card-competencia border-0 rounded-3 shadow-none p-3">
|
||||||
@@ -217,7 +230,8 @@
|
|||||||
contiene hierro </strong><strong>bisglicinato</strong>
|
contiene hierro </strong><strong>bisglicinato</strong>
|
||||||
(solo sulfato ferroso), y un <strong>mínimo de Vitamina D.</strong></p>
|
(solo sulfato ferroso), y un <strong>mínimo de Vitamina D.</strong></p>
|
||||||
<div class="versus p-2 my-3">
|
<div class="versus p-2 my-3">
|
||||||
OGestan Plus <b>10 mg de vitamina D</b> <br> <em>vs</em> <br> Regenesis Max <span class="text-muted">INFORMACIÓN PENDIENTE</span>
|
OGestan Plus <b>10 mg de vitamina D</b> <br> <em>vs</em> <br> Regenesis Max
|
||||||
|
<span class="text-muted">INFORMACIÓN PENDIENTE</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-7 col-md-4 text-center">
|
<div class="col-7 col-md-4 text-center">
|
||||||
@@ -237,7 +251,8 @@
|
|||||||
<p class="mb-0">Destacar la <strong>menor cantidad de Omega 3 en
|
<p class="mb-0">Destacar la <strong>menor cantidad de Omega 3 en
|
||||||
</strong><strong>Previta</strong> <strong>Mom</strong><strong>.</strong></p>
|
</strong><strong>Previta</strong> <strong>Mom</strong><strong>.</strong></p>
|
||||||
<div class="versus p-2 my-3">
|
<div class="versus p-2 my-3">
|
||||||
OGestan Plus <b>DHA 250 mg, EPA 50 mg</b> <br> <em>vs</em> <br> Previta mom <span class="text-muted">DHA 146 mg, EPA 50 mg</span>
|
OGestan Plus <b>DHA 250 mg, EPA 50 mg</b> <br> <em>vs</em> <br> Previta mom
|
||||||
|
<span class="text-muted">DHA 146 mg, EPA 50 mg</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-7 col-md-4 text-center">
|
<div class="col-7 col-md-4 text-center">
|
||||||
@@ -257,7 +272,8 @@
|
|||||||
<p class="mb-0">Elevit 2 Omegas <strong>no cumple con las cantidades requeridas de
|
<p class="mb-0">Elevit 2 Omegas <strong>no cumple con las cantidades requeridas de
|
||||||
ácido fólico</strong>.</p>
|
ácido fólico</strong>.</p>
|
||||||
<div class="versus p-2 my-3">
|
<div class="versus p-2 my-3">
|
||||||
OGestan Plus <b>ácido fólico 400 mcg</b> <br> <em>vs</em> <br> Elevit 2 Omegas <span class="text-muted">ácido fólico 360 mcg</span>
|
OGestan Plus <b>ácido fólico 400 mcg</b> <br> <em>vs</em> <br> Elevit 2 Omegas
|
||||||
|
<span class="text-muted">ácido fólico 360 mcg</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-7 col-md-4 text-center">
|
<div class="col-7 col-md-4 text-center">
|
||||||
@@ -277,7 +293,9 @@
|
|||||||
<p class="mb-0">Materplus tiene <strong>una fórmula con menos
|
<p class="mb-0">Materplus tiene <strong>una fórmula con menos
|
||||||
elementos.</strong></p>
|
elementos.</strong></p>
|
||||||
<div class="versus p-2 my-3">
|
<div class="versus p-2 my-3">
|
||||||
OGestan Plus <b>19 componentes</b> <br> <em>vs</em> <br> Materplus <span class="text-muted">16 componentes</span>
|
OGestan Plus <b>19 componentes</b> <br> <em>vs</em> <br> Materplus <span
|
||||||
|
class="text-muted"
|
||||||
|
>16 componentes</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-7 col-md-4 text-center">
|
<div class="col-7 col-md-4 text-center">
|
||||||
@@ -379,6 +397,9 @@
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const totalCompetidores = 4;
|
||||||
|
const visitedSlides = new Set([0]);
|
||||||
|
|
||||||
const mySwiper = new Swiper(".cid1", {
|
const mySwiper = new Swiper(".cid1", {
|
||||||
effect: "slide",
|
effect: "slide",
|
||||||
autoHeight: true,
|
autoHeight: true,
|
||||||
@@ -389,33 +410,28 @@
|
|||||||
prevEl: '.btn-prev',
|
prevEl: '.btn-prev',
|
||||||
},
|
},
|
||||||
on: {
|
on: {
|
||||||
init: function () {
|
init: function () { },
|
||||||
// Ocultar prev en el primer slide
|
|
||||||
$('.btn-prev').css('opacity', '.5').addClass('disabled');
|
|
||||||
},
|
|
||||||
slideChange: function () {
|
slideChange: function () {
|
||||||
const activeIndex = this.activeIndex;
|
const activeIndex = this.activeIndex;
|
||||||
const slides = this.slides;
|
const slides = this.slides;
|
||||||
const totalSlides = this.slides.length;
|
const realTotal = $('.cid1 .swiper-slide').length;
|
||||||
|
|
||||||
// Controlar opacidad y clase disabled de botones
|
// Controlar opacidad y clase disabled de botones
|
||||||
if (activeIndex === 0) {
|
if (activeIndex === 0) {
|
||||||
$('.btn-prev').css('opacity', '.5').addClass('disabled');
|
$('.btn-prev').css('opacity', '.5').addClass('disabled');
|
||||||
} else {
|
} else {
|
||||||
$('.btn-prev').css('opacity', '1').removeClass('disabled');
|
$('.btn-prev').addClass('visible').css('opacity', '1').removeClass('disabled');
|
||||||
}
|
}
|
||||||
|
|
||||||
if (activeIndex === totalSlides - 1) {
|
if (activeIndex === realTotal - 1) {
|
||||||
$('.btn-next').css('opacity', '.5').addClass('disabled');
|
$('.btn-next').css('opacity', '.5').addClass('disabled');
|
||||||
} else {
|
} else {
|
||||||
$('.btn-next').css('opacity', '1').removeClass('disabled');
|
$('.btn-next').addClass('visible').css('opacity', '1').removeClass('disabled');
|
||||||
}
|
}
|
||||||
|
|
||||||
slides[activeIndex].classList.add("visited", "completed");
|
visitedSlides.add(activeIndex);
|
||||||
|
|
||||||
const completedSlides = $(".cid1 .swiper-slide.completed").length;
|
if (visitedSlides.size >= totalCompetidores) {
|
||||||
|
|
||||||
if (completedSlides == totalSlides) {
|
|
||||||
$('.btn-next').removeClass('animate__animated animate__pulse animate__infinite');
|
$('.btn-next').removeClass('animate__animated animate__pulse animate__infinite');
|
||||||
CourseNav.setSlideVisited();
|
CourseNav.setSlideVisited();
|
||||||
}
|
}
|
||||||
@@ -428,6 +444,10 @@
|
|||||||
audiom14.on('end', function () {
|
audiom14.on('end', function () {
|
||||||
$('.cid1').show();
|
$('.cid1').show();
|
||||||
mySwiper.update();
|
mySwiper.update();
|
||||||
|
$('.btn-next').addClass('visible');
|
||||||
|
if (visitedSlides.size >= totalCompetidores) {
|
||||||
|
CourseNav.setSlideVisited();
|
||||||
|
}
|
||||||
CourseNav.audioController.stopAllSoundsAndPlay(audios[0]);
|
CourseNav.audioController.stopAllSoundsAndPlay(audios[0]);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user