Different tabs style for the secondary tab

ionic-v1
1

Referring to the the card-view example in inoic’s doc:

I’m trying to have different style for main tabs without changing the secondary tab’s style.
For example, when I use:

<ion-view title="Test">
  <ion-tabs class="tabs-striped tabs-top tabs-background-positive tabs-light">

     <ion-tab title="Home" icon-on="ion-ios7-filing" icon-off="ion-ios7-filing-outline" >

	  <ion-content class="has-header" dir="rtl">

		<div class="list card">

		  <div class="item item-avatar">
		    <img src="test.jpg">
		    <h2>test</h2>
		    <p>test </p>
		    <p>test</p>
		  </div>

		  <div class="item item-body">
		    <p>
		    	<div ng-bind-html="doc.documentContent"></div>
		    </p>
		  </div>

		  <div class="item tabs tabs-icon-left">
		    <a class="tab-item" href="#">
		      <i class="icon ion-chatbox"></i>
		     chat
		    </a>
		    <a class="tab-item" href="#">
		      <i class="icon ion-share"></i>
		     reply
		    </a>
		  </div>

		</div>
	  </ion-content>
  </ion-tab>

  <ion-tab title="About" icon-on="ion-paperclip" icon-off="ion-paperclip-outline">
    <!-- Tab 2 content -->
  </ion-tab>
</ion-tabs>

Both tabs change to tabs-positive since my top level ion-tabs is using tabs-background-positive.

2

any tips on how to solve this ?

3

can’t you add a class to the secondary tabs?

4

Bump I am having the same issue. Secondary nested tabs inherit style from parent tabs, I want the secondary nested tabs to appear in card like the card showcase.

5

Have you solved this please?

6

Anyone fixed this? I’m having the same problem!

7

Me too want the same look and feel of the showcase but when I include tab-striped everything is a mess. any fix?