как отдать Alert Controller css в ионные 4?

Question

Я хочу задать стиль контроллера предупреждений в ionic 4.Это мой демонстрационный код,

async presentalert() {
    const alert = await this.alertCtrl.create({
      header: '  DO YOU WANT TO CANCEL',
      message: 'DO YOU WANT TO CANCEL',
      cssClass: 'alertCancel',
      mode: 'ios',
      buttons: [
        {
          text: 'NO',
          role: 'cancel',
          cssClass: 'alertButton',
          handler: () => {
            console.log('Confirm Cancel');
          }
        }, {
          text: 'YES',
          cssClass: 'alertButton',
          handler: () => {
            console.log('Confirm Okay');
          }
        }
      ]
    })
    await alert.present();
  }

, и я попытался применить scss в global.scss

 .alertCancel{
    --background: red;
  }
  .alertButton {
     background-color: white !important;
  }

У меня естьпробовал все возможные способы, чтобы дать CSS в контроллере оповещений, но он не работает, поэтому, пожалуйста, помогите мне, я застрял здесь.

Answer 1

--background является переменной css компонента ion-alert, поэтому выполните следующие действия в variables.scss

ion-alert
{
 --background: red !important;
}

Для справки:

https://ionicframework.com/docs/theming/css-variables#ionic-variables

https://petercoding.com/2019/04/25/theming-your-app-in-ionic4/#css-custom-properties