effect-cube.scss 974 B

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. .swiper-cube {
  2. overflow: visible;
  3. &.swiper-rtl .swiper-slide {
  4. transform-origin: 100% 0;
  5. }
  6. .swiper-cube-shadow {
  7. position: absolute;
  8. left: 0;
  9. bottom: 0px;
  10. width: 100%;
  11. height: 100%;
  12. opacity: 0.6;
  13. z-index: 0;
  14. &:before {
  15. content: '';
  16. background: #000;
  17. position: absolute;
  18. left: 0;
  19. top: 0;
  20. bottom: 0;
  21. right: 0;
  22. -webkit-filter: blur(50px);
  23. filter: blur(50px);
  24. }
  25. }
  26. }
  27. .swiper-slide-cube {
  28. pointer-events: none;
  29. backface-visibility: hidden;
  30. z-index: 1;
  31. visibility: hidden;
  32. transform-origin: 0 0;
  33. width: 100%;
  34. height: 100%;
  35. transform-style: preserve-3d;
  36. .swiper-slide {
  37. pointer-events: none;
  38. }
  39. }
  40. .swiper-slide-cube.swiper-slide-active,
  41. .swiper-slide-cube.swiper-slide-next,
  42. .swiper-slide-cube.swiper-slide-prev,
  43. .swiper-slide-cube.swiper-slide-next + .swiper-slide {
  44. pointer-events: auto;
  45. visibility: visible;
  46. }