From 5932706332dd6801f65d74923903aefcc1cd7699 Mon Sep 17 00:00:00 2001 From: Brandy Carney Date: Mon, 29 Feb 2016 19:15:22 -0500 Subject: [PATCH 1/7] docs(demos): add variables Sass file to use colors and add to icons references driftyco/ionic-site#453 --- demos/app.variables.scss | 31 +++++++++++++++++++++++++++++++ demos/icon/main.html | 14 +++++++------- demos/output.ios.scss | 32 ++++++++++++++++++++++++++++++++ demos/output.md.scss | 32 ++++++++++++++++++++++++++++++++ gulpfile.js | 2 ++ 5 files changed, 104 insertions(+), 7 deletions(-) create mode 100644 demos/app.variables.scss diff --git a/demos/app.variables.scss b/demos/app.variables.scss new file mode 100644 index 0000000000..12b647616d --- /dev/null +++ b/demos/app.variables.scss @@ -0,0 +1,31 @@ +// http://ionicframework.com/docs/v2/theming/ + + +// App Shared Variables +// -------------------------------------------------- +// To customize the look and feel of this app, you can override +// the Sass variables found in Ionic's source scss files. Setting +// variables before Ionic's Sass will use these variables rather than +// Ionic's default Sass variable values. App Shared Sass imports belong +// in the app.core.scss file and not this file. Sass variables specific +// to the mode belong in either the app.ios.scss or app.md.scss files. + + +// App Shared Color Variables +// -------------------------------------------------- +// It's highly recommended to change the default colors +// to match your app's branding. Ionic uses a Sass map of +// colors so you can add, rename and remove colors as needed. +// The "primary" color is the only required color in the map. +// Both iOS and MD colors can be further customized if colors +// are different per mode. + +$colors: ( + primary: #387ef5, + secondary: #32db64, + danger: #f53d3d, + light: #f4f4f4, + dark: #222, + vibrant: rebeccapurple, + bright: #FFC125 +); diff --git a/demos/icon/main.html b/demos/icon/main.html index 7897a7aee8..704dae498d 100644 --- a/demos/icon/main.html +++ b/demos/icon/main.html @@ -9,14 +9,14 @@ - + - + @@ -25,27 +25,27 @@ - + - + - + - + - + diff --git a/demos/output.ios.scss b/demos/output.ios.scss index 052237e8f5..f3018826e5 100644 --- a/demos/output.ios.scss +++ b/demos/output.ios.scss @@ -1,4 +1,36 @@ $font-path: "../fonts"; $roboto-font-path: "../fonts"; +// http://ionicframework.com/docs/v2/theming/ + + +// App Shared Variables +// -------------------------------------------------- +// To customize the look and feel of this app, you can override +// the Sass variables found in Ionic's source scss files. Setting +// variables before Ionic's Sass will use these variables rather than +// Ionic's default Sass variable values. App Shared Sass imports belong +// in the app.core.scss file and not this file. Sass variables specific +// to the mode belong in either the app.ios.scss or app.md.scss files. + + +// App Shared Color Variables +// -------------------------------------------------- +// It's highly recommended to change the default colors +// to match your app's branding. Ionic uses a Sass map of +// colors so you can add, rename and remove colors as needed. +// The "primary" color is the only required color in the map. +// Both iOS and MD colors can be further customized if colors +// are different per mode. + +$colors: ( + primary: #387ef5, + secondary: #32db64, + danger: #f53d3d, + light: #f4f4f4, + dark: #222, + vibrant: rebeccapurple, + bright: #FFC125 +); + @import "../ionic/ionic.ios"; diff --git a/demos/output.md.scss b/demos/output.md.scss index d4d8a86aa8..4c0d7bd119 100644 --- a/demos/output.md.scss +++ b/demos/output.md.scss @@ -1,4 +1,36 @@ $font-path: "../fonts"; $roboto-font-path: "../fonts"; +// http://ionicframework.com/docs/v2/theming/ + + +// App Shared Variables +// -------------------------------------------------- +// To customize the look and feel of this app, you can override +// the Sass variables found in Ionic's source scss files. Setting +// variables before Ionic's Sass will use these variables rather than +// Ionic's default Sass variable values. App Shared Sass imports belong +// in the app.core.scss file and not this file. Sass variables specific +// to the mode belong in either the app.ios.scss or app.md.scss files. + + +// App Shared Color Variables +// -------------------------------------------------- +// It's highly recommended to change the default colors +// to match your app's branding. Ionic uses a Sass map of +// colors so you can add, rename and remove colors as needed. +// The "primary" color is the only required color in the map. +// Both iOS and MD colors can be further customized if colors +// are different per mode. + +$colors: ( + primary: #387ef5, + secondary: #32db64, + danger: #f53d3d, + light: #f4f4f4, + dark: #222, + vibrant: rebeccapurple, + bright: #FFC125 +); + @import "../ionic/ionic.md"; diff --git a/gulpfile.js b/gulpfile.js index 96bba5bcc7..7566326307 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -634,6 +634,7 @@ function buildDemoSass(isProductionMode) { (function combineSass() { gulp.src([ sassVars, + 'demos/app.variables.scss', 'demos/app.ios.scss' ]) .pipe(concat('output.ios.scss')) @@ -641,6 +642,7 @@ function buildDemoSass(isProductionMode) { gulp.src([ sassVars, + 'demos/app.variables.scss', 'demos/app.md.scss' ]) .pipe(concat('output.md.scss')) From 487da57e37e906a201e74d4f8d8f2381e1a944ed Mon Sep 17 00:00:00 2001 From: Brandy Carney Date: Mon, 29 Feb 2016 20:25:45 -0500 Subject: [PATCH 2/7] docs(demos): change apostrophes to quotes to make Adam happy references nothing --- demos/icon/main.html | 72 ++++++++++++++++++++++---------------------- 1 file changed, 36 insertions(+), 36 deletions(-) diff --git a/demos/icon/main.html b/demos/icon/main.html index 704dae498d..821993fa7f 100644 --- a/demos/icon/main.html +++ b/demos/icon/main.html @@ -4,50 +4,50 @@ - - - - + + + + - - - - + + + + - - - - + + + + - - - - + + + + - - - - + + + + - - - - + + + + - - - - + + + + - - - - + + + + - - - - + + + + From 08178ecac0811b9adf13a1b5c079d92fb6416bd3 Mon Sep 17 00:00:00 2001 From: Tim Lancina Date: Tue, 1 Mar 2016 10:04:09 -0600 Subject: [PATCH 3/7] chore(demos): fix demo entries --- gulpfile.js | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/gulpfile.js b/gulpfile.js index 7566326307..e72e11e83c 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -522,10 +522,6 @@ gulp.task('demos', ['bundle.demos'], function() { return merge([demosStream, cssStream]); }); - gulp.task('demos.dev', function() { - - }); - /** * Builds necessary files for each demo then bundles them using webpack. Unlike * e2e tests, demos are bundled for performance (but have a slower build). @@ -542,7 +538,7 @@ gulp.task('bundle.demos', ['build.demos', 'transpile', 'copy.libs', 'sass', 'fon // add our bundle entry, removing previous if necessary // since config is cached - if (config.entry.length > 4) { + if (config.entry.length > 3) { config.entry.pop(); } config.entry.push('./' + file); From f0e7a69a90736c73769e913d45b8945c6e1a4271 Mon Sep 17 00:00:00 2001 From: Brandy Carney Date: Tue, 1 Mar 2016 11:00:36 -0500 Subject: [PATCH 4/7] docs(demos): fix refresher and infinite scroll demo to use the injectable in index --- demos/infinite-scroll/index.ts | 62 +++++++++++++++++++++++++- demos/infinite-scroll/mock-provider.ts | 61 ------------------------- demos/refresher/index.ts | 62 +++++++++++++++++++++++++- demos/refresher/mock-provider.ts | 61 ------------------------- 4 files changed, 122 insertions(+), 124 deletions(-) delete mode 100644 demos/infinite-scroll/mock-provider.ts delete mode 100644 demos/refresher/mock-provider.ts diff --git a/demos/infinite-scroll/index.ts b/demos/infinite-scroll/index.ts index dc45f02012..bdf2f02dae 100644 --- a/demos/infinite-scroll/index.ts +++ b/demos/infinite-scroll/index.ts @@ -1,5 +1,65 @@ import {App, InfiniteScroll} from 'ionic-angular'; -import {MockProvider} from './mock-provider'; +import {Injectable} from 'angular2/core'; + +/** + * Mock Data Access Object + **/ +@Injectable() +export class MockProvider { + + getData() { + // return mock data synchronously + let data = []; + for (var i = 0; i < 20; i++) { + data.push( this._getRandomData() ); + } + return data; + } + + getAsyncData() { + // async receive mock data + return new Promise(resolve => { + + setTimeout(() => { + resolve(this.getData()); + }, 1000); + + }); + } + + private _getRandomData() { + let i = Math.floor( Math.random() * this._data.length ); + return this._data[i]; + } + + private _data = [ + 'Fast Times at Ridgemont High', + 'Peggy Sue Got Married', + 'Raising Arizona', + 'Moonstruck', + 'Fire Birds', + 'Honeymoon in Vegas', + 'Amos & Andrew', + 'It Could Happen to You', + 'Trapped in Paradise', + 'Leaving Las Vegas', + 'The Rock', + 'Con Air', + 'Face/Off', + 'City of Angels', + 'Gone in Sixty Seconds', + 'The Family Man', + 'Windtalkers', + 'Matchstick Men', + 'National Treasure', + 'Ghost Rider', + 'Grindhouse', + 'Next', + 'Kick-Ass', + 'Drive Angry', + ]; + +} @App({ diff --git a/demos/infinite-scroll/mock-provider.ts b/demos/infinite-scroll/mock-provider.ts deleted file mode 100644 index 515a6d2172..0000000000 --- a/demos/infinite-scroll/mock-provider.ts +++ /dev/null @@ -1,61 +0,0 @@ -import {Injectable} from 'angular2/core'; - -/** - * Mock Data Access Object - **/ -@Injectable() -export class MockProvider { - - getData() { - // return mock data synchronously - let data = []; - for (var i = 0; i < 3; i++) { - data.push( this._getRandomData() ); - } - return data; - } - - getAsyncData() { - // async receive mock data - return new Promise(resolve => { - - setTimeout(() => { - resolve(this.getData()); - }, 1000); - - }); - } - - private _getRandomData() { - let i = Math.floor( Math.random() * this._data.length ); - return this._data[i]; - } - - private _data = [ - 'Fast Times at Ridgemont High', - 'Peggy Sue Got Married', - 'Raising Arizona', - 'Moonstruck', - 'Fire Birds', - 'Honeymoon in Vegas', - 'Amos & Andrew', - 'It Could Happen to You', - 'Trapped in Paradise', - 'Leaving Las Vegas', - 'The Rock', - 'Con Air', - 'Face/Off', - 'City of Angels', - 'Gone in Sixty Seconds', - 'The Family Man', - 'Windtalkers', - 'Matchstick Men', - 'National Treasure', - 'Ghost Rider', - 'Grindhouse', - 'Next', - 'Kick-Ass', - 'Drive Angry', - ]; - -} diff --git a/demos/refresher/index.ts b/demos/refresher/index.ts index 12db707b99..b4393df432 100644 --- a/demos/refresher/index.ts +++ b/demos/refresher/index.ts @@ -1,5 +1,65 @@ import {App, Page, Refresher} from 'ionic-angular'; -import {MockProvider} from './mock-provider'; +import {Injectable} from 'angular2/core'; + +/** + * Mock Data Access Object + **/ +@Injectable() +export class MockProvider { + + getData() { + // return mock data synchronously + let data = []; + for (var i = 0; i < 3; i++) { + data.push( this._getRandomData() ); + } + return data; + } + + getAsyncData() { + // async receive mock data + return new Promise(resolve => { + + setTimeout(() => { + resolve(this.getData()); + }, 1000); + + }); + } + + private _getRandomData() { + let i = Math.floor( Math.random() * this._data.length ); + return this._data[i]; + } + + private _data = [ + 'Fast Times at Ridgemont High', + 'Peggy Sue Got Married', + 'Raising Arizona', + 'Moonstruck', + 'Fire Birds', + 'Honeymoon in Vegas', + 'Amos & Andrew', + 'It Could Happen to You', + 'Trapped in Paradise', + 'Leaving Las Vegas', + 'The Rock', + 'Con Air', + 'Face/Off', + 'City of Angels', + 'Gone in Sixty Seconds', + 'The Family Man', + 'Windtalkers', + 'Matchstick Men', + 'National Treasure', + 'Ghost Rider', + 'Grindhouse', + 'Next', + 'Kick-Ass', + 'Drive Angry', + ]; + +} @App({ diff --git a/demos/refresher/mock-provider.ts b/demos/refresher/mock-provider.ts deleted file mode 100644 index 515a6d2172..0000000000 --- a/demos/refresher/mock-provider.ts +++ /dev/null @@ -1,61 +0,0 @@ -import {Injectable} from 'angular2/core'; - -/** - * Mock Data Access Object - **/ -@Injectable() -export class MockProvider { - - getData() { - // return mock data synchronously - let data = []; - for (var i = 0; i < 3; i++) { - data.push( this._getRandomData() ); - } - return data; - } - - getAsyncData() { - // async receive mock data - return new Promise(resolve => { - - setTimeout(() => { - resolve(this.getData()); - }, 1000); - - }); - } - - private _getRandomData() { - let i = Math.floor( Math.random() * this._data.length ); - return this._data[i]; - } - - private _data = [ - 'Fast Times at Ridgemont High', - 'Peggy Sue Got Married', - 'Raising Arizona', - 'Moonstruck', - 'Fire Birds', - 'Honeymoon in Vegas', - 'Amos & Andrew', - 'It Could Happen to You', - 'Trapped in Paradise', - 'Leaving Las Vegas', - 'The Rock', - 'Con Air', - 'Face/Off', - 'City of Angels', - 'Gone in Sixty Seconds', - 'The Family Man', - 'Windtalkers', - 'Matchstick Men', - 'National Treasure', - 'Ghost Rider', - 'Grindhouse', - 'Next', - 'Kick-Ass', - 'Drive Angry', - ]; - -} From 1f3db2ad1e6bfb5f0f4447259d88dd6b86443219 Mon Sep 17 00:00:00 2001 From: Brandy Carney Date: Tue, 1 Mar 2016 11:10:28 -0500 Subject: [PATCH 5/7] docs(demos): update config to move config JS in index --- demos/config/app.html | 1 - demos/config/config-demo.js | 66 ----------------------------------- demos/config/index.html | 25 -------------- demos/config/index.ts | 69 ++++++++++++++++++++++++++++++++++++- 4 files changed, 68 insertions(+), 93 deletions(-) delete mode 100644 demos/config/app.html delete mode 100644 demos/config/config-demo.js delete mode 100644 demos/config/index.html diff --git a/demos/config/app.html b/demos/config/app.html deleted file mode 100644 index 776be9a94a..0000000000 --- a/demos/config/app.html +++ /dev/null @@ -1 +0,0 @@ - diff --git a/demos/config/config-demo.js b/demos/config/config-demo.js deleted file mode 100644 index e18ab9659b..0000000000 --- a/demos/config/config-demo.js +++ /dev/null @@ -1,66 +0,0 @@ -if (!window.localStorage) { - Object.defineProperty(window, "localStorage", new (function () { - var aKeys = [], oStorage = {}; - Object.defineProperty(oStorage, "getItem", { - value: function (sKey) { return sKey ? this[sKey] : null; }, - writable: false, - configurable: false, - enumerable: false - }); - Object.defineProperty(oStorage, "key", { - value: function (nKeyId) { return aKeys[nKeyId]; }, - writable: false, - configurable: false, - enumerable: false - }); - Object.defineProperty(oStorage, "setItem", { - value: function (sKey, sValue) { - if(!sKey) { return; } - document.cookie = escape(sKey) + "=" + escape(sValue) + "; expires=Tue, 19 Jan 2038 03:14:07 GMT; path=/"; - }, - writable: false, - configurable: false, - enumerable: false - }); - Object.defineProperty(oStorage, "length", { - get: function () { return aKeys.length; }, - configurable: false, - enumerable: false - }); - Object.defineProperty(oStorage, "removeItem", { - value: function (sKey) { - if(!sKey) { return; } - document.cookie = escape(sKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/"; - }, - writable: false, - configurable: false, - enumerable: false - }); - this.get = function () { - var iThisIndx; - for (var sKey in oStorage) { - iThisIndx = aKeys.indexOf(sKey); - if (iThisIndx === -1) { oStorage.setItem(sKey, oStorage[sKey]); } - else { aKeys.splice(iThisIndx, 1); } - delete oStorage[sKey]; - } - for (aKeys; aKeys.length > 0; aKeys.splice(0, 1)) { oStorage.removeItem(aKeys[0]); } - for (var aCouple, iKey, nIdx = 0, aCouples = document.cookie.split(/\s*;\s*/); nIdx < aCouples.length; nIdx++) { - aCouple = aCouples[nIdx].split(/\s*=\s*/); - if (aCouple.length > 1) { - oStorage[iKey = unescape(aCouple[0])] = unescape(aCouple[1]); - aKeys.push(iKey); - } - } - return oStorage; - }; - this.configurable = false; - this.enumerable = true; - })()); -} - -if (window.localStorage.getItem('configDemo')) { - CONFIG_DEMO = JSON.parse(window.localStorage.getItem('configDemo')); -} else { - CONFIG_DEMO = null; -} \ No newline at end of file diff --git a/demos/config/index.html b/demos/config/index.html deleted file mode 100644 index 49f6db8d67..0000000000 --- a/demos/config/index.html +++ /dev/null @@ -1,25 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/demos/config/index.ts b/demos/config/index.ts index 4647505d3a..f863175ed1 100644 --- a/demos/config/index.ts +++ b/demos/config/index.ts @@ -1,7 +1,74 @@ +if (!window.localStorage) { + Object.defineProperty(window, "localStorage", new (function () { + var aKeys = [], oStorage = {}; + Object.defineProperty(oStorage, "getItem", { + value: function (sKey) { return sKey ? this[sKey] : null; }, + writable: false, + configurable: false, + enumerable: false + }); + Object.defineProperty(oStorage, "key", { + value: function (nKeyId) { return aKeys[nKeyId]; }, + writable: false, + configurable: false, + enumerable: false + }); + Object.defineProperty(oStorage, "setItem", { + value: function (sKey, sValue) { + if(!sKey) { return; } + document.cookie = escape(sKey) + "=" + escape(sValue) + "; expires=Tue, 19 Jan 2038 03:14:07 GMT; path=/"; + }, + writable: false, + configurable: false, + enumerable: false + }); + Object.defineProperty(oStorage, "length", { + get: function () { return aKeys.length; }, + configurable: false, + enumerable: false + }); + Object.defineProperty(oStorage, "removeItem", { + value: function (sKey) { + if(!sKey) { return; } + document.cookie = escape(sKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/"; + }, + writable: false, + configurable: false, + enumerable: false + }); + this.get = function () { + var iThisIndx; + for (var sKey in oStorage) { + iThisIndx = aKeys.indexOf(sKey); + if (iThisIndx === -1) { oStorage.setItem(sKey, oStorage[sKey]); } + else { aKeys.splice(iThisIndx, 1); } + delete oStorage[sKey]; + } + for (aKeys; aKeys.length > 0; aKeys.splice(0, 1)) { oStorage.removeItem(aKeys[0]); } + for (var aCouple, iKey, nIdx = 0, aCouples = document.cookie.split(/\s*;\s*/); nIdx < aCouples.length; nIdx++) { + aCouple = aCouples[nIdx].split(/\s*=\s*/); + if (aCouple.length > 1) { + oStorage[iKey = unescape(aCouple[0])] = unescape(aCouple[1]); + aKeys.push(iKey); + } + } + return oStorage; + }; + this.configurable = false; + this.enumerable = true; + })()); +} + +var CONFIG_DEMO = null; + +if (window.localStorage.getItem('configDemo')) { + CONFIG_DEMO = JSON.parse(window.localStorage.getItem('configDemo')); +} + import {App, Page, IonicApp, Platform, NavController} from 'ionic-angular'; @App({ - templateUrl: 'app.html', + template: '', config: CONFIG_DEMO || {} }) class ApiDemoApp { From 5ca2a55f140efac082efc056cc37850f11792d24 Mon Sep 17 00:00:00 2001 From: Brandy Carney Date: Tue, 1 Mar 2016 12:08:01 -0500 Subject: [PATCH 6/7] docs(refresher): update API docs for refresher and demo references #5207 --- demos/refresher/main.html | 2 +- ionic/components/refresher/refresher.ts | 25 +++++++++++++------------ 2 files changed, 14 insertions(+), 13 deletions(-) diff --git a/demos/refresher/main.html b/demos/refresher/main.html index 186be0ab41..458575f6da 100644 --- a/demos/refresher/main.html +++ b/demos/refresher/main.html @@ -1,5 +1,5 @@ - Pull To Refresh + Refresher diff --git a/ionic/components/refresher/refresher.ts b/ionic/components/refresher/refresher.ts index 94d196159e..c32635cae2 100644 --- a/ionic/components/refresher/refresher.ts +++ b/ionic/components/refresher/refresher.ts @@ -10,12 +10,12 @@ import {CSS, pointerCoord, transitionEnd} from '../../util/dom'; /** * @name Refresher * @description - * Allows you to add Pull-To-Refresh to an Content component. - * Place `ion-refresher` as the first child of your `ion-content` element. + * The Refresher provides pull-to-refresh functionality on a content component. + * Place the `ion-refresher` as the first child of your `ion-content` element. * - * Pages can then can listen to the refreshers various output events. The - * `refresh` output event is the one that's fired when the user has pulled - * down far enough to kick off the refreshing process. Once the async operation + * Pages can then listen to the refresher's various output events. The + * `refresh` output event is fired when the user has pulled down far + * enough to kick off the refreshing process. Once the async operation * has completed and the refreshing should end, call `complete()`. * * @usage @@ -71,13 +71,14 @@ import {CSS, pointerCoord, transitionEnd} from '../../util/dom'; * * ## Further Customizing Refresher Content * - * The `ion-refresh` component holds the refresh logic, and it requires a - * child refresher content component for its display. The `ion-refresher-content` - * component is Ionic's default that shows the actual display of the refresher - * and changes its look depending on the refresher's state. With this separation, - * it also allows developers to create their own refresher content components. - * Ideas include having some cool SVG or CSS animations that are customized to - * your app and animates the various refresher states to your liking. + * The `ion-refresher` component holds the refresh logic. + * It requires a child component in order to display the content. + * Ionic uses `ion-refresher-content` by default. This component + * displays the refresher and changes the look depending + * on the refresher's state. Separating these components + * allows developers to create their own refresher content + * components. You could replace our default content with + * custom SVG or CSS animations. * * @demo /docs/v2/demos/refresher/ * From 5fb1e08347cdf9a413ab995027f3146d2921e2e4 Mon Sep 17 00:00:00 2001 From: Brandy Carney Date: Tue, 1 Mar 2016 12:59:29 -0500 Subject: [PATCH 7/7] fix(toolbar): add a min-width to the toolbar content so that it won't overlap buttons fixes #5657 --- .../toolbar/test/scenarios/main.html | 18 +++++++++++++++++- ionic/components/toolbar/toolbar.ios.scss | 1 + ionic/components/toolbar/toolbar.md.scss | 1 + 3 files changed, 19 insertions(+), 1 deletion(-) diff --git a/ionic/components/toolbar/test/scenarios/main.html b/ionic/components/toolbar/test/scenarios/main.html index be6f13db2c..7fe453ae2c 100644 --- a/ionic/components/toolbar/test/scenarios/main.html +++ b/ionic/components/toolbar/test/scenarios/main.html @@ -2,6 +2,22 @@ This is the title that never ends. It just goes on and on my friend. + + + + + + + + + This is a long title with buttons. It just goes on and on my friend. + @@ -207,4 +223,4 @@ .toolbar { border-bottom: 1px solid black; } - \ No newline at end of file + diff --git a/ionic/components/toolbar/toolbar.ios.scss b/ionic/components/toolbar/toolbar.ios.scss index c292340481..75f6721faa 100644 --- a/ionic/components/toolbar/toolbar.ios.scss +++ b/ionic/components/toolbar/toolbar.ios.scss @@ -57,6 +57,7 @@ ion-navbar-section { .toolbar-content { flex: 1; order: map-get($toolbar-order-ios, content); + min-width: 0; } .toolbar-title { diff --git a/ionic/components/toolbar/toolbar.md.scss b/ionic/components/toolbar/toolbar.md.scss index bc8304f199..f227617116 100644 --- a/ionic/components/toolbar/toolbar.md.scss +++ b/ionic/components/toolbar/toolbar.md.scss @@ -52,6 +52,7 @@ ion-navbar-section { flex: 1; order: map-get($toolbar-order-md, content); max-width: 100%; + min-width: 0; } .toolbar-title {