bia-framework/components/core-tabs/core-tabs.template.html

Bia Framework to work with angular 2

<div class="grid grid-direction-rows-sm tabs">

    <!-- Tab Headers -->
    <div class="cell tab-navegation bg-color-primary">
        <div class="grid grid-direction-columns-sm">

            <div class="cell tab-navegation-item ripple-container"
                 *ngFor="let tab of tabs, let i = index"
                 [ngClass]="{'active':tab.isActive, 'cell-auto':isNavegationFull}"
                 (click)="selectedIndex = i">

                <div class="grid grid-direction-rows-sm"
                     ripple
                     rippleColor="primary-100"
                     rippleSize="i"
                     rippleMousePosition="true">
                    <div class="cell cell-auto cell-horizontal-center-sm tab-title" *ngIf="tab.icon==null">
                        <span class="text text-button text-color-white">{{tab.title}}</span>
                    </div>
                    <div class="cell cell-auto cell-horizontal-center-sm tab-title" *ngIf="tab.icon!=null">
                        <core-icon [source]="tab.icon" [color]="getColor(tab.isActive)" size="xsm"></core-icon>
                    </div>
                    <div class="cell">
                        <div class="flag"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!--tabs-->
    <ng-content></ng-content>


</div>