taiga
/
taiga-front
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

lightbox transition

stable
Juanfran 2014-08-06 08:31:50 +02:00
parent ba454aecd4
commit 2d8b04663a
3 changed files with 14 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
app/coffee/modules/common/lightboxes.coffee
View File

@ -25,10 +25,17 @@ bindOnce = @.taiga.bindOnce
class LightboxService extends taiga.Service class LightboxService extends taiga.Service
open: (lightbox) -> open: (lightbox) ->
lightbox.addClass('open') lightbox.css('display', 'flex')
setTimeout ( ->
lightbox.addClass('open')
), 70
close: (lightbox) -> close: (lightbox) ->
lightbox.removeClass('open') lightbox
.one "transitionend", () ->
lightbox.css('display', 'none')
.removeClass('open')
module.service("lightboxService", LightboxService) module.service("lightboxService", LightboxService)

2
app/coffee/modules/nav.coffee
View File

@ -55,7 +55,7 @@ ProjectsNavigationDirective = ($rootscope) ->
timeout = 500 - timeout timeout = 500 - timeout
setTimeout ( -> setTimeout ( ->
overlay.one 'webkitTransitionEnd transitionend transitionEnd', () -> overlay.one 'transitionend', () ->
overlay.hide() overlay.hide()
$(document.body) $(document.body)

5
app/styles/modules/common/lightbox.scss
View File

@ -1,9 +1,11 @@
.lightbox { .lightbox {
@include background-opacity($white, .95); @include background-opacity($white, .95);
@include table-flex(center, center, flex, row, wrap, center); @include table-flex(center, center, flex, row, wrap, center);
@include transition (opacity .3s ease);
bottom: 0; bottom: 0;
display: none; display: none;
left: 0; left: 0;
opacity: 0;
position: fixed; position: fixed;
right: 0; right: 0;
top: 0; top: 0;
@ -31,7 +33,8 @@
text-align: center; text-align: center;
} }
&.open { &.open {
display: flex; @include transition (opacity .3s ease);
opacity: 1;
} }
} }