index.wxss 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
  1. .nut-transition {
  2. transition-timing-function: ease;
  3. }
  4. .nut-fade-enter-active,
  5. .nut-fade-leave-active {
  6. transition-property: opacity;
  7. }
  8. .nut-fade-enter,
  9. .nut-fade-leave-to {
  10. opacity: 0;
  11. }
  12. .nut-fade-up-enter-active,
  13. .nut-fade-up-leave-active,
  14. .nut-fade-down-enter-active,
  15. .nut-fade-down-leave-active,
  16. .nut-fade-left-enter-active,
  17. .nut-fade-left-leave-active,
  18. .nut-fade-right-enter-active,
  19. .nut-fade-right-leave-active {
  20. transition-property: opacity, transform;
  21. }
  22. .nut-fade-up-enter,
  23. .nut-fade-up-leave-to {
  24. transform: translate3d(0, 100%, 0);
  25. opacity: 0;
  26. }
  27. .nut-fade-down-enter,
  28. .nut-fade-down-leave-to {
  29. transform: translate3d(0, -100%, 0);
  30. opacity: 0;
  31. }
  32. .nut-fade-left-enter,
  33. .nut-fade-left-leave-to {
  34. transform: translate3d(-100%, 0, 0);
  35. opacity: 0;
  36. }
  37. .nut-fade-right-enter,
  38. .nut-fade-right-leave-to {
  39. transform: translate3d(100%, 0, 0);
  40. opacity: 0;
  41. }
  42. .nut-slide-up-enter-active,
  43. .nut-slide-up-leave-active,
  44. .nut-slide-down-enter-active,
  45. .nut-slide-down-leave-active,
  46. .nut-slide-left-enter-active,
  47. .nut-slide-left-leave-active,
  48. .nut-slide-right-enter-active,
  49. .nut-slide-right-leave-active {
  50. transition-property: transform;
  51. }
  52. .nut-slide-up-enter,
  53. .nut-slide-up-leave-to {
  54. transform: translate3d(0, 100%, 0);
  55. }
  56. .nut-slide-down-enter,
  57. .nut-slide-down-leave-to {
  58. transform: translate3d(0, -100%, 0);
  59. }
  60. .nut-slide-left-enter,
  61. .nut-slide-left-leave-to {
  62. transform: translate3d(-100%, 0, 0);
  63. }
  64. .nut-slide-right-enter,
  65. .nut-slide-right-leave-to {
  66. transform: translate3d(100%, 0, 0);
  67. }