ionic3 自定义toast样式

文件目录结构：

在使用ionic3来写toast效果时，会有各种各样对toast样式的需求，

在全局的app.scss中添加以下内容

备注：（这里的样式也可以放置在组件的scss文件中，但是是独立开来的，不要嵌套在组件的page-xxx中去）

//吐司颜色、大小
  .box {
    width: 200px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
  }
  .toast-container {
    width: 100%;
  }
  .error {
    .toast-message {
      color: #a94442;
    }
    .toast-wrapper {
      background: #f2dede;
      @extend .box;
    }
  }
  .success {
    .toast-message {
      color: #3c763d;
    }
    .toast-wrapper {
      background: #dff0d8;
      @extend .box;
    }
  }
  .tip {
    .toast-message {
      color: #31708f;
    }
    .toast-wrapper {
      background: #d9edf7;
      @extend .box;
    }
  }
  .toast-md .toast-wrapper.toas