Moved toggle vars to a vars file for ios7

This commit is contained in:
Max Lynch
2013-09-27 16:01:00 -05:00
parent 2abb446b8f
commit 7d96f77c53
7 changed files with 153 additions and 84 deletions

17
dist/ionic-ios7.css vendored
View File

@ -1614,17 +1614,21 @@ textarea {
.input-group {
overflow: hidden;
border-top: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
background-color: white; }
/*
border-top: $input-border-width solid $input-border-color;
border-bottom: $input-border-width solid $input-border-color;
background-color: $input-bg;
*/ }
.padded > .input-group,
.input-group.inset {
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
border-right: 1px solid #cccccc;
border-left: 1px solid #cccccc; }
/*
border-right: $input-border-width solid $input-border-color;
border-left: $input-border-width solid $input-border-color;
*/ }
.input-group .input-wrapper + .input-wrapper {
border-top: 1px solid #cccccc; }
@ -1924,7 +1928,8 @@ input[type="checkbox"][readonly] {
opacity: 0.4; }
.button.button-block {
display: block;
margin: 10px 0 10px 0; }
margin: 10px 0 10px 0;
width: 100%; }
.button.button-default {
color: #333333;
background-color: white;

17
dist/ionic.css vendored
View File

@ -1614,17 +1614,21 @@ textarea {
.input-group {
overflow: hidden;
border-top: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
background-color: white; }
/*
border-top: $input-border-width solid $input-border-color;
border-bottom: $input-border-width solid $input-border-color;
background-color: $input-bg;
*/ }
.padded > .input-group,
.input-group.inset {
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
border-right: 1px solid #cccccc;
border-left: 1px solid #cccccc; }
/*
border-right: $input-border-width solid $input-border-color;
border-left: $input-border-width solid $input-border-color;
*/ }
.input-group .input-wrapper + .input-wrapper {
border-top: 1px solid #cccccc; }
@ -1911,7 +1915,8 @@ input[type="checkbox"][readonly] {
opacity: 0.4; }
.button.button-block {
display: block;
margin: 10px 0 10px 0; }
margin: 10px 0 10px 0;
width: 100%; }
.button.button-default {
color: #333333;
background-color: white;

147
dist/ionic.js vendored
View File

@ -1666,36 +1666,6 @@ window.ionic = {
}
};
})(window.ionic);
;(function(ionic) {
ionic.views.HeaderBar = function(opts) {
this.el = opts.el;
this._titleEl = this.el.querySelector('.title');
};
ionic.views.NavBar.prototype = {
resizeTitle: function() {
var
e,
j,
i,
title,
titleWidth,
children = this.el.children;
for(i = 0, j = children.length; i < j; i++) {
e = children[i];
if(/h\d/.test(e.nodeName.toLowerCase())) {
title = e;
}
}
titleWidth = title.offsetWidth;
}
};
})(ionic);
;
(function(ionic) {
@ -1740,27 +1710,29 @@ window.ionic = {
};
})(ionic);
;
(function(ionic) {
;(function(ionic) {
ionic.views.SideMenu = function(opts) {
ionic.views.HeaderBar = function(opts) {
this.el = opts.el;
this.width = opts.width;
this.isEnabled = opts.isEnabled || true;
this._titleEl = this.el.querySelector('.title');
};
ionic.views.SideMenu.prototype = {
getFullWidth: function() {
return this.width;
},
setIsEnabled: function(isEnabled) {
this.isEnabled = isEnabled;
},
bringUp: function() {
this.el.style.zIndex = 0;
},
pushDown: function() {
this.el.style.zIndex = -1;
ionic.views.HeaderBar.prototype = {
resizeTitle: function() {
var e, j, i,
title,
titleWidth,
children = this.el.children;
for(i = 0, j = children.length; i < j; i++) {
e = children[i];
if(/h\d/.test(e.nodeName.toLowerCase())) {
title = e;
}
}
titleWidth = title.offsetWidth;
}
};
@ -1967,6 +1939,31 @@ ionic.views.TabBar.prototype = {
})(window.ionic);
;
(function(ionic) {
ionic.views.SideMenu = function(opts) {
this.el = opts.el;
this.width = opts.width;
this.isEnabled = opts.isEnabled || true;
};
ionic.views.SideMenu.prototype = {
getFullWidth: function() {
return this.width;
},
setIsEnabled: function(isEnabled) {
this.isEnabled = isEnabled;
},
bringUp: function() {
this.el.style.zIndex = 0;
},
pushDown: function() {
this.el.style.zIndex = -1;
}
};
})(ionic);
;
(function(ionic) {
ionic.views.Toggle = function(opts) {
@ -2413,3 +2410,59 @@ ionic.controllers.TabBarController.prototype = {
}
})(ionic = window.ionic || {});
;(function(window, document, ionic) {
// polyfill use to simulate native "tap"
function inputTapPolyfill(ele, e) {
if(ele.type === "radio" || ele.type === "checkbox") {
ele.checked = !ele.checked;
} else if(ele.type === "submit" || ele.type === "button") {
ele.click();
} else {
ele.focus();
}
e.stopPropagation();
e.preventDefault();
return false;
}
function tapPolyfill(e) {
// if the source event wasn't from a touch event then don't use this polyfill
if(!e.gesture || e.gesture.pointerType !== "touch" || !e.gesture.srcEvent) return;
var
e = e.gesture.srcEvent, // evaluate the actual source event, not the created event by gestures.js
ele = e.target;
while(ele) {
if( ele.tagName === "INPUT" || ele.tagName === "TEXTAREA" || ele.tagName === "SELECT" ) {
return inputTapPolyfill(ele, e);
} else if( ele.tagName === "LABEL" ) {
if(ele.control) {
return inputTapPolyfill(ele.control, e);
}
} else if( ele.tagName === "A" || ele.tagName === "BUTTON" ) {
ele.click();
e.stopPropagation();
e.preventDefault();
return false;
}
ele = ele.parentElement;
}
// they didn't tap one of the above elements
// if the currently active element is an input, and they tapped outside
// of the current input, then unset its focus (blur) so the keyboard goes away
var activeElement = document.activeElement;
if(activeElement && (activeElement.tagName === "INPUT" || activeElement.tagName === "TEXTAREA" || activeElement.tagName === "SELECT")) {
activeElement.blur();
e.stopPropagation();
e.preventDefault();
return false;
}
}
// global tap event listener polyfill for HTML elements that were "tapped" by the user
ionic.on("tap", tapPolyfill, window);
})(this, document, ionic);

17
dist/ionicIcons.css vendored
View File

@ -1684,17 +1684,21 @@ textarea {
.input-group {
overflow: hidden;
border-top: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
background-color: white; }
/*
border-top: $input-border-width solid $input-border-color;
border-bottom: $input-border-width solid $input-border-color;
background-color: $input-bg;
*/ }
.padded > .input-group,
.input-group.inset {
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
border-right: 1px solid #cccccc;
border-left: 1px solid #cccccc; }
/*
border-right: $input-border-width solid $input-border-color;
border-left: $input-border-width solid $input-border-color;
*/ }
.input-group .input-wrapper + .input-wrapper {
border-top: 1px solid #cccccc; }
@ -1981,7 +1985,8 @@ input[type="checkbox"][readonly] {
opacity: 0.4; }
.button.button-block {
display: block;
margin: 10px 0 10px 0; }
margin: 10px 0 10px 0;
width: 100%; }
.button.button-default {
color: #333333;
background-color: white;

View File

@ -1,21 +1,3 @@
$toggle-width: 54px;
$toggle-height: 32px;
$toggle-border-width: 2px;
$toggle-border-radius: 20px;
$toggle-handle-radius: 20px;
$toggle-off-bg-color: #fff;
$toggle-off-border-color: #ddd;
$toggle-on-bg-color: #4bd863;
$toggle-on-border-color: $toggle-on-bg-color;
$toggle-handle-off-bg-color: #fff;
$toggle-handle-on-bg-color: $toggle-handle-off-bg-color;
$toggle-transition-duration: .2s;
/* the overall container of the toggle */
.toggle {
display: inline-block;
@ -80,4 +62,4 @@ $toggle-transition-duration: .2s;
-webkit-transform: none;
transition-delay: .05s, 0s;
}
}
}

View File

@ -0,0 +1,18 @@
$toggle-width: 54px;
$toggle-height: 32px;
$toggle-border-width: 2px;
$toggle-border-radius: 20px;
$toggle-handle-radius: 20px;
$toggle-off-bg-color: #fff;
$toggle-off-border-color: #ddd;
$toggle-on-bg-color: #4bd863;
$toggle-on-border-color: $toggle-on-bg-color;
$toggle-handle-off-bg-color: #fff;
$toggle-handle-on-bg-color: $toggle-handle-off-bg-color;
$toggle-transition-duration: .2s;

View File

@ -4,6 +4,7 @@
// Variables
"../ionic/mixins",
"../ionic/variables",
"variables",
// Base
"../ionic/reset",