CODEWITHSUNDEEP
sassionic2ionic3
Isaac Obella
Isaac Obella

Reputation: 2643

ionic 3 alert font-sizing

i'm using the ion-select => ion-option as an input for my ionic 3 project. It gives an alert on selection, however the font-size of the alert body is really small and i have tried all sass options to increase its font-size all in vain. I have tried using .alert-md,.alert-tappable. Is there any way i can increase this font.

enter image description here

.scss

.ios, .md {
  page-add-stock {
    /*.alert-md .alert-checkbox-label{

    }*/
    .alert-radio-label {
      font-size: 3rem;
    }
  }
}

.html

  <ion-select  [(ngModel)]="category" formControlName="category" >
    <ion-option>Pesticides</ion-option>
    <ion-option>Seeds</ion-option>
    <ion-option>Herbicides</ion-option>
    <ion-option>Fertilizers</ion-option>
    <ion-option>Farming tools</ion-option>
  </ion-select>

Html ion-select that generates the alert, just in case.

Upvotes: 4

Views: 2454

Answers (1)

sebaferreras
sebaferreras

Reputation: 44659

I cannot find any Ionic Sass variable related to the labels (I found one for the message, the title and the subtitle of the alert, but not for the labels), so you can always use a css style rule to set the right font-size:

.alert-radio-label {
    font-size: 3rem;
}

The default is font-size: 1.6rem; for Android, and font-size: 1.4rem; for iOS.

UPDATE

Please notice that the alert html element is outside the page, so that style rule should be placed in the app.scss file.

Upvotes: 5

Related Questions