Overriding Ionic variables

Issue

I would like to override Ionic viable like to change the default height of ion-header (by default it's 44px)

As I understand I just need to put in src/themes/variables.scss $toolbar-ios-height: 60px; for exemple.

But nothing change.. I started Ionic since few time and really don't understand what is going wrong, did I miss something to do ?

I just add these variables

$toolbar-md-height:  60px;
$toolbar-ios-height: 60px;

in the variables.scss file, and nothing else.

My ionic -v say v5.2.7 and I use Angular.

Thanks for your help ;)

Solution

For ionic 4 and later is diffrent.

https://ionicframework.com/docs/api/toolbar#css-custom-properties

inside variable.scss add

ion-toolbar{
--min-height: value
}

Answered By - parrycima