hexo-theme-stellar/source/css/_plugins/swiper.styl

49 lines
1.2 KiB
Stylus

:root
--swiper-theme-color: $color-theme !important
.swiper-container
width: 100%
border-radius: 4px
.swiper-container:not(.swiper-container-initialized)
display: none
div.swiper-slide
text-align: center
display: -webkit-box
display: -ms-flexbox
display: -webkit-flex
display: flex
align-self: center
-webkit-box-pack: center
-ms-flex-pack: center
-webkit-justify-content: center
justify-content: center
-webkit-box-align: center
-ms-flex-align: center
-webkit-align-items: center
align-items: center
width: 50%
img
border-radius: 4px
.swiper-container[width='max'] div.swiper-slide
width: 100%
.swiper-container[width='min'] div.swiper-slide
width: 25%
.swiper-button-prev,.swiper-button-next
padding: 1rem 0.5rem
margin-top: -2rem !important
border-radius: 4px
background: alpha(white, 0.25)
trans1 background
--swiper-theme-color: black !important
@supports (backdrop-filter: blur(20px))
background: alpha(white, 0.5)
backdrop-filter: saturate(200%) blur(20px)
&:after
font-size: 1.2rem !important
font-weight: 700 !important
&:hover
background: white
--swiper-theme-color: $color-hover !important