diff --git a/demos/component-docs/app.scss b/demos/component-docs/app.scss
index 753e0d23dc..98007ccc1d 100644
--- a/demos/component-docs/app.scss
+++ b/demos/component-docs/app.scss
@@ -216,30 +216,30 @@ ion-card .advanced-weather-tabs {
background: transparent;
}
-ion-card .advanced-weather-tabs tab-bar {
+ion-card .advanced-weather-tabs tabbar {
background: transparent;
border-top: none;
}
-body.ios ion-card .advanced-weather-tabs tab-bar {
+body.ios ion-card .advanced-weather-tabs tabbar {
height: 88px;
}
-body.md ion-card .advanced-weather-tabs tab-bar {
+body.md ion-card .advanced-weather-tabs tabbar {
height: 100px;
}
-ion-card .advanced-weather-tabs tab-bar a {
+ion-card .advanced-weather-tabs tabbar a {
height: 100%;
border-top: 2px solid transparent !important;
border-bottom: 0px !important;
}
-ion-card .advanced-weather-tabs tab-bar a icon.tab-button-icon {
+ion-card .advanced-weather-tabs tabbar a icon.tab-button-icon {
color: #fff;
font-size: 2.8em;
}
-ion-card .advanced-weather-tabs tab-bar a span.tab-button-text {
+ion-card .advanced-weather-tabs tabbar a span.tab-button-text {
color: #fff;
font-size: 13px;
}
-body.md ion-card .advanced-weather-tabs tab-bar a span.tab-button-text {
+body.md ion-card .advanced-weather-tabs tabbar a span.tab-button-text {
text-transform: uppercase;
}
body.md .cards-bg tab-highlight {
diff --git a/demos/component-docs/cards/cards-advanced-weather.html b/demos/component-docs/cards/cards-advanced-weather.html
index edf4af2e53..dae1a51a71 100644
--- a/demos/component-docs/cards/cards-advanced-weather.html
+++ b/demos/component-docs/cards/cards-advanced-weather.html
@@ -18,7 +18,7 @@
23°
-
+
@@ -38,7 +38,7 @@
78°
-
+
@@ -58,7 +58,7 @@
41°
-
+
diff --git a/demos/yerk/main.html b/demos/yerk/main.html
index 1c54803ac4..45c067fff4 100644
--- a/demos/yerk/main.html
+++ b/demos/yerk/main.html
@@ -7,7 +7,7 @@
.md .navbar-title {
color: #FDFEFE;
}
- #tabs tab-bar:before {
+ #tabs tabbar:before {
position: absolute;
top: 0;
right: auto;
diff --git a/ionic/components/app/structure.scss b/ionic/components/app/structure.scss
index fbced262d1..0799024d34 100644
--- a/ionic/components/app/structure.scss
+++ b/ionic/components/app/structure.scss
@@ -28,9 +28,9 @@ $z-index-item-options: 1;
$flex-order-toolbar-top: -10;
$flex-order-toolbar-bottom: 10;
-$flex-order-tab-bar-navbar: -30;
-$flex-order-tab-bar-top: -20;
-$flex-order-tab-bar-bottom: 20;
+$flex-order-tabbar-navbar: -30;
+$flex-order-tabbar-top: -20;
+$flex-order-tabbar-bottom: 20;
@@ -138,7 +138,7 @@ scroll-content {
will-change: scroll-position;
}
-ion-tab-bar {
+ion-tabbar {
display: block;
position: absolute;
top: 0;
diff --git a/ionic/components/tabs/modes/ios.scss b/ionic/components/tabs/modes/ios.scss
index 52e47944b4..6809d7dec6 100644
--- a/ionic/components/tabs/modes/ios.scss
+++ b/ionic/components/tabs/modes/ios.scss
@@ -2,48 +2,48 @@
// iOS Tabs
// --------------------------------------------------
-$tab-bar-ios-item-padding: 0px 10px !default;
-$tab-bar-ios-item-font-size: 10px !default;
-$tab-bar-ios-item-icon-size: 32px !default;
-$tab-bar-ios-height: 49px !default;
+$tabbar-ios-item-padding: 0px 10px !default;
+$tabbar-ios-item-font-size: 10px !default;
+$tabbar-ios-item-icon-size: 32px !default;
+$tabbar-ios-height: 49px !default;
-tab-bar {
+tabbar {
border-top: 1px solid $toolbar-ios-border-color;
}
-ion-tabs[tab-bar-placement=top] tab-bar {
+ion-tabs[tabbar-placement=top] tabbar {
border-top: none;
border-bottom: 1px solid $toolbar-ios-border-color;
}
.tab-button {
- padding: $tab-bar-ios-item-padding;
- min-height: $tab-bar-ios-height;
+ padding: $tabbar-ios-item-padding;
+ min-height: $tabbar-ios-height;
}
.tab-button-text {
margin-bottom: 0;
- min-height: $tab-bar-ios-item-font-size + 1;
- font-size: $tab-bar-ios-item-font-size;
+ min-height: $tabbar-ios-item-font-size + 1;
+ font-size: $tabbar-ios-item-font-size;
}
.has-title-only .tab-button-text {
- font-size: $tab-bar-ios-item-font-size + 2;
+ font-size: $tabbar-ios-item-font-size + 2;
}
.tab-button-icon {
- font-size: $tab-bar-ios-item-icon-size;
- height: $tab-bar-ios-item-icon-size;
- min-width: $tab-bar-ios-item-icon-size + 5;
+ font-size: $tabbar-ios-item-icon-size;
+ height: $tabbar-ios-item-icon-size;
+ min-width: $tabbar-ios-item-icon-size + 5;
&:before {
vertical-align: top;
}
}
-[tab-bar-icons=right] .tab-button,
-[tab-bar-icons=left] .tab-button {
+[tabbar-icons=right] .tab-button,
+[tabbar-icons=left] .tab-button {
.tab-button-text {
font-size: 1.4rem;
@@ -59,13 +59,13 @@ ion-tabs[tab-bar-placement=top] tab-bar {
}
}
-[tab-bar-icons=hide] .tab-button-text {
+[tabbar-icons=hide] .tab-button-text {
font-size: 1.4rem;
line-height: 1.1;
}
.tab-button.has-title-only {
- min-height: $tab-bar-ios-height - 8;
+ min-height: $tabbar-ios-height - 8;
.tab-button-text {
font-size: 1.4rem;
@@ -74,16 +74,16 @@ ion-tabs[tab-bar-placement=top] tab-bar {
}
.tab-button.icon-only {
- min-height: $tab-bar-ios-height - 8;
+ min-height: $tabbar-ios-height - 8;
}
&.hairlines ion-tabs {
- tab-bar {
+ tabbar {
border-top-width: 0.55px;
}
- &[tab-bar-placement="top"] tab-bar {
+ &[tabbar-placement="top"] tabbar {
border-bottom-width: 0.55px;
}
diff --git a/ionic/components/tabs/modes/md.scss b/ionic/components/tabs/modes/md.scss
index 25ebc48d99..7847060889 100644
--- a/ionic/components/tabs/modes/md.scss
+++ b/ionic/components/tabs/modes/md.scss
@@ -2,18 +2,18 @@
// Material Design Tabs
// --------------------------------------------------
-$tab-bar-md-item-padding: 12px 10px 5px 10px !default;
-$tab-bar-md-item-font-size: 1.4rem !default;
-$tab-bar-md-item-font-weight: 500 !default;
-$tab-bar-md-item-icon-size: 2.4rem !default;
-$tab-bar-md-item-height: 4.8rem !default;
+$tabbar-md-item-padding: 12px 10px 5px 10px !default;
+$tabbar-md-item-font-size: 1.4rem !default;
+$tabbar-md-item-font-weight: 500 !default;
+$tabbar-md-item-icon-size: 2.4rem !default;
+$tabbar-md-item-height: 4.8rem !default;
.tab-button {
- padding: $tab-bar-md-item-padding;
- min-height: $tab-bar-md-item-height;
- font-size: $tab-bar-md-item-font-size;
- font-weight: $tab-bar-md-item-font-weight;
+ padding: $tabbar-md-item-padding;
+ min-height: $tabbar-md-item-height;
+ font-size: $tabbar-md-item-font-size;
+ font-weight: $tabbar-md-item-font-weight;
box-shadow: none;
border-radius: 0;
@@ -27,17 +27,17 @@ $tab-bar-md-item-height: 4.8rem !default;
}
.tab-button-icon {
- font-size: $tab-bar-md-item-icon-size;
- min-width: $tab-bar-md-item-icon-size + 5;
+ font-size: $tabbar-md-item-icon-size;
+ min-width: $tabbar-md-item-icon-size + 5;
}
-[tab-bar-icons=bottom] .tab-button {
+[tabbar-icons=bottom] .tab-button {
padding-top: 8px;
padding-bottom: 8px;
}
-[tab-bar-icons=right] .tab-button,
-[tab-bar-icons=left] .tab-button {
+[tabbar-icons=right] .tab-button,
+[tabbar-icons=left] .tab-button {
padding-bottom: 10px;
icon {
@@ -65,6 +65,6 @@ tab-highlight {
}
}
-[tab-bar-placement=bottom] tab-highlight {
+[tabbar-placement=bottom] tab-highlight {
top: 0;
}
diff --git a/ionic/components/tabs/tabs.scss b/ionic/components/tabs/tabs.scss
index a85f7093e6..7dfd413ff5 100644
--- a/ionic/components/tabs/tabs.scss
+++ b/ionic/components/tabs/tabs.scss
@@ -2,7 +2,7 @@
// Tabs
// --------------------------------------------------
-$tab-bar-background-color: $toolbar-background-color !default;
+$tabbar-background-color: $toolbar-background-color !default;
$tab-button-text-color: $toolbar-text-color !default;
$tab-button-active-color: $toolbar-active-color !default;
@@ -43,24 +43,24 @@ ion-tab {
}
ion-tabs > ion-navbar-section {
- order: $flex-order-tab-bar-navbar;
+ order: $flex-order-tabbar-navbar;
}
-ion-tab-bar-section {
+ion-tabbar-section {
position: relative;
- order: $flex-order-tab-bar-bottom;
+ order: $flex-order-tabbar-bottom;
}
-[tab-bar-placement=top] ion-tab-bar-section {
- order: $flex-order-tab-bar-top;
+[tabbar-placement=top] ion-tabbar-section {
+ order: $flex-order-tabbar-top;
}
-tab-bar {
+tabbar {
position: relative;
display: flex;
justify-content: center;
overflow: hidden;
- background: $tab-bar-background-color;
+ background: $tabbar-background-color;
}
.tab-button {
@@ -129,13 +129,13 @@ tab-highlight {
display: none;
}
-[tab-bar-icons=bottom] .tab-button {
+[tabbar-icons=bottom] .tab-button {
.tab-button-icon {
order: 10;
}
}
-[tab-bar-icons=left] .tab-button {
+[tabbar-icons=left] .tab-button {
flex-direction: row;
.tab-button-icon {
@@ -144,7 +144,7 @@ tab-highlight {
}
}
-[tab-bar-icons=right] .tab-button {
+[tabbar-icons=right] .tab-button {
flex-direction: row;
.tab-button-icon {
@@ -154,6 +154,6 @@ tab-highlight {
}
}
-[tab-bar-icons=hide] .tab-button-icon {
+[tabbar-icons=hide] .tab-button-icon {
display: none;
}
diff --git a/ionic/components/tabs/tabs.ts b/ionic/components/tabs/tabs.ts
index 389d3f8b33..bd0df27887 100644
--- a/ionic/components/tabs/tabs.ts
+++ b/ionic/components/tabs/tabs.ts
@@ -22,18 +22,18 @@ import {Icon} from '../icon/icon';
* [properties you set on each Tab](../Tab/#tab_properties).
*
* To override the platform specific TabBar placement, use the
- * `tab-bar-placement` property:
+ * `tabbar-placement` property:
*
* ```ts
- *
+ *
*
*
* ```
*
- * To change the location of the icons in the TabBar, use the `tab-bar-icons`
+ * To change the location of the icons in the TabBar, use the `tabbar-icons`
* property:
* ```ts
- *
+ *
*
*
* ```
@@ -61,23 +61,23 @@ import {Icon} from '../icon/icon';
@ConfigComponent({
selector: 'ion-tabs',
defaultInputs: {
- 'tabBarPlacement': 'bottom',
- 'tabBarIcons': 'top',
+ 'tabbarPlacement': 'bottom',
+ 'tabbarIcons': 'top',
'preloadTabs': true
},
template:
'' +
'' +
'' +
- '' +
- '' +
+ '' +
+ '' +
'' +
'' +
'{{t.tabTitle}}' +
'' +
'' +
- '' +
- '' +
+ '' +
+ '' +
'' +
'' +
'',
diff --git a/ionic/components/tabs/test/tab-bar-scenarios/main.html b/ionic/components/tabs/test/tab-bar-scenarios/main.html
index 6c2e11d34a..b4c7e1d4f0 100644
--- a/ionic/components/tabs/test/tab-bar-scenarios/main.html
+++ b/ionic/components/tabs/test/tab-bar-scenarios/main.html
@@ -24,7 +24,7 @@
-
+
@@ -32,7 +32,7 @@
-
+
@@ -40,14 +40,14 @@
-
+
-
+
diff --git a/ionic/config/config.ts b/ionic/config/config.ts
index c26b0be1b7..52f6bd1c2a 100644
--- a/ionic/config/config.ts
+++ b/ionic/config/config.ts
@@ -43,7 +43,7 @@ export class Config {
* iconMode: 'ios',
* modalEnter: 'modal-slide-in',
* modalLeave: 'modal-slide-out',
- * tabBarPlacement: 'bottom',
+ * tabbarPlacement: 'bottom',
* viewTransition: 'ios',
* }
* })
diff --git a/ionic/config/modes.ts b/ionic/config/modes.ts
index aa40a4597d..ea60eee408 100644
--- a/ionic/config/modes.ts
+++ b/ionic/config/modes.ts
@@ -18,7 +18,7 @@ Config.setModeConfig('ios', {
modalEnter: 'modal-slide-in',
modalLeave: 'modal-slide-out',
- tabBarPlacement: 'bottom',
+ tabbarPlacement: 'bottom',
viewTransition: 'ios',
popupPopIn: 'popup-pop-in',
@@ -42,7 +42,7 @@ Config.setModeConfig('md', {
modalEnter: 'modal-md-slide-in',
modalLeave: 'modal-md-slide-out',
- tabBarPlacement: 'top',
+ tabbarPlacement: 'top',
viewTransition: 'md',
popupPopIn: 'popup-md-pop-in',
diff --git a/ionic/config/test/config.spec.ts b/ionic/config/test/config.spec.ts
index 5f8a5bb3ff..6508442026 100644
--- a/ionic/config/test/config.spec.ts
+++ b/ionic/config/test/config.spec.ts
@@ -39,7 +39,7 @@ export function run() {
config.setPlatform(platform);
expect(config.get('mode')).toEqual('md');
- expect(config.get('tabBarPlacement')).toEqual('top');
+ expect(config.get('tabbarPlacement')).toEqual('top');
});
it('should override mode settings from platforms setting', () => {
@@ -54,7 +54,7 @@ export function run() {
config.setPlatform(platform);
expect(config.get('mode')).toEqual('md');
- expect(config.get('tabBarPlacement')).toEqual('top');
+ expect(config.get('tabbarPlacement')).toEqual('top');
});
it('should get boolean value from querystring', () => {
@@ -165,27 +165,27 @@ export function run() {
it('should override ios mode config with user platform setting', () => {
let config = new Config({
- tabBarPlacement: 'hide',
+ tabbarPlacement: 'hide',
platforms: {
ios: {
- tabBarPlacement: 'top'
+ tabbarPlacement: 'top'
}
}
});
let platform = new Platform(['ios']);
config.setPlatform(platform);
- expect(config.get('tabBarPlacement')).toEqual('top');
+ expect(config.get('tabbarPlacement')).toEqual('top');
});
it('should override ios mode config with user setting', () => {
let config = new Config({
- tabBarPlacement: 'top'
+ tabbarPlacement: 'top'
});
let platform = new Platform(['ios']);
config.setPlatform(platform);
- expect(config.get('tabBarPlacement')).toEqual('top');
+ expect(config.get('tabbarPlacement')).toEqual('top');
});
it('should get setting from md mode', () => {
@@ -193,7 +193,7 @@ export function run() {
let platform = new Platform(['android']);
config.setPlatform(platform);
- expect(config.get('tabBarPlacement')).toEqual('top');
+ expect(config.get('tabbarPlacement')).toEqual('top');
});
it('should get setting from ios mode', () => {
@@ -201,7 +201,7 @@ export function run() {
let platform = new Platform(['ios']);
config.setPlatform(platform);
- expect(config.get('tabBarPlacement')).toEqual('bottom');
+ expect(config.get('tabbarPlacement')).toEqual('bottom');
});
it('should set/get platform setting from set()', () => {
@@ -209,10 +209,10 @@ export function run() {
let platform = new Platform(['ios']);
config.setPlatform(platform);
- config.set('tabBarPlacement', 'bottom');
- config.set('ios', 'tabBarPlacement', 'top');
+ config.set('tabbarPlacement', 'bottom');
+ config.set('ios', 'tabbarPlacement', 'top');
- expect(config.get('tabBarPlacement')).toEqual('top');
+ expect(config.get('tabbarPlacement')).toEqual('top');
});
it('should set/get setting from set()', () => {
@@ -220,9 +220,9 @@ export function run() {
let platform = new Platform(['ios']);
config.setPlatform(platform);
- config.set('tabBarPlacement', 'top');
+ config.set('tabbarPlacement', 'top');
- expect(config.get('tabBarPlacement')).toEqual('top');
+ expect(config.get('tabbarPlacement')).toEqual('top');
});
it('should set ios platform settings from settings()', () => {
diff --git a/scripts/snapshot/ionic.snapshot.js b/scripts/snapshot/ionic.snapshot.js
index 68f605cd28..68142fe019 100644
--- a/scripts/snapshot/ionic.snapshot.js
+++ b/scripts/snapshot/ionic.snapshot.js
@@ -54,8 +54,9 @@ var IonicSnapshot = function(options) {
};
});
});
- process.on('exit', function() {
- if (!self.shouldUpload) return;
+
+ process.on('exit', function(code) {
+ if (!self.shouldUpload || code === 1) return;
if (self.highestMismatch > 1) {
log(colors.red('Highest Mismatch: ' + self.highestMismatch + '%'));
@@ -127,34 +128,45 @@ var IonicSnapshot = function(options) {
{ form: self.testData },
function (error, response, body) {
try {
- var rspData = JSON.parse(body);
- self.highestMismatch = Math.max(self.highestMismatch, rspData.Mismatch);
+ if (error) {
+ log(specIdString, colors.red('error posting screenshot:'), error);
+ process.exit(1);
- var mismatch = Math.round(rspData.Mismatch * 100) / 100;
+ } else if (response.statusCode >= 400) {
+ log(specIdString, colors.red('error posting screenshot:'), response.statusCode, body);
+ process.exit(1);
- if (rspData.Mismatch > 1) {
- log(specIdString, colors.red('Mismatch: ' + mismatch + '%'), colors.gray(spec.getFullName()));
- } else if (rspData.Mismatch > 0) {
- log(specIdString, colors.yellow('Mismatch: ' + mismatch + '%'), colors.gray(spec.getFullName()));
} else {
- log(specIdString, colors.green('Mismatch: ' + mismatch + '%'), colors.gray(spec.getFullName()));
- }
+ var rspData = JSON.parse(body);
+ self.highestMismatch = Math.max(self.highestMismatch, rspData.Mismatch);
- var resultKey = (((rspData.Mismatch * 1000) + 1000000) + '').split('.')[0] + '-' + spec.id;
- self.results[resultKey] = {
- index: spec.id,
- name: spec.getFullName(),
- mismatch: mismatch,
- compareUrl: rspData.CompareUrl,
- screenshotUrl: rspData.ScreenshotUrl,
- };
+ var mismatch = Math.round(rspData.Mismatch * 100) / 100;
- if (rspData.IsMismatch) {
- self.mismatches.push(resultKey);
+ if (rspData.Mismatch > 1) {
+ log(specIdString, colors.red('Mismatch: ' + mismatch + '%'), colors.gray(spec.getFullName()));
+ } else if (rspData.Mismatch > 0) {
+ log(specIdString, colors.yellow('Mismatch: ' + mismatch + '%'), colors.gray(spec.getFullName()));
+ } else {
+ log(specIdString, colors.green('Mismatch: ' + mismatch + '%'), colors.gray(spec.getFullName()));
+ }
+
+ var resultKey = (((rspData.Mismatch * 1000) + 1000000) + '').split('.')[0] + '-' + spec.id;
+ self.results[resultKey] = {
+ index: spec.id,
+ name: spec.getFullName(),
+ mismatch: mismatch,
+ compareUrl: rspData.CompareUrl,
+ screenshotUrl: rspData.ScreenshotUrl,
+ };
+
+ if (rspData.IsMismatch) {
+ self.mismatches.push(resultKey);
+ }
}
} catch(e) {
- log(specIdString, colors.red('reportSpecResults', 'error posting screenshot:'), e);
+ log(specIdString, colors.red('error parsing screenshot response:'), e);
+ process.exit(1);
}
requestDeferred.resolve();
}