Changing the color of header in slide menu template

1

I have installed ionic and started a project using side menu template.
I tried to change the color of slide menu and was able to do it.
Now I want to change the color of main menu header and I didn’t find any proper resource to do it.
Also please suggest some tutorial to learn ionic framework step by step
Please do help me ,as I was new to ionic framework.

2

The following will get what you want.

<ion-side-menus>
    <ion-side-menu-content>
        <ion-nav-bar class="bar-positive">
            <ion-nav-back-button class="button-clear"><i class="icon ion-ios7-arrow-back"></i>
            </ion-nav-back-button>
        </ion-nav-bar>

        <ion-nav-view></ion-nav-view>
    </ion-side-menu-content>

    <!-- Left menu -->
    <ion-side-menu side="left">
        <header class="bar bar-header bar-assertive">
            <h1 class="title">App name? maybe something else</h1>
        </header>
        <ion-content class="has-header">
            <div class="list">
                <a class="item item-icon-right" nav-clear menu-close ui-sref="message">
                    <span>My first sidemenu link</span>
                    <i class="icon ion-ios7-navigate-outline bg-possitive"></i>
                </a>
                
            </div>
        </ion-content>
    </ion-side-menu>
</ion-side-menus>

Just change the bar-positive and bar-assertive to change your sidemenu and main view bar colors. Heres a picture

1 Like
3

@epelc Thank u :slight_smile: That solved my query

1 Like