Стили кнопок нельзя изменить в проекте ionic 3

Question

Когда я пытаюсь изменить стили ионных кнопок на этих компонентах, даже используя! Важный или новые пользовательские классы, это ничего не меняет. Вот код:

<ion-content padding>
    <ion-list>
        <button ion-button block class=" custbtnnew" (click)=" SelectImage()">
            Select
        </button>
        <br>
        <button style="margin-top:20px;" ion-button block class="custbtnnew" (click)="UploadImage()">
            Upload
        </button>
    </ion-list>
    <div *ngIf="images" class="group">
        <ion-grid>
            <ion-row>
                <ion-col col-6 col-md-4 col-lg-3 col-xl-2 class="created_group" *ngFor="let image of images">
                    <div class="container">
                        <div class="imgs">
                            <img class="imgBg"
                                src="URL">
                            <button *ngIf="images" ion-button clear (click)="SetProfileImage(image)" class="imgBtn">
                                Set As Default
                            </button>
                            <button *ngIf="images" ion-button clear (click)="Delete(image)" class="imgBtn">
                                Delete Image
                            </button>
                        </div>
                    </div>
                </ion-col>
            </ion-row>
        </ion-grid>
    </div>
</ion-content>

CSS

 .custbtnnew {
    border-radius: 40px !important;
    background: -webkit-gradient(linear, left top, right top, from(#DD2476), to(#FF512F));
    background: linear-gradient(to right, #DD2476, #FF512F);
  }

Что может вызвать такую ​​проблему и как ее можно изменить?

Answer 1

вам может понадобиться объявление страницы вокруг вашего .scss

page-home {
 .custbtnnew {
    border-radius: 40px !important;
    background: -webkit-gradient(linear, left top, right top, from(#DD2476), to(#FF512F));
    background: linear-gradient(to right, #DD2476, #FF512F);
  }
}