javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-23 14:01:20 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(tabs): make MD tab highlight the contrast color of tabs color

Browse Source
This commit is contained in:
Brandy Carney
2016-12-06 17:42:51 -05:00
parent dc0659fe46
commit bb3a57f407
2 changed files with 8 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/tabs/tabs.md.scss
View File

@ -221,7 +221,7 @@ $tabs-md-tab-icon-size: 2.4rem !default;
color: $color-contrast; color: $color-contrast;
} }
.tabs-md-#{$color-name} .tab-highlight { .tabs-md-#{$color-name}[tabsHighlight=true] .tab-highlight {
background: $color-contrast; background: $color-contrast;
} }

9
src/components/tabs/test/basic/app-module.ts
View File

@ -1,5 +1,5 @@
import { Component, NgModule } from '@angular/core'; import { Component, NgModule } from '@angular/core';
import { IonicApp, IonicModule, App, AlertController, ModalController, ViewController, Tab, Tabs } from '../../../..'; import { Config, IonicApp, IonicModule, App, AlertController, ModalController, ViewController, Tab, Tabs } from '../../../..';
// //
// Modal // Modal
@ -233,7 +233,7 @@ export class Tab3 {
</ion-content> </ion-content>
</ion-menu> </ion-menu>
<ion-tabs #content (ionChange)="onChange($event)"> <ion-tabs #content (ionChange)="onChange($event)" [color]="myColor">
<ion-tab tabTitle="Plain List" tabIcon="star" [root]="root1" (ionSelect)="onSelect($event)"></ion-tab> <ion-tab tabTitle="Plain List" tabIcon="star" [root]="root1" (ionSelect)="onSelect($event)"></ion-tab>
<ion-tab tabTitle="Schedule" tabIcon="globe" [root]="root2"></ion-tab> <ion-tab tabTitle="Schedule" tabIcon="globe" [root]="root2"></ion-tab>
<ion-tab tabTitle="Stopwatch" tabIcon="logo-facebook" [root]="root3"></ion-tab> <ion-tab tabTitle="Stopwatch" tabIcon="logo-facebook" [root]="root3"></ion-tab>
@ -246,6 +246,11 @@ export class TabsPage {
root1 = Tab1; root1 = Tab1;
root2 = Tab2; root2 = Tab2;
root3 = Tab3; root3 = Tab3;
myColor: string;
constructor(config: Config) {
this.myColor = (config.get('mode') !== 'ios') ? 'primary' : null;
}
onChange(ev: Tab) { onChange(ev: Tab) {
console.log('Changed tab', ev); console.log('Changed tab', ev);