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

fix(toolbar): add a min-width to the toolbar content so that it won't overlap buttons

Browse Source 
fixes #5657
This commit is contained in:
Brandy Carney
2016-03-01 12:59:29 -05:00
parent 5ca2a55f14
commit 5fb1e08347
3 changed files with 19 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
ionic/components/toolbar/test/scenarios/main.html
View File

@ -2,6 +2,22 @@
<ion-title>This is the title that never ends. It just goes on and on my friend.</ion-title>
</ion-toolbar>
<ion-toolbar>
<ion-buttons start>
<button>
<ion-icon name="contact"></ion-icon>
</button>
<button>
<ion-icon name="search"></ion-icon>
</button>
</ion-buttons>
<ion-buttons end>
<button secondary>
<ion-icon name="more"></ion-icon>
</button>
</ion-buttons>
<ion-title>This is a long title with buttons. It just goes on and on my friend.</ion-title>
</ion-toolbar>
<ion-toolbar>
<ion-buttons start>

1
ionic/components/toolbar/toolbar.ios.scss
View File

@ -57,6 +57,7 @@ ion-navbar-section {
.toolbar-content {
flex: 1;
order: map-get($toolbar-order-ios, content);
min-width: 0;
}
.toolbar-title {

1
ionic/components/toolbar/toolbar.md.scss
View File

@ -52,6 +52,7 @@ ion-navbar-section {
flex: 1;
order: map-get($toolbar-order-md, content);
max-width: 100%;
min-width: 0;
}
.toolbar-title {