From 158a2e33ff0bd53ba8ed7ea8f24b70e4fb48fcd3 Mon Sep 17 00:00:00 2001
From: Marcelo Puebla <mpuebla@focasoftware.com>
Date: Thu, 30 Jan 2020 12:05:20 -0300
Subject: [PATCH] Fix Modal confirmacion

---
 .../confirmacion/confirmacion.component.html       | 102 ++++++++++-----------
 .../shared/confirmacion/confirmacion.component.ts  |   2 +-
 2 files changed, 51 insertions(+), 53 deletions(-)

diff --git a/src/app/shared/confirmacion/confirmacion.component.html b/src/app/shared/confirmacion/confirmacion.component.html
index c7d018c..07b8976 100644
--- a/src/app/shared/confirmacion/confirmacion.component.html
+++ b/src/app/shared/confirmacion/confirmacion.component.html
@@ -1,60 +1,58 @@
-<div class="modal-header bg-primary rounded-top pt-4 px-2">
-  <img
-    draggable="false"
-    ondragstart="return false;"
-    (contextmenu)="false"
-    (click)="close()"
-    class="btn-effect icon-30 mt-2 mr-2 position-absolute right-0 top-0 z-index"
-    src="assets/img/icono-cancelar-blanco.svg">
-  <div class="row mx-0 w-100 justify-content-between">
-    <div class="col-8">
-      <p *ngIf="titleMessage" class="h3 text-white">{{titleMessage}}</p>
-    </div>
-  </div>
-  <div *ngIf="imagenPath" class="col-4 align-self-center">
+<div class="bg-primary rounded">
+  <div class="modal-header">
     <img
-    draggable="false"
-    ondragstart="return false;"
-    (contextmenu)="false"
-    src="{{urlImagenes}}{{imagenPath}}"
-    onerror="this.src='assets/img/imagen-no-encontrada.jpg'"
-    class="card-img-top img-fluid rounded-circle">
-  </div>
-</div>
-<div class=" col-12 modal-body bg-primary rounded-bottom pb-3 px-2">
-  <div class="row justify-content-between mx-0 w-100">
-    <div class="col-8">
-      <p *ngIf="footerMessageFirst" class="text-white"><small>{{footerMessageFirst}}</small></p >
-      <h1 *ngIf="footerMessageSecond" class="text-white mb-4">{{footerMessageSecond}}</h1>
+      draggable="false"
+      ondragstart="return false;"
+      (contextmenu)="false"
+      (click)="close()"
+      class="btn-effect icon-30 mt-2 mr-2 position-absolute right-0 top-0 z-index"
+      src="assets/img/icono-cancelar-blanco.svg">
+    <div class="row no-gutters w-100 justify-content-between">
+      <div class="col align-self-center">
+        <p *ngIf="titleMessage" class="h3 text-white">{{titleMessage}}</p>
+      </div>
+      <div *ngIf="imagenPath" class="col-4 px-3 pt-3 align-self-center">
+        <img
+          draggable="false"
+          ondragstart="return false;"
+          (contextmenu)="false"
+          src="{{urlImagenes}}{{imagenPath}}"
+          onerror="this.src='assets/img/imagen-no-encontrada.jpg'"
+          class="d-block mx-auto img-fluid rounded-circle">
+      </div>
     </div>
-    <div class="col-4">
-      <div
-        class="mx-0"
-        (click)="confirmarArticulo()">
-        <div class="col-auto bg-white badge-pill">
-          <div class="row justify-content-between">
-            <div *ngIf="footerConfirmation" class="col-auto px-0 align-self-center text-primary pl-3">
-              <p class="font-weight-bold">{{footerConfirmation | currency}}</p> 
-            </div>
-            <div class="col-auto px-0">
-              <img
-                draggable="false"
-                ondragstart="return false;"
-                (contextmenu)="false"
-                class="d-block ml-auto my-1 icon-30 pr-2"
-                src="assets/img/ir-color.svg">
-            </div>
+  </div>
+  <div class="modal-body">
+    <div class="row justify-content-between mx-0 w-100">
+      <div class="col-7 col-md-8 pl-0 align-self-center">
+        <p *ngIf="footerMessageFirst" class="text-white"><small>{{footerMessageFirst}}</small></p >
+        <p *ngIf="footerMessageSecond" class="h1 text-white">{{footerMessageSecond}}</p>
+      </div>
+      <div class="col-5 col-md-4 align-self-center">
+        <div
+          class="row justify-content-between bg-white badge-pill btn-effect"
+          *ngIf="footerConfirmation"
+          (click)="confirmar()">
+          <div class="col-auto px-0 align-self-center text-primary pl-3">
+            <p class="font-weight-bold">{{footerConfirmation | currency}}</p> 
+          </div>
+          <div class="col-auto px-0">
+            <img
+              draggable="false"
+              ondragstart="return false;"
+              (contextmenu)="false"
+              class="d-block ml-auto my-1 icon-20"
+              src="assets/img/ir-color.svg">
           </div>
         </div>
-      </div>
-      <div *ngIf="footerClose" class="bg-white badge-pill mt-2">
-        <div class="row justify-content-between">
-          <div
-            class="col-auto mx-0 "
-            (click)="close()">
-            <p class="font-weight-bold text-center text-primary">{{footerClose}}</p>
+        <div
+          *ngIf="footerClose"
+          class="row justify-content-center bg-white badge-pill btn-effect mt-2"
+          (click)="close()">
+          <div class="col-auto px-0 ml-auto">
+            <p class="font-weight-bold text-primary">{{footerClose}}</p>
           </div>
-          <i class="fas fa-undo-alt text-info mr-3 my-auto"></i>
+          <i class="fas fa-undo-alt text-info ml-auto my-auto"></i>
         </div>
       </div>
     </div>
diff --git a/src/app/shared/confirmacion/confirmacion.component.ts b/src/app/shared/confirmacion/confirmacion.component.ts
index 52464ce..211026a 100644
--- a/src/app/shared/confirmacion/confirmacion.component.ts
+++ b/src/app/shared/confirmacion/confirmacion.component.ts
@@ -29,7 +29,7 @@ export class ConfirmacionComponent implements OnInit {
   ngOnInit() {
   }
 
-  confirmarArticulo() {
+  confirmar() {
     this.onClose.next();
     this.modalRef.hide();
   }
-- 
1.9.1