javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-08 15:51:16 +08:00
Code Issues Packages Projects Releases Wiki Activity

Fixed #130 - blurry PTR icon

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

13
dist/css/ionic.css vendored
View File

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

12
dist/js/ionic-angular.js vendored
View File

@ -558,17 +558,17 @@ angular.module('ionic.ui.content', [])
// Scale up the refreshing icon // Scale up the refreshing icon
var onRefreshOpening = ionic.throttle(function(e, amt) { 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); }, 100);
$scope.$on('onRefreshing', function(e) { $scope.$on('scroll.onRefreshing', function(e) {
icon.style[ionic.CSS.TRANSFORM] = 'scale(2)'; 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)'; 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'), hasPullToRefresh: ($scope.hasPullToRefresh !== 'false'),
onRefresh: function() { onRefresh: function() {
$scope.onRefresh(); $scope.onRefresh();
$scope.$parent.$broadcast('onRefresh'); $scope.$parent.$broadcast('scroll.onRefresh');
}, },
onRefreshOpening: function(amt) { onRefreshOpening: function(amt) {
$scope.onRefreshOpening({amount: amt}); $scope.onRefreshOpening({amount: amt});
$scope.$parent.$broadcast('onRefreshOpening', amt); $scope.$parent.$broadcast('scroll.onRefreshOpening', amt);
} }
}); });

8
js/ext/angular/src/directive/ionicContent.js vendored
View File

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

4
js/ext/angular/src/directive/ionicList.js vendored
View File

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

11
scss/_scaffolding.scss
View File

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