Alert controller text input field change design

Hi all, I need little bit design changes in alert controller text input filed. For, input field start with center.
My expected output mentioned in attachments. So, how to add styles in input field.

Tried way,
async presentPrompt(element) {

const alert = await this.alertController.create({

header: element.name,

cssClass: 'change_design',

inputs: [

  {

    name: 'quantity',

    placeholder: 'Enter Quantity',

    value: 1,

    type: 'number'

  },

],

buttons: [

  {

    text: 'Cancel',

    role: 'cancel',

    handler: data => {

    }

  },

  {

    text: 'Ok',

    handler: data => {

    }

  }

]

});

await alert.present();

}

And, SCSS looks like,

.change_design {

text-align: center !important;

}

The above styles not affect in UI. Please any one help me . Thanks in advance #ionic:ionic-v3 #ionic-v1

try to add css class in your input array

inputs: [

  {

    name: 'quantity',
    cssClass: 'change_design',
    placeholder: 'Enter Quantity',

    value: 1,

    type: 'number'

  },

],
1 Like

@saad-ansari Yeah it’s working. Thanks for your wonderful response.

1 Like