Blame view

src/main/webapp/libs/offline/sass/_keyframes.sass 1.74 KB
caiyongsong committed
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67
@import compass/css3
@import mixins

=keyframes-offline-fadein
    +offline-keyframes("offline-fadein")
        0%
            opacity: 0
        100%
            opacity: 1

=keyframes-offline-fadeout
    +offline-keyframes("offline-fadeout")
        0%
            opacity: 1
        100%
            opacity: 0

=keyframes-offline-fadeout-and-hide
    +offline-keyframes("offline-fadeout-and-hide")
        0%
            opacity: 1
            display: block
        99%
            opacity: 0
            display: block
        100%
            opacity: 0
            display: none

=keyframes-offline-dropin
    +offline-keyframes("offline-dropin")
        // We start at 0 first and, while hidden
        // move to -800px, where the animation
        // really begins. This was necessary because
        // otherwise, when starting the animation
        // at -800px, the browser scrolls up 800px
        // to try to display this object positioned
        // above the page.
        // https://github.com/HubSpot/vex/issues/21
        0%
            +offline-transform(translateY(0))
            opacity: 0
        1%
            +offline-transform(translateY(-800px))
            opacity: 0

        // Real animation begins here
        2%
            +offline-transform(translateY(-800px))
            opacity: 1
        100%
            +offline-transform(translateY(0))
            opacity: 1

=keyframes-offline-dropout
    +offline-keyframes("offline-dropout")
        0%
            +offline-transform(translateY(0))
        100%
            +offline-transform(translateY(-800px))

=keyframes-offline-rotation
    +offline-keyframes("offline-rotation")
        0%
            +offline-transform(rotate(0deg))
        100%
            +offline-transform(rotate(359deg))