Alert Controller - css button

Question

I am making an ionic app with version 3.20.0. I'm using alert controller and I add three button ,Annuler ,ok and Scan.

I want to place it like in the photo below:

my css code in ionic like that:

 .myalert .alert-wrapper {
        padding: 0;
        flex-wrap: wrap;

        input.alert-input:nth-child(1){
            flex: 0 0 60%;
            max-width: 80%;
        }
     button.alert-button:nth-child(1) {
        background-image:url('../assets/imgs/icon.png');
        background-repeat: no-repeat;
        background-position: center;
        max-width: 40%;
    }  
    }
    .myalert button.alert-button-group {
        flex: 0 0 50%;
        max-width: 50%;

    }

    .myalert .alert-button-group-vertical {
      flex-direction: row;
    }

and my script ionic to show alert is like that ,i need help to show it like photo below

     showPrompt() {
    this.donebtn = true;
    let prompt = this.alertCtrl.create({
      title: 'Espace Client',
      message: "Tapez votre code secret",
      cssClass: 'myalert',
      inputs: [{
        name: 'code',
        placeholder: 'Mot de passe',
        type: 'password',
      }, ],
      buttons: [{
        text: '',
        handler: data => {
          this.scannerCAB();
          let pass = this.votreCode;
          this.verifierclient(this.codeclient, pass);

          // console.log('Barcode data', this.votreCode);
          // let pass = data.code;
          //this.verifierclient(this.codeclient, pass);
        }
      },{
          text: 'Annuler ',
          handler: data => {

          }

        },

        {
          text: 'ok ',
          handler: data => {
            let pass = data.code;
            this.verifierclient(this.codeclient, pass);
          }
        },
      ]
    });
prompt.present({
    keyboardClose: false
  })
  .then(() => this.donebtn = false);

}

Answer 1

Since my answer was "Trivial" hence "converted to comment" here's a repost of my answer.

A bit late response. I tried to achieve this today, and I made it like this:

Create a css class in your app.scss and add that class in the alert option "cssClass".

app.scss

.yourClass{
  background-image: url(your-image-url);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;  
}

These css values can be changed per your requirements.

And in the Alert:

buttons: [
           {
             text: '',
             cssClass: 'yourClass',
             handler: data => {}
          }
        ]