github.com/mithrandie/csvq@v1.18.1/docs/_sass/components/_carousel.scss (about) 1 .carousel { 2 &.carousel-slider { 3 top: 0; 4 left: 0; 5 height: 0; 6 7 .carousel-fixed-item { 8 &.with-indicators { 9 bottom: 68px; 10 } 11 12 position: absolute; 13 left: 0; 14 right: 0; 15 bottom: 20px; 16 z-index: 1; 17 } 18 19 .carousel-item { 20 width: 100%; 21 height: 100%; 22 min-height: 400px; 23 position: absolute; 24 top: 0; 25 left: 0; 26 27 h2 { 28 font-size: 24px; 29 font-weight: 500; 30 line-height: 32px; 31 } 32 33 p { 34 font-size: 15px; 35 } 36 } 37 } 38 39 overflow: hidden; 40 position: relative; 41 width: 100%; 42 height: 400px; 43 perspective: 500px; 44 transform-style: preserve-3d; 45 transform-origin: 0% 50%; 46 47 .carousel-item { 48 display: none; 49 width: 200px; 50 height: 200px; 51 position: absolute; 52 top: 0; 53 left: 0; 54 55 & > img { 56 width: 100%; 57 } 58 } 59 60 .indicators { 61 position: absolute; 62 text-align: center; 63 left: 0; 64 right: 0; 65 bottom: 0; 66 margin: 0; 67 68 .indicator-item { 69 &.active { 70 background-color: #fff; 71 } 72 73 display: inline-block; 74 position: relative; 75 cursor: pointer; 76 height: 8px; 77 width: 8px; 78 margin: 24px 4px; 79 background-color: rgba(255,255,255,.5); 80 81 transition: background-color .3s; 82 border-radius: 50%; 83 } 84 } 85 86 // Materialbox compatibility 87 &.scrolling .carousel-item .materialboxed, 88 .carousel-item:not(.active) .materialboxed { 89 pointer-events: none; 90 } 91 }