forma-pago.component.html 3.12 KB
<div class="h-92 bg-white fade-in-left">
  <div class="row mx-0 h-20">
    <div class="col-12 px-0 h-80 my-auto">
      <img
        draggable="false"
        ondragstart="return false;"
        (contextmenu)="false"
        class="d-block mx-auto h-100"
        src="assets/img/logo-spot.svg">
    </div>
  </div>
  <div class="h-100">
    <div class="h-10"></div>
    <div class="row mt-5 mx-3 h-auto">
      <div class="col-12 px-0 py-2 align-self-center">
        <div class="px-3 text-center">
          <p class="h4 text-truncate">SELECCIONA UNA FORMA DE PAGO</p>
        </div>
      </div>
    </div>
    <!-- OPCION PAGO ELECTRONICO -->
    <div class="row mt-5 h-auto justify-content-center mx-0">
      <div class="col-5 px-0 h-auto align-self-start reduce-card-1">
        <div class="row justify-content-between">
          <div class="col-12">
            <div
              class="btn-effect col-auto align-self-center px-0 bg-white"
              (click)="medioPago(9)">
              <div class="row mx-0 bg-primary badge-pill heigth-80">
                <div class="col-2 p-0">
                  <img
                    draggable="false"
                    ondragstart="return false;"
                    (contextmenu)="false"
                    class="pt-3 pl-2 icon-50"
                    src="assets/img/icono-pago-electronico.svg">
                </div>
                <div class="col-8 align-self-center text-center text-white h4">Pago electrónico</div>
                <div class="col-1 align-self-center p-0">
                  <img
                    draggable="false"
                    ondragstart="return false;"
                    (contextmenu)="false"
                    class="p-1 icon-50"
                    src="assets/img/ir.svg">
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- OPCION PAGO CON TARJETA -->
    <div class="row mt-5 h-auto justify-content-center mx-0">
      <div class="col-5 px-0 h-auto align-self-start reduce-card-1">
        <div class="row justify-content-between">
          <div class="col-12">
            <div
              class="btn-effect col-auto align-self-center px-0 bg-white"
              (click)="medioPago(4)">
              <div class="row mx-0 bg-primary badge-pill heigth-80">
                <div class="col-2 p-0">
                  <img
                    draggable="false"
                    ondragstart="return false;"
                    (contextmenu)="false"
                    class="pt-4 pl-2 icon-50"
                    src="assets/img/icono-pago-tarjeta.svg">
                </div>
                <div class="col-8 align-self-center text-center text-white h4">Pago con tarjeta</div>
                <div class="col-2 align-self-center p-0">
                  <img
                    draggable="false"
                    ondragstart="return false;"
                    (contextmenu)="false"
                    class="p-1 icon-50"
                    src="assets/img/ir.svg">
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>