By default, Ionic is packed with SCSS. Unlike the earlier version, where one had to set up SCSS in a project, in Ionic 2 the theming has become more modular and simpler. There are two levels at which theming can happen:
- At the platform level
- At the page/component level
App-level theming is almost always what we need. We would change the colors of our app based on our brand, and since Ionic uses a SCSS map, the colors are inherited directly by the components. Also, we can add, rename, and remove colors as needed. The primary color is the only required color in the map. iOS, MD, and WP colors can be further customized if colors are different per mode.
Page/component-level theming is very helpful if we would like to keep our styles isolated and specific to those pages/components. This is one of the biggest advantages of the component-based approach to app development. We can keep our components modular...