I have a problem trying to remove ion header border bottom in my ionic app
Here is the code of tab-home.html
:
<ion-view hide-nav-bar="true">
<ion-header-bar align-title="left" class="bar-transparent" >
<button menu-toggle="left" class="button button-icon ion-ios7-settings">
</button>
<div class="title"> </div>
<h1 class="title">proximiti</h1>
</ion-header-bar>
<!--<ion-nav-bar class="bar-transparent">
</ion-nav-bar>-->
<ion-pane ng-controller="CardsCtrl">
<!--<ion-nav-buttons side="left">
<button menu-toggle="left" class="button button-icon ion-navicon"></button>
</ion-nav-buttons>-->
<td-cards>
<td-card ng-repeat="card in cards" on-destroy="cardDestroyed($index)" on-swipe-left="cardSwipedLeft($index)" on-swipe-right="cardSwipedRight($index)" on-partial-swipe="cardPartialSwipe(amt)" class="card-{{card.index}}" ng-controller="CardCtrl">
<div class="image">
<!--<div class="yes-text" ng-style="leftTextOpacity">LIKE</div>-->
<img ng-src="{{card.image}}">
<!--<div class="no-text" ng-style="rightTextOpacity">NOPE</div>-->
</div>
</td-card>
</td-cards>
</ion-pane>
</ion-view>
As you can see here the part we're interested in:
<ion-view hide-nav-bar="true">
<ion-header-bar align-title="left" class="bar-transparent" >
<button menu-toggle="left" class="button button-icon ion-ios7-settings">
</button>
<div class="title"> </div>
<h1 class="title">proximiti</h1>
</ion-header-bar>
I tried everything (in the browser i don't see this border!), but nothing to change it! Anyone could help me trying to find the way to delete that border? N.B. : also tried to edit ionic.css and changed only in the browser.
EDIT: And it should be hidden only in this view, so where the class is bar-transparent
In ionic 2/3 border will be removed by using ionic-header no-border.
<ion-header no-border> </ion-header>
In ionic 5 border will be removed by using class="ion-no-border".
<ion-header class="ion-no-border"></ion-header>