Ionic 4: Change padding on Input fields

Question

I'm trying to change the padding off input field by changing the css4 variable but I must be doing something wrong because the padding is not changing. I'm still getting use to css4. This is my scss file.

app-page {
    --padding-end: 50px;

    ion-input{
        padding: var(--padding-end);
    }
}

user_204675 · Answer

ion-input {
    --padding-end: 12px;
}

Did what I wanted.

user_4554863 · Answer

Are you using SASS? Variable declaration would look like this:

app-page {
   $padding-end: 50px;

   ion-input{
      padding: $padding-end;
   }
}

Ionic 4: Change padding on Input fields

2 Answers