javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-22 13:32:54 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #5738 from manucorporat/tabs-style-ios

Browse Source 
fix(tabs): improves tabs style for iOS
This commit is contained in:
Adam Bradley
2016-03-06 14:14:29 -06:00
parent 897501650a b9a46288dc
commit 8b1783bb25
2 changed files with 6 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
ionic/components/tabs/tabs.ios.scss
View File

@ -7,7 +7,7 @@
$tabbar-ios-background: $toolbar-ios-background !default; $tabbar-ios-background: $toolbar-ios-background !default;
$tabbar-ios-item-padding: 0px 10px !default; $tabbar-ios-item-padding: 0px 10px !default;
$tabbar-ios-item-font-size: 10px !default; $tabbar-ios-item-font-size: 10px !default;
$tabbar-ios-item-icon-size: 32px !default; $tabbar-ios-item-icon-size: 30px !default;
$tabbar-ios-height: 49px !default; $tabbar-ios-height: 49px !default;
$tab-button-ios-min-width: 80px !default; $tab-button-ios-min-width: 80px !default;
@ -43,6 +43,8 @@ ion-tabs[tabbarPlacement=top] tabbar {
.tab-button-text { .tab-button-text {
min-height: $tabbar-ios-item-font-size + 1; min-height: $tabbar-ios-item-font-size + 1;
font-size: $tabbar-ios-item-font-size; font-size: $tabbar-ios-item-font-size;
margin-top: 0;
margin-bottom: 0;
} }
.has-title-only .tab-button-text { .has-title-only .tab-button-text {
@ -65,8 +67,6 @@ ion-tabs[tabbarPlacement=top] tabbar {
.tab-button-text { .tab-button-text {
font-size: 1.4rem; font-size: 1.4rem;
line-height: 1.1; line-height: 1.1;
margin-top: 0;
margin-bottom: 0;
} }
ion-icon { ion-icon {
@ -83,6 +83,8 @@ ion-tabs[tabbarPlacement=top] tabbar {
.tab-button-text { .tab-button-text {
font-size: 1.4rem; font-size: 1.4rem;
line-height: 1.1; line-height: 1.1;
margin: 2px 0px;
} }
} }

2
ionic/components/tabs/tabs.scss
View File

@ -146,7 +146,7 @@ tab-highlight {
.tab-badge { .tab-badge {
position: absolute; position: absolute;
top: 4%; top: 6%;
right: 4%; right: 4%;
right: calc(50% - 50px); right: calc(50% - 50px);
padding: 1px 6px; padding: 1px 6px;