Advertisement
sazid_iiuc

Untitled

Apr 1st, 2021
906
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 1.50 KB | None | 0 0
  1. @include media-query($medium-up) {
  2. .no-clear {
  3. clear: none !important;
  4. }
  5.  
  6. .thumbnails-slider_prev.thumbnails-slider_prev--product-template {
  7. display: inline-block;
  8. position: absolute;
  9. left: -9%;
  10. top: 60%;
  11. transform: translateY(-60%);
  12. z-index: 10000;
  13. padding-left: 0;
  14. }
  15.  
  16. .thumbnails-slider_next.thumbnails-slider_next--product-template {
  17. display: inline-block;
  18. position: absolute;
  19. right: -9%;
  20. top: 60%;
  21. transform: translateY(-60%);
  22. z-index: 10000;
  23. }
  24.  
  25. .product-single__photos {
  26. position: relative;
  27. padding-left: 0;
  28. }
  29.  
  30. .product-single__thumbnails-item.js.no-clear.slick-slide.slick-active {
  31. padding-top: 0;
  32. }
  33.  
  34. .thumbnails-wrapper.thumbnails-slider--active {
  35. position: relative;
  36. }
  37.  
  38. .left--arrow {
  39. position: absolute;
  40. top: 60%;
  41. transform: translateY(-60%);
  42. left: -9%;
  43. z-index: 10000;
  44. }
  45.  
  46. .right--arrow {
  47. position: absolute;
  48. top: 60%;
  49. transform: translateY(-60%);
  50. right: -9%;
  51. z-index: 10000;
  52. }
  53.  
  54. .slick-hidden {
  55. display: none !important;
  56. }
  57.  
  58. .slick-track {
  59. margin-top: 10px;
  60. }
  61.  
  62. .thumbnails-slider--active {
  63. max-width: 92%;
  64. margin: 0 auto;
  65. }
  66.  
  67. .product-single__thumbnail {
  68. margin: 3px 8px;
  69. }
  70. }
  71.  
  72. .thumbnails-slider__btn {
  73.     position: absolute;
  74.     top: 50%;
  75.     transform: translateY(-50%);
  76.   }
  77.  
  78.   .thumbnails-slider__prev {
  79.     left: -50px;
  80.   }
  81.  
  82.   .thumbnails-slider__next {
  83.     right: -50px;
  84.   }
  85.  
  86.  
  87. @media screen and (max-width: 749px) {
  88.   .thumbnails-slider__prev {
  89.     left: -20px;
  90.   }
  91.  
  92.   .thumbnails-slider__next {
  93.     right: -20px;
  94.   }
  95. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement