在 ionic 2 中更改警报控制器的样式和文本修改

Question

实际上我的警报控制器“标题”太长了，所以我想调整文本的大小，然后我添加了 Css 类，然后尝试通过为其提供字体大小来更改 SASS 中的样式，不幸的是没有用，按钮文本是大写。那么无论如何要更改文本的字体大小，按钮颜色和大小并将按钮文本更改为小写？

我的打字稿文件

import { IonicPage,AlertController} from 'ionic-angular';
import { Component,ViewChild } from '@angular/core';
import 'rxjs/add/operator/toPromise';

@IonicPage()
@Component({
  selector: 'page-kpi',
  templateUrl: 'kpi.html',
})
export class KpiPage {

  @ViewChild(Nav) nav: Nav;
  temp2:any;
  lastUpdate:any;

 constructor(
    private alertCtrl: AlertController,
    public menuCtrl : MenuController,


   ) {
      this.platform.ready().then(() => {

              this.refreshbutton();

      }
    });


refreshbutton(){

    this.getSession();

  if(this.offline == true)
    {
       this.offlineRefreshAlert();
    }  
   else{
    let alert = this.alertCtrl.create({
            title: 'Do you really want to refresh the widgets?',
            message: 'Refresh process will take time to complete.',
            cssClass: 'alertLogCss',
            buttons: [
              {
                text: 'Cancel',
                role: 'cancel',
                handler: () => {
                  alert = null;
                }
              },
              {
                text: 'Refresh now',
                 handler: () => {
                   if(this.online == true){
                      this.refreshdata(this.result.sid);
                      this.loadingrefreshdashboard();
                   }
                   if(this.offline == true){

                      this.offlineRefreshAlert();
                   }



                 }
               }
            ]
          });
          alert.present();
        }
    }

}

我的 SASS(CSS) 文件

.alertLogCss{
  background-color: white;
  color: red;
  font-size: 4px;
  button{
      color: red;
      font-size: 5px;
  }
}

Answer 1

你必须从那个页面的 scss 块中添加 css

.alertLogCss{
    background-color: white;
    color: red;
    font-size: 4px;
    button{
        color: red !important;
        font-size: 10px;
        text-transform: lowercase !important;
    }
  }

放入app.scss