Side menu and subheader

1

I have a common subheader for multiple view so I have it in my header.html where my side menu is.

But the problem is that customSubheader which has bar bar-subheader class applied to it does not move to right when side menu opens.

How do I fix this?

<ion-side-menus>
   
  <ion-side-menu-content drag-content="$root.canDrag">
  

        <ion-nav-bar class="bar-positive menuTopbar">
 <ion-nav-back-button class="button-icon ion-arrow-left-c" ng-if="uiRouterState.current.name !== 'headerbar.orderConfirmed'">
  </ion-nav-back-button>
          <ion-nav-title>
                       xyz
              </ion-nav-title>

  <ion-nav-buttons side="left">
    <div class="button button-icon button-clear ion-navicon" menu-toggle="left">
    </div>
  </ion-nav-buttons>


</ion-nav-bar>





              <ion-nav-view name="PageView"></ion-nav-view>
           </ion-side-menu-content>



                                     <ion-side-menu side="left">
                           <ion-content>
                  <ion-list ng-if="!LoggedIn">
 
               <ion-item menu-close href="#/login">
     Log In
    </ion-item>
     <ion-item menu-close href="#/customerFeedBack">
      Feedback
    </ion-item> 
   
  </ion-list>
       <ion-list ng-if="LoggedIn">

  </ion-list>
</ion-content>

             </div>
                <div id="customSubHeader">
                    <div ng-if="showSubHeader" class=" bar bar-subheader">
                    <div class="content_topBar">  
                        <div class="row">
                    <div class=" col-50">
                      <div class="row moveToCentre">
     

            </div>
               </div>



    
          </div>

 
                      </div>
                    </div>
                               </div>
2

Can you throw something on Codepen that shows the issue ?