aplicacion de cambios
This commit is contained in:
@@ -20,9 +20,8 @@
|
||||
.grid-custom {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
grid-template-rows: auto 1fr;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
@@ -41,24 +40,35 @@
|
||||
<div class="row justify-content-center justify-content-md-end">
|
||||
<div class="col-12 col-md-7">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-12 mb-3 text-center" data-sal="zoom-in">
|
||||
<div
|
||||
class="col-12 mb-3 text-center"
|
||||
data-sal="zoom-in"
|
||||
>
|
||||
<div class="d-inline-block position-relative">
|
||||
<hr class="m-0 mb-2 opacity-100 border-top-2 text-white">
|
||||
<h1 class="text-primary fw-bolder">¡Bienvenido a OGestan<sup>®</sup> Pré!</h1>
|
||||
<hr class="m-0 mt-2 opacity-100 border-top-2 text-white">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 text-center mb-3 mb-md-0" data-sal="flip-up">
|
||||
<div
|
||||
class="col-12 text-center mb-3 mb-md-0"
|
||||
data-sal="flip-up"
|
||||
>
|
||||
<div class="w-100 position-relative">
|
||||
<div id="wrap-comenzar"
|
||||
<div
|
||||
id="wrap-comenzar"
|
||||
data-sec="sec1"
|
||||
class="btn btn-begin text-white fw-bold animate__animated animate__pulse animate__infinite px-3 py-1">
|
||||
class="btn btn-begin text-white fw-bold animate__animated animate__pulse animate__infinite px-3 py-1"
|
||||
>
|
||||
Comenzar
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-7 text-center d-block d-md-none">
|
||||
<img src="img/01.0.png" class="img-fluid">
|
||||
<img
|
||||
src="img/01.0.png"
|
||||
class="img-fluid"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -67,16 +77,27 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="sec1" class="page-sco back1 py-3 py-md-4" style="display: none;">
|
||||
<div
|
||||
id="sec1"
|
||||
class="page-sco back1 py-3 py-md-4"
|
||||
style="display: none;"
|
||||
>
|
||||
<div class="grid-custom flex-fill">
|
||||
<div class="part0 w-100 d-flex flex-column justify-content-center h-100 align-items-center py-3 py-md-4" style="background-color: rgba(201, 124, 187, .5);">
|
||||
<div
|
||||
class="part0 w-100 d-flex flex-column justify-content-center h-100 align-items-center py-3 py-md-4"
|
||||
style="background-color: rgba(201, 124, 187, .5);"
|
||||
>
|
||||
<div class="container">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-12">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-12 col-md-10 col-lg-9" data-sal="slide-right">
|
||||
<div
|
||||
class="col-12 col-md-10 col-lg-9"
|
||||
data-sal="slide-right"
|
||||
>
|
||||
<div class="card bg-transparent border-0 rounded-0 shadow-none py-2 px-0 text-secondary">
|
||||
<p class="mb-0">Gracias por formar parte de esta sesión dedicada a <strong>OGestan<sup>® </sup>Pré</strong>, una herramienta esencial
|
||||
<p class="mb-0">Gracias por formar parte de esta sesión dedicada a <strong>OGestan<sup>®
|
||||
</sup>Pré</strong>, una herramienta esencial
|
||||
para acompañar a las mujeres en el momento más importante de su vida reproductiva.</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -85,20 +106,44 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="part1 w-100 d-flex flex-column justify-content-center align-items-center h-100">
|
||||
<div class="w-100 position-relative mt-3 img-sop animate__animated animate__zoomIn">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-12 text-center">
|
||||
<img
|
||||
src="img/03.8.png"
|
||||
class="img-fluid"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="part1 w-100 flex-column justify-content-center align-items-center h-100"
|
||||
style="flex: 1;display: none;"
|
||||
>
|
||||
<div class="container">
|
||||
<div class="row justify-content-center align-items-center">
|
||||
<div class="col-12">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-12 apa0" style="display: none;">
|
||||
<div class="col-12 apa0">
|
||||
<div class="row justify-content-center align-items-center">
|
||||
<div class="col-7 col-md-5 col-xl-4 text-center order-2 order-md-1" data-sal="zoom-in">
|
||||
<img src="img/01.1.png" class="img-fluid">
|
||||
<div
|
||||
class="col-7 col-md-5 col-xl-4 text-center order-2 order-md-1"
|
||||
data-sal="zoom-in"
|
||||
>
|
||||
<img
|
||||
src="img/01.1.png"
|
||||
class="img-fluid"
|
||||
>
|
||||
</div>
|
||||
<div class="col-12 col-md-7 col-xl-5 order-1 order-md-2 mb-3 mb-md-0" data-sal="flip-left">
|
||||
<div
|
||||
class="col-12 col-md-7 col-xl-5 order-1 order-md-2 mb-3 mb-md-0"
|
||||
data-sal="flip-left"
|
||||
>
|
||||
<h2 class="text-purple-1 fw-medium">¿Qué aprenderás hoy?</h2>
|
||||
<p class="mb-0">Al finalizar este módulo, <strong class="text-blue-1">podrás identificar y explicar</strong> los elementos fundamentales de
|
||||
OGestan<sup>®</sup> Pré, incluyendo qué es, a quién está dirigido, cuáles son sus beneficios y cómo se diferencia de
|
||||
<p class="mb-0">Al finalizar este módulo, <strong class="text-blue-1">podrás identificar y
|
||||
explicar</strong> los elementos fundamentales de
|
||||
OGestan<sup>®</sup> Pré, incluyendo qué es, a quién está dirigido, cuáles son sus
|
||||
beneficios y cómo se diferencia de
|
||||
la competencia, para comunicar su valor clínico y comercial de manera más efectiva.</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -117,12 +162,13 @@
|
||||
const audiom00 = CourseNav.createSound('audio/audiom00.mp3');
|
||||
const audiom01 = CourseNav.createSound('audio/audiom01.mp3');
|
||||
|
||||
audiom00.on('end',function(){
|
||||
audiom00.on('end', function () {
|
||||
CourseNav.audioController.stopAllSoundsAndPlay(audiom01);
|
||||
$('.apa0').show();
|
||||
$(".img-sop").hide();
|
||||
$('.part1').css("display", "flex");
|
||||
});
|
||||
|
||||
audiom01.on('end',function(){
|
||||
audiom01.on('end', function () {
|
||||
CourseNav.setSlideVisited();
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user