#app {
height: 100%;
}
html,
body {
position: relative;
height: 100%;
box-sizing: border-box;
}
/*去除a标签下划线*/
a {
text-decoration: none;
}
/*去除未被访问的a标签的下划线*/
a:link {
text-decoration: none;
}
/*去除已经被访问过的a标签的下划线*/
a:visited {
text-decoration: none;
}
/*去除鼠标悬停时的a标签的下划线*/
a:hover {
text-decoration: none;
}
/*去除正在点击的a标签的下划线(鼠标按下,尚未松开)*/
a:active {
text-decoration: none;
}
/*去除获得焦点的a标签的下划线(被鼠标点击过)*/
a:focus {
text-decoration: none;
}
.page_padding_top {
padding-top: $header_height;
width: 100%;
height: 100%;
box-sizing: border-box;
}
.flex_center {
display: flex;
align-items: center;
justify-content: center;
}
body {
background: #eee;
font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
font-size: 14px;
color: #000;
margin: 0;
padding: 0;
}
.swiper {
width: 100%;
height: 100%;
}
.swiper-slide {
// text-align: center;
font-size: 18px;
background: #fff;
box-sizing: border-box;
/* Center slide text vertically */
display: flex !important;
justify-content: center !important;
align-items: center !important;
img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
}
// 头部轮播 pagination重写样式
.header_swiper {
position: relative;
.swiper-pagination {
position: absolute;
right: 0 !important;
left: 90vw !important;
bottom: 90px !important;
width: 52px !important;
.swiper-pagination-bullet {
width: 5px;
height: 5px;
background-color: #576166;
}
.swiper-pagination-bullet-active {
background-color: $theme_color;
}
}
}
.autoplay-progress {
position: absolute;
left: 90vw;
bottom: 73px;
z-index: 10;
width: 100px;
height: 10px;
display: flex;
align-items: center;
justify-content: center;
font-weight: bold;
}
.autoplay-progress svg {
--progress: 0;
position: absolute;
left: 0;
top: 0;
z-index: 10;
width: 100%;
height: 100%;
stroke-width: 20px;
fill: none;
stroke: $theme_color;
stroke-dashoffset: calc(480 * (1 - var(--progress)));
stroke-dasharray: 480;
}