| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111 |
- :root {
- --swiper-theme-color: @themeColor;
- }
- .swiper-container {
- margin-left: auto;
- margin-right: auto;
- position: relative;
- overflow: hidden;
- list-style: none;
- padding: 0;
- /* Fix of Webkit flickering */
- z-index:1;
- }
- .swiper-container-vertical > .swiper-wrapper {
- flex-direction: column;
- }
- .swiper-wrapper {
- position:relative;
- width: 100%;
- height: 100%;
- z-index: 1;
- display: flex;
- transition-property:transform;
- box-sizing: content-box;
- }
- .swiper-container-android .swiper-slide, .swiper-wrapper {
- transform:translate3d(0px,0,0);
- }
- .swiper-container-multirow > .swiper-wrapper {
- flex-wrap: wrap;
- }
- .swiper-container-multirow-column > .swiper-wrapper {
- flex-wrap: wrap;
- flex-direction: column;
- }
- .swiper-container-free-mode > .swiper-wrapper {
- transition-timing-function: ease-out;
- margin: 0 auto;
- }
- .swiper-slide {
- flex-shrink: 0;
- width: 100%;
- height: 100%;
- position: relative;
- transition-property: transform;
- }
- .swiper-slide-invisible-blank {
- visibility: hidden;
- }
- /* Auto Height */
- .swiper-container-autoheight, .swiper-container-autoheight .swiper-slide {
- height: auto;
- }
- .swiper-container-autoheight .swiper-wrapper {
- align-items: flex-start;
- transition-property: transform, height;
- }
- /* 3D Effects */
- .swiper-container-3d {
- perspective: 1200px;
- .swiper-wrapper, .swiper-slide, .swiper-slide-shadow-left, .swiper-slide-shadow-right, .swiper-slide-shadow-top, .swiper-slide-shadow-bottom, .swiper-cube-shadow {
- transform-style: preserve-3d;
- }
- .swiper-slide-shadow-left, .swiper-slide-shadow-right, .swiper-slide-shadow-top, .swiper-slide-shadow-bottom {
- position: absolute;
- left: 0;
- top: 0;
- width: 100%;
- height: 100%;
- pointer-events: none;
- z-index: 10;
- }
- .swiper-slide-shadow-left {
- background-image: linear-gradient(to left, rgba(0,0,0,0.5), rgba(0,0,0,0));
- }
- .swiper-slide-shadow-right {
- background-image: linear-gradient(to right, rgba(0,0,0,0.5), rgba(0,0,0,0));
- }
- .swiper-slide-shadow-top {
- background-image: linear-gradient(to top, rgba(0,0,0,0.5), rgba(0,0,0,0));
- }
- .swiper-slide-shadow-bottom {
- background-image: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(0,0,0,0));
- }
- }
- /* CSS Mode */
- .swiper-container-css-mode {
- > .swiper-wrapper {
- overflow: auto;
- scrollbar-width: none; /* For Firefox */
- -ms-overflow-style: none; /* For Internet Explorer and Edge */
- &::-webkit-scrollbar {
- display: none;
- }
- }
- > .swiper-wrapper > .swiper-slide {
- scroll-snap-align: start start;
- }
- }
- .swiper-container-horizontal.swiper-container-css-mode {
- > .swiper-wrapper {
- scroll-snap-type: x mandatory;
- }
- }
- .swiper-container-vertical.swiper-container-css-mode {
- > .swiper-wrapper {
- scroll-snap-type: y mandatory;
- }
- }
|