Fixed #130 - blurry PTR icon

This commit is contained in:
Max Lynch
2013-11-12 19:52:47 -06:00
parent 623b78966e
commit 59b0e64309
5 changed files with 25 additions and 23 deletions

13
dist/css/ionic.css vendored
View File

@ -2289,14 +2289,15 @@ body, .ionic-body {
position: relative; }
.ionic-refresher {
width: 10px;
height: 10px;
width: 20px;
height: 20px;
border-radius: 50%;
background-color: #4a87ee;
position: absolute;
left: 50%;
margin-left: -5px;
bottom: 25px; }
bottom: 25px;
-webkit-transform: scale(0.2); }
.scroll-refreshing {
-webkit-transition: height 0.1s ease-in-out; }
@ -2306,13 +2307,13 @@ body, .ionic-body {
@-webkit-keyframes refresher-pulsate {
0% {
-webkit-transform: scale(2, 2); }
-webkit-transform: scale(1, 1); }
50% {
-webkit-transform: scale(1.5, 1.5); }
-webkit-transform: scale(0.7, 0.7); }
100% {
-webkit-transform: scale(2, 2); } }
-webkit-transform: scale(1, 1); } }
.overflow-scroll {
overflow: auto;

View File

@ -558,17 +558,17 @@ angular.module('ionic.ui.content', [])
// Scale up the refreshing icon
var onRefreshOpening = ionic.throttle(function(e, amt) {
icon.style[ionic.CSS.TRANSFORM] = 'scale(' + Math.min((1 + amt), 2) + ')';
icon.style[ionic.CSS.TRANSFORM] = 'scale(' + Math.min((0.2 + amt), 1) + ')';
}, 100);
$scope.$on('onRefreshing', function(e) {
$scope.$on('scroll.onRefreshing', function(e) {
icon.style[ionic.CSS.TRANSFORM] = 'scale(2)';
});
$scope.$on('onRefresh', function(e) {
$scope.$on('scroll.onRefresh', function(e) {
icon.style[ionic.CSS.TRANSFORM] = 'scale(1)';
});
$scope.$on('onRefreshOpening', onRefreshOpening);
$scope.$on('scroll.onRefreshOpening', onRefreshOpening);
}
}
})
@ -732,11 +732,11 @@ angular.module('ionic.ui.list', ['ngAnimate'])
hasPullToRefresh: ($scope.hasPullToRefresh !== 'false'),
onRefresh: function() {
$scope.onRefresh();
$scope.$parent.$broadcast('onRefresh');
$scope.$parent.$broadcast('scroll.onRefresh');
},
onRefreshOpening: function(amt) {
$scope.onRefreshOpening({amount: amt});
$scope.$parent.$broadcast('onRefreshOpening', amt);
$scope.$parent.$broadcast('scroll.onRefreshOpening', amt);
}
});

View File

@ -84,17 +84,17 @@ angular.module('ionic.ui.content', [])
// Scale up the refreshing icon
var onRefreshOpening = ionic.throttle(function(e, amt) {
icon.style[ionic.CSS.TRANSFORM] = 'scale(' + Math.min((1 + amt), 2) + ')';
icon.style[ionic.CSS.TRANSFORM] = 'scale(' + Math.min((0.2 + amt), 1) + ')';
}, 100);
$scope.$on('onRefreshing', function(e) {
$scope.$on('scroll.onRefreshing', function(e) {
icon.style[ionic.CSS.TRANSFORM] = 'scale(2)';
});
$scope.$on('onRefresh', function(e) {
$scope.$on('scroll.onRefresh', function(e) {
icon.style[ionic.CSS.TRANSFORM] = 'scale(1)';
});
$scope.$on('onRefreshOpening', onRefreshOpening);
$scope.$on('scroll.onRefreshOpening', onRefreshOpening);
}
}
})

View File

@ -110,11 +110,11 @@ angular.module('ionic.ui.list', ['ngAnimate'])
hasPullToRefresh: ($scope.hasPullToRefresh !== 'false'),
onRefresh: function() {
$scope.onRefresh();
$scope.$parent.$broadcast('onRefresh');
$scope.$parent.$broadcast('scroll.onRefresh');
},
onRefreshOpening: function(amt) {
$scope.onRefreshOpening({amount: amt});
$scope.$parent.$broadcast('onRefreshOpening', amt);
$scope.$parent.$broadcast('scroll.onRefreshOpening', amt);
}
});

View File

@ -130,14 +130,15 @@ body, .ionic-body {
}
.ionic-refresher {
// A custom refresher
width: 10px;
height: 10px;
width: 20px;
height: 20px;
border-radius: 50%;
background-color: $primary;
position: absolute;
left: 50%;
margin-left: -5px;
bottom: 25px;
-webkit-transform: scale(0.2);
}
.scroll-refreshing {
-webkit-transition: height 0.1s ease-in-out;
@ -149,9 +150,9 @@ body, .ionic-body {
}
@-webkit-keyframes refresher-pulsate {
0% {-webkit-transform: scale(2, 2); }
50% {-webkit-transform: scale(1.5, 1.5); }
100% {-webkit-transform: scale(2, 2); }
0% {-webkit-transform: scale(1, 1); }
50% {-webkit-transform: scale(0.7, 0.7); }
100% {-webkit-transform: scale(1, 1); }
}
.overflow-scroll {