css - 更改 ionic 2中警报 Controller 的样式和文本修改

标签 css angular ionic-framework sass ionic2

enter image description here

实际上我的警报 Controller “标题”太长了,所以我想调整文本的大小,我添加了 Css 类,然后尝试通过给它提供字体大小来更改 SASS 中的样式,不幸的是没有用,按钮文本是大写。那么有没有改变文本的字体大小,按钮颜色和大小以及将按钮文本更改为小写?

我的 typescript 文件

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;
  }
}

最佳答案

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

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

放入app.scss

关于css - 更改 ionic 2中警报 Controller 的样式和文本修改,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50616871/

相关文章:

css - 100vw 的问题(包括滚动条宽度)

css - 是否有理由在 <nav> 中使用 <ul>?

css - 根据该元素中的值将 css 分配给该元素

javascript - 在不添加按键值的情况下,在 Angular 2 中使用按键聚焦文本输入

ionic-framework - 如何从 HelloCordova 重命名 Ionic 应用程序

html - 在 anchor 标签上按下任何键盘键时,轮廓偏移的变化是预期的行为吗?

angular - Angular 2在ReactJS中是否有一个 'equivalent'到componentDidMount

Angular Material,使用没有卡片的mat-card-avatar

Angular fire firestore 没有导出成员 'FirestoreSettingsToken'

android - Ionic Facebook Api 无效的 key 散列