git.roojs.org Git - ratchet/blob - lib/css/push.css

   1 /* Push styles (to be used with push.js)
   2 -------------------------------------------------- */
   3
   4 /* Fade animation */
   5 .content.fade {
   6   left: 0;
   7   opacity: 0;
   8   -webkit-transition: opacity .2s ease-in-out;
   9           transition: opacity .2s ease-in-out;
  10 }
  11 .content.fade.in {
  12   opacity: 1;
  13 }
  14
  15 /* Slide animation */
  16 .content.slide {
  17   -webkit-transform: translate3d(0, 0, 0);
  18           transform: translate3d(0, 0, 0);
  19  -webkit-transition: -webkit-transform .25s ease-in-out;
  20          transition:         transform .25s ease-in-out;
  21 }
  22 .content.slide.left {
  23   -webkit-transform: translate3d(-100%, 0, 0);
  24           transform: translate3d(-100%, 0, 0);
  25 }
  26 .content.slide.right {
  27   -webkit-transform: translate3d(100%, 0, 0);
  28           transform: translate3d(100%, 0, 0);
  29 }