Ajustes de visualización

estrelicia · Nov 28, 2023 · 2cac843 · 2cac843
1 parent 4e672c5
commit 2cac843
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 26 deletions.
diff --git a/assets/css/estilos.css b/assets/css/estilos.css
@@ -259,6 +259,13 @@ button {
     font-size: 13px;
     font-weight: 500;
 }
+.videos-publicitarios {
+    display: flex;
+    justify-content: center;
+}
+iframe {
+    margin:5px 15px 25px 15px;
+}
 @media screen and (max-width:425px) {
 
     .brand-flex {

diff --git a/assets/js/validacion.js b/assets/js/validacion.js
@@ -1,27 +1,3 @@
-function validar() {
-  let cantidad = document.getElementById('cantidad').value;
-  let nombre = document.getElementById('nombre').value;
-  let apellido = document.getElementById('apellido').value;
-  let email = document.getElementById('email').value;
-
-  console.log(nombre);
-  if (nombre == '') {
-    document.getElementById('alerta-nombre').innerHTML = 'El nombre no puede estar vacío';
-  }
-  if (apellido == '') {
-    document.getElementById('alerta-apellido').innerHTML = 'El apellido no puede estar vacío';
-  }
-  if (email == '') {
-    document.getElementById('alerta-email').innerHTML =
-      'El correo electrónico no puede estar vacío';
-  }
-
-  if (cantidad < 1) {
-    document.getElementById('alerta-cantidad').innerHTML = 'La cantidad debe ser mayor a 0';
-    return false;
-  }
-}
-
 function resultado() {
   limpiar();
   validar();
@@ -49,6 +25,32 @@ function calculo() {
   document.getElementById('resultado').innerHTML = resultado;
 }
 
+function validar() {
+    let cantidad = document.getElementById('cantidad').value;
+    let nombre = document.getElementById('nombre').value;
+    let apellido = document.getElementById('apellido').value;
+    let email = document.getElementById('email').value;
+
+    console.log(nombre);
+    if (nombre == '') {
+      document.getElementById('alerta-nombre').innerHTML = 'El nombre no puede estar vacío';
+    } 
+    if (apellido == '') {
+      document.getElementById('alerta-apellido').innerHTML = 'El apellido no puede estar vacío';
+    } 
+    if (email == '') {
+      document.getElementById('alerta-email').innerHTML =
+        'El correo electrónico no puede estar vacío';
+    } 
+    if (cantidad < 1) {
+      document.getElementById('alerta-cantidad').innerHTML = 'La cantidad debe ser mayor a 0';
+    } 
+   /* if (nombre != '' && email != '' && apellido != '' && cantidad >= 1) {
+        document.getElementById('alerta-cantidad').innerHTML = 'La cantidad debe ser mayor a 0';
+      } */
+
+  }
+
 function limpiar() {
   const x = document.getElementsByTagName('input');
   for (let i = 0; i < x.length; i++) {
@@ -68,7 +70,6 @@ function borrar() {
   const x = document.getElementsByTagName('input');
   for (let i = 0; i < x.length; i++) {
     document.getElementsByTagName('input')[i].value="";
-
   }
   document.getElementById('resultado').innerHTML = 0;
   document.getElementById('alerta-nombre').innerHTML = '';

diff --git a/index.html b/index.html
@@ -167,7 +167,22 @@ <h2><span class="texto-superior-h2">CONVIÉRTETE EN UN</span><br>
             </div>
         </section>
     </main>
-    <aside>
+    <aside class="publicidad">
+        <h2>Publicidad</h2>
+        <div class="videos-publicitarios">
+            <iframe width="300" src="https://www.youtube.com/embed/ptXiQwE535s?controls=0" title="YouTube video player"
+                frameborder="0"
+                allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+                allowfullscreen></iframe>
+            <iframe width="300" src="https://www.youtube.com/embed/W-z0iTXEarw?controls=0" title="YouTube video player"
+                frameborder="0"
+                allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+                allowfullscreen></iframe>
+            <iframe width="300" src="https://www.youtube.com/embed/KAY1j-MPpyA" title="YouTube video player"
+                frameborder="0"
+                allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+                allowfullscreen></iframe>
+        </div>
     </aside>
     <footer class="container-fluid seccion5">
         <div class="row">