fix(loading): prevent spinners in loading view from causing reflows when hidden. Closes #2013

Author: perrygovier

js/angular/service/loading.js

@@ -54,7 +54,7 @@ var LOADING_SET_DEPRECATED = '$ionicLoading instance.setContent() has been depre
  */
 IonicModule
 .constant('$ionicLoadingConfig', {
-  template: '<i class="ion-loading-d"></i>'
+  template: '<i class="icon ion-loading-d"></i>'
 })
 .factory('$ionicLoading', [
   '$ionicLoadingConfig',

scss/_loading.scss

@@ -21,6 +21,9 @@
   visibility: hidden;
   opacity: 0;
 
+  &:not(.visible) .icon {
+    display: none;
+  }
   &.visible {
     visibility: visible;
   }

test/html/loading.html

@@ -19,7 +19,7 @@
       .controller('LoadingCtrl', function($scope, $ionicLoading) {
         $scope.startLoading = function() {
           $ionicLoading.show({
-            template: '<div>Connection problem.</div><br/><div>Please check your internet connection!</div>',
+            //template: '<div>Connection problem.</div><br/><div>Please check your internet connection!</div>',
             delay: 100,
             duration: 3000
           });