diff --git a/app/coffee/modules/common/lightboxes.coffee b/app/coffee/modules/common/lightboxes.coffee index 1f46c5bd..8f607af4 100644 --- a/app/coffee/modules/common/lightboxes.coffee +++ b/app/coffee/modules/common/lightboxes.coffee @@ -209,25 +209,24 @@ CreateEditUserstoryDirective = ($repo, $model, $rs, $rootScope, lightboxService) return if isNew - target.html(loading) # Add item + target.addClass('loading').html(loading) # Add item promise = $repo.create("userstories", $scope.us) broadcastEvent = "usform:new:success" else - target.html(loading) # Add item - + target.addClass('loading').html(loading) # Add item promise = $repo.save($scope.us) broadcastEvent = "usform:edit:success" promise.then (data) -> - target.html(finish) # Add item + target.removeClass('loading').html(finish) # Add item lightboxService.close($el) $rootScope.$broadcast(broadcastEvent, data) promise.then null, (data) -> - target.html(loading) # Add item + target.removeClass('loading').html(finish) # Add item form.setErrors(data) if data._error_message diff --git a/app/fonts/taiga.eot b/app/fonts/taiga.eot index 261c539c..9a108ee0 100644 Binary files a/app/fonts/taiga.eot and b/app/fonts/taiga.eot differ diff --git a/app/fonts/taiga.svg b/app/fonts/taiga.svg index d153cc16..b1779c43 100644 --- a/app/fonts/taiga.svg +++ b/app/fonts/taiga.svg @@ -37,9 +37,9 @@ - + diff --git a/app/fonts/taiga.ttf b/app/fonts/taiga.ttf index 09a8ebf9..f5e6e246 100644 Binary files a/app/fonts/taiga.ttf and b/app/fonts/taiga.ttf differ diff --git a/app/fonts/taiga.woff b/app/fonts/taiga.woff index 072856de..54508d1e 100644 Binary files a/app/fonts/taiga.woff and b/app/fonts/taiga.woff differ diff --git a/app/styles/components/buttons.scss b/app/styles/components/buttons.scss index da96db3a..957ebaa0 100755 --- a/app/styles/components/buttons.scss +++ b/app/styles/components/buttons.scss @@ -24,6 +24,12 @@ &:hover { @include transition (background .3s linear); } + &.loading { + span { + @include animation (loading .5s linear); + @include animation (spin 1s linear infinite); + } + } .icon { margin-right: .3rem; } diff --git a/app/styles/dependencies/animation.scss b/app/styles/dependencies/animation.scss index 05a1f763..f2befd29 100644 --- a/app/styles/dependencies/animation.scss +++ b/app/styles/dependencies/animation.scss @@ -5,10 +5,6 @@ } } -.icon-spinner { - @include animation(spin .5s linear); -} - //Spinner @include keyframes(fadeIn) { 0% { @@ -37,3 +33,15 @@ opacity: 0; } } + +//Loading +@include keyframes(loading) { + 0% { + @include filter(blur(5px)); + opacity: 0; + } + 100% { + @include filter(blur(0)); + opacity: 1; + } +} diff --git a/app/styles/dependencies/typography.scss b/app/styles/dependencies/typography.scss index 7e89323a..6bac78d8 100755 --- a/app/styles/dependencies/typography.scss +++ b/app/styles/dependencies/typography.scss @@ -232,9 +232,6 @@ a:visited { .icon-attachments:before { content: 'D'; } -.icon-spinner:before { - content: 'E'; -} .icon-caret-up:before { content: 'F'; } @@ -247,3 +244,6 @@ a:visited { .icon-idea:before { content: 'I'; } +.icon-spinner:before { + content: 'E'; +}