0

On login screen of my mobile app , i want to hide default nav-bar by ionic. I want screen to be full size not having any header bar. I saw a lot of answers on below links:

Good pattern for hiding ion-nav-bar on login and not having a back button just after login?

how to hide header bar in ionic?

But it did not fix the actual issue. i am able to hide nav-bar but blank space is taken by nav-bar on top which is not getting removed.

Any Clues?

Community
  • 1
  • 1
mobigaurav
  • 194
  • 1
  • 2
  • 14
  • 1
    To all other developers facing similar issue > First make hide-nav-bar as true than assign your ion-view a ng-class and give height of 100%. From ion-content remove class "has-header" and issue will be resolved. This is working for me and it will definitely work for you all. I dont have enough reputation to upvote this answers so i request others if it works for them , please upvote this answer. – mobigaurav Jun 16 '16 at 15:26

1 Answers1

1

You can do it with the help of css,

<style>
  .tab-nav, .bar-footer{
    display: none !important;
  }

 .bar.bar-header {
   display: none
  }

  .has-tabs-top {
    top: 0px !important;
  }
  .has-tabs-bottom {
    bottom: 0px !important;
  }
  .has-tabs, .bar-footer.has-tabs, .has-footer.has-tabs {
    bottom: 0px;
  }
  /* custom header footer overrides */
  .custom-header, .custom-footer{
    display: block !important;
  }
</style>

This will hide header footer and tab bar, just paste it outside(below) of ion-view of your login page.

Md. Nahiduzzaman Rose
  • 442
  • 2
  • 9
  • 23