cancelar-compra.component.html 2.59 KB
<div class="container-fluid p-0 background-image">
  <div class="row m-0">
    <div class="col p-0">
      <div class="vh-100 fade-in d-flex align-content-strech flex-wrap disable-user-select">

        <!-- HEADER -->
        <div class="row m-0 w-100 bg-primary-gradient-horizontal">
          <div class="col-6 bg-white rounded-bottom-right">
            <div class="row h-100">
              <div class="col d-flex align-items-center">
                <img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logoaxion.png">
              </div>
            </div>
          </div>
        </div>

        <!-- INFO -->
        <div class="row m-0 w-100">
          <div class="col-4 offset-2">
            <div class="row h-100">
              <div class="col-12 py-4">
                <div class="card h-100 rounded">
                  <img src="{{apiUrl}}/imagenes/atencion.svg" class="w-50 mx-auto mt-auto mb-4">
                  <div class="mb-auto mt-4">
                    <p class="display-3 card-text text-center font-weight-bold">
                      Atención
                    </p>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="col-6 text-center text-white my-auto">
            <p class="display-3 font-weight-bold mb-5">
              Usted esta a punto<br>de cancelar su compra
            </p>
            <p class="display-4 m-0">
              Perderá los datos y<br>productos ya ingresados
            </p>
            <div class="d-flex justify-content-center mt-2">
              <button
                type="button"
                class="btn btn-lg btn-light shadow mr-4"
                (click)="volverPreviousPage()">
                <span class="pr-2">Volver a mi compra</span>
                <i class="fa fa-undo text-warning"></i>
              </button>
              <button
                type="button"
                class="btn btn-lg btn-light shadow ml-4"
                (click)="limpiarCarritoYvolver()">
                <span class="pr-2">Si, terminar</span>
                <i class="fa fa-times text-danger"></i>
              </button>
            </div>
          </div>
        </div>

        <!-- FOOTER -->
        <div class="row m-0 w-100 bg-gray">
          <div class="col-6 bg-white offset-6 rounded-top-left">
            <div class="row h-100">
              <div class="col d-flex align-items-center">
                <img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logodebo.png">
              </div>
            </div>
          </div>
        </div>

      </div>
    </div>
  </div>
</div>