Toolbar display issue

[Shubham Kaushik]

I have a page in which there are 2 tab bar like below:But when i push page ons-toolbar size go from top then bottom. Suggest the solution for this.

<ons-page style="background-color:white" ng-controller="AlarmCtrl">
    <ons-toolbar class="toolbar_clr">
        <div class="left">
            <div class="left" style="line-height: 44px">
                <ons-icon icon="ion-android-arrow-back" ng-click="pop_alarm();" size="30px" style="color:white;padding-left:10px;padding-right:10px;margin-top:7px"></ons-icon>
            </div>
        </div>
        <div class="right" ng-show="showAlarmDel">
            <ons-toolbar-button style="margin-left:-20px" ng-click="deleteall_passalarm()">
                <ons-icon icon="ion-android-delete" size="30px" style="color:white;"></ons-icon>
            </ons-toolbar-button>
        </div>
        <div class="center">
            <span style="color:white">{{currentLocale.almSet}}</span>
        </div>
    </ons-toolbar>
    <ons-tabbar position="top" var="alarm_tabbar">
        <ons-tab  page="alarmset.html" active="true">
            <span>{{currentLocale.almsett}}</span>
        </ons-tab>
        <ons-tab page="alarmhistory.html" ng-click="alarm_data()">
            <span>{{currentLocale.History}}</span>
        </ons-tab>
    </ons-tabbar>
</ons-page>

My toolbar css is this:

.toolbar_clr {
    background-color: #125073;
    /* padding-top: 10px; */
    min-height: 50px;
}

[Fran Diox]

@Shubham-Kaushik The only thing I can add is that, if you modify the toolbar’s height, you also need to push down the page content:

.toolbar {
  min-height: 50px;
}
.page__content {
  top: 50px;
}

However, I don’t understand what’s the issue that you mention with the toolbar. Please make a simple demo and post it here or file an issue on Github. You can quickly make your demo in tutorial.onsen.io (choose an AngularJS template to start).

[Shubham Kaushik]

I have send you 2 screenshots. Now When I push page this screenshot page 1 opens with this page and then toolbar height set like in screenshot 2 which i want.

Code i have already shared with you.

[Fran Diox]

@Shubham-Kaushik I cannot see any way to “push page” in the code you shared. You are using custom styles so this is likely not an issue in the library. If you want any help on how to do something custom please provide a minimum demo of your issue that we can easily debug.