Skip to content

Commit

Permalink
fix(tabs): remove min-width from tab so 5 tabs will fit
Browse files Browse the repository at this point in the history 
fixes #6056
  • Loading branch information
@brandyscarney
brandyscarney committed Apr 22, 2016
1 parent 837e74d commit b4647cd
Show file tree
Hide file tree
Showing 2 changed files with 2 additions and 2 deletions.
2 changes: 0 additions & 2 deletions ionic/components/tabs/tabs.ios.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,6 @@ $tabbar-ios-item-font-size: 10px !default;
$tabbar-ios-item-icon-size: 30px !default;
$tabbar-ios-height: 49px !default;

$tab-button-ios-min-width: 80px !default;
$tab-button-ios-max-width: 240px !default;
$tab-button-ios-active-color: $toolbar-ios-active-color !default;
$tab-button-ios-inactive-color: $toolbar-ios-inactive-color !default;
Expand All @@ -29,7 +28,6 @@ ion-tabs[tabbarPlacement=top] tabbar {
.tab-button {
padding: $tabbar-ios-item-padding;

min-width: $tab-button-ios-min-width;
max-width: $tab-button-ios-max-width;
min-height: $tabbar-ios-height;

Expand Down
2 changes: 2 additions & 0 deletions ionic/components/tabs/test/tab-bar-scenarios/main.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,6 +59,8 @@
<ion-tabs tabbarLayout="title-hide" secondary no-navbar>
<ion-tab tabTitle="Recents" tabIcon="call" [root]="root"></ion-tab>
<ion-tab tabTitle="Favorites" tabIcon="heart" [root]="root"></ion-tab>
<ion-tab tabTitle="Radio" tabIcon="musical-notes" [root]="root"></ion-tab>
<ion-tab tabTitle="Messages" tabIcon="chatboxes" [root]="root"></ion-tab>
<ion-tab tabTitle="Settings" tabIcon="settings" [root]="root"></ion-tab>
</ion-tabs>

Expand Down

1 comment on commit b4647cd

@SanjanaTailor
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@brandyscarney : how to remove max-width for ios currenlty 3 tabs in ipad doesnot fit in ipad because of max-width = 240 px by removing it works fine.
max-width: $tab-button-ios-max-width;

Please sign in to comment.