effect-cube.less 1006 B

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