Responsive design with custom css


As I am using Ionic to help with the front-end development of a phone/tablet app, I want to roll with the system as much as possible. I am finding myself wanting to customize the stylings in ways beyond that which is shown in either the css or the javascript examples shown in the Docs.

What is the best way to override styles, especially those that I will want to customize for a phone or tablet? I am comfortable writing my own styles and media queries but I don’t want to work against the grain of what is already in place with Ionic.


If you want to overwrite/extend ionic classes
You should use the scss sources and build your own scss file.
Import the ionic.scss in your scss and now you can work with the ionic variables (easy change e.g. color-variables and so on) without overwriting whole classes with !important :wink:

After that you can generate your own css file out of your scss.

Greetz, bengtler.