Color of a paragraph


#1

I’m starting to practice with ionic and sass.

I want to change the color of a paragraph that is inside an item, as follows:

.item p {
color # 666;
}

From what I see, it is only defined in _items.scss.

Is it appropriate to change there? Or is there any other place where I could change?


#2

I wouldn’t recommend changing anything in the Ionic Sass files, since these will be updated when a new version of Ionic is released and you will lose any changes you made. Instead, you can create a custom Sass file and override it, then include that file after you include the Ionic Sass file. So in your ionic.app.scss file within the scss folder, you would import your custom file:

// Include all of Ionic
@import "www/lib/ionic/scss/ionic";

@import "custom"; 

Then you would create a custom file in the same folder named _custom.scss containing:

.item p {
  color: blue;
}

If you wanted to change any of the Ionic variables, such as changing the balanced variable, you would include those before the import of Ionics sass file:

$balanced: #e5e5e5;

// Include all of Ionic
@import "www/lib/ionic/scss/ionic";

This code could also go in a file and be imported like above.

Here is a guide on customizing with Sass and there are some more in depth topics on the forum if you need more help. :smile: