Different type of icon in one tab

@Rb1 wrote:

Hello everyone.

I have a question with tabs in ionic.

Is possible to change the icon of a tab?
Icon different of icon-off or icon-on.....?

Example :

<ion-tab id="tabchat"  icon-off="chatOff" icon-on="chatOn" title="Chat" href="#/tab/chats" >
    <ion-nav-view name="tab-chats"></ion-nav-view>
 </ion-tab>

I have the CSS

/* ChatON */
.tabs .tab-item .icon.chatOn{
    background-repeat: no-repeat;
    background-position:  50%;
    height: 100%;
    background-image: url(../img/iconos/chatOn.svg);
}

/* ChatOFF */
.tabs .tab-item .icon.chatOff{
    background-repeat: no-repeat;
    background-position:  50%;
    height: 100%;
    background-image: url(../img/iconos/chatOff.svg);
}

But I want a 3er icon for this tab..... Is possible to modify the icon?

With this style?

/* Chat con mensaje */
.tabs .tab-item .icon.newMsj{
    background-repeat: no-repeat;
    background-position:  50%;
    height: 100%;
    background-image: url(../img/iconos/newMsj.svg);
}

This new style will be added when the user receive a new message from a chat that I have implemented....
The message can be arrive outside of tab, and I want that the user knows that have a new message....

It's possible? What need to use?

Thank you

Posts: 1

Participants: 1

Read full topic