Modifying an Ionic project
In order to build upon the knowledge that we have gained and the work that we have previously done, we will modify the user interface of the project that we previously created. We will start off by modifying the header.
Modifying the header
Let's say that we would like to change the header bar to a calm blue color. Navigate to the
index.html file available at www | index.html.
Refer to the
body block, and using the reference UI components, change the
ion-nav-bar class to the following:
<ion-nav-bar class="bar-positive"> <ion-nav-back-button> </ion-nav-back-button> </ion-nav-bar>
Modifying the tab colour, icons, and names
Since we have decided to change the header color, we will go ahead and modify the tab bar to make its color ...