diff --git a/dist/css/ionic.css b/dist/css/ionic.css index 36800e6a01..e531d4e79c 100644 --- a/dist/css/ionic.css +++ b/dist/css/ionic.css @@ -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; diff --git a/dist/js/ionic-angular.js b/dist/js/ionic-angular.js index ebb1889cba..5d00cb47a2 100644 --- a/dist/js/ionic-angular.js +++ b/dist/js/ionic-angular.js @@ -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); } }); diff --git a/js/ext/angular/src/directive/ionicContent.js b/js/ext/angular/src/directive/ionicContent.js index 97d9796083..26d2405163 100644 --- a/js/ext/angular/src/directive/ionicContent.js +++ b/js/ext/angular/src/directive/ionicContent.js @@ -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); } } }) diff --git a/js/ext/angular/src/directive/ionicList.js b/js/ext/angular/src/directive/ionicList.js index 64e84b8080..9a693ea1d9 100644 --- a/js/ext/angular/src/directive/ionicList.js +++ b/js/ext/angular/src/directive/ionicList.js @@ -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); } }); diff --git a/scss/_scaffolding.scss b/scss/_scaffolding.scss index a44415b200..4cb9991948 100644 --- a/scss/_scaffolding.scss +++ b/scss/_scaffolding.scss @@ -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 {