@charset "UTF-8"; .uni-load-more { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; flex-direction: row; height: 80rpx; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center } .uni-load-more__text { font-size: 28rpx; color: #999 } .uni-load-more__img { height: 24px; width: 24px; margin-right: 10px } .uni-load-more__img>.load { position: absolute } .uni-load-more__img>.load .item { width: 6px; height: 2px; border-top-left-radius: 1px; border-bottom-left-radius: 1px; background: #999; position: absolute; opacity: .2; -webkit-transform-origin: 50%; transform-origin: 50%; -webkit-animation: load 1.56s ease infinite; animation: load 1.56s ease infinite } .uni-load-more__img>.load .item:nth-child(1) { -webkit-transform: rotate(90deg); transform: rotate(90deg); top: 2px; left: 9px } .uni-load-more__img>.load .item:nth-child(2) { -webkit-transform: rotate(180deg); transform: rotate(180deg); top: 11px; right: 0 } .uni-load-more__img>.load .item:nth-child(3) { -webkit-transform: rotate(270deg); transform: rotate(270deg); bottom: 2px; left: 9px } .uni-load-more__img>.load .item:nth-child(4) { top: 11px; left: 0 } .load1, .load2, .load3 { height: 24px; width: 24px } .load2 { -webkit-transform: rotate(30deg); transform: rotate(30deg) } .load3 { -webkit-transform: rotate(60deg); transform: rotate(60deg) } .load1 .item:nth-child(1) { -webkit-animation-delay: 0s; animation-delay: 0s } .load2 .item:nth-child(1) { -webkit-animation-delay: .13s; animation-delay: .13s } .load3 .item:nth-child(1) { -webkit-animation-delay: .26s; animation-delay: .26s } .load1 .item:nth-child(2) { -webkit-animation-delay: .39s; animation-delay: .39s } .load2 .item:nth-child(2) { -webkit-animation-delay: .52s; animation-delay: .52s } .load3 .item:nth-child(2) { -webkit-animation-delay: .65s; animation-delay: .65s } .load1 .item:nth-child(3) { -webkit-animation-delay: .78s; animation-delay: .78s } .load2 .item:nth-child(3) { -webkit-animation-delay: .91s; animation-delay: .91s } .load3 .item:nth-child(3) { -webkit-animation-delay: 1.04s; animation-delay: 1.04s } .load1 .item:nth-child(4) { -webkit-animation-delay: 1.17s; animation-delay: 1.17s } .load2 .item:nth-child(4) { -webkit-animation-delay: 1.3s; animation-delay: 1.3s } .load3 .item:nth-child(4) { -webkit-animation-delay: 1.43s; animation-delay: 1.43s } @-webkit-keyframes load { 0% { opacity: 1 } 100% { opacity: .2 } } @charset "UTF-8"; /* 页面左右间距 */ /* 文字尺寸 */ /*文字颜色*/ /* 边框颜色 */ /*颜色*/ /* 图片加载中颜色 */ /* 行为相关颜色 */ /* 功能栏字体大小 */ /*功能栏左侧小图标*/ page { background: #f8f8f8; height: 100%; padding-bottom: 200rpx; } page .content { height: 100%; } .navbar { display: -webkit-box; display: -webkit-flex; display: flex; height: 40px; padding: 0 5px; background: #fff; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.06); position: relative; z-index: 10; } .navbar .nav-item { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: 100%; font-size: 15px; color: #303133; position: relative; } .navbar .nav-item.current { color: #FF727E; } .navbar .nav-item.current:after { content: ''; position: absolute; left: 50%; bottom: 0; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 44px; height: 0; border-bottom: 2px solid #FF727E; } .swiper-box { height: calc(100% - 40px); padding: 0 20rpx; } .list-scroll-content { height: 100%; } .tip { width: 100%; color: #FFFFFF; padding: 30rpx 25rpx; position: fixed; background-color: #FF727E; bottom: 5%; width: 80%; left: 10%; text-align: center; border-radius: 100rpx; box-shadow: 0px 5px 16px 0px rgba(230, 33, 41, 0.22); } .scroll-list { width: 100%; overflow: hidden; white-space: nowrap; background-color: #FFFFFF; font-size: 32rpx; } .scroll-list .scoll-box { text-align: center; display: inline-block; margin: 0rpx 38rpx; padding: 15rpx 0rpx; } .scroll-list .scoll-box .scoll-img { width: 130rpx; height: 85rpx; border-radius: 100%; } .scroll-list .scoll-box .scoll-img image { width: 85rpx; height: 100%; border-radius: 100%; } .scroll-list .scoll-box .scoll-name { padding-top: 15rpx; } .scroll-list .scoll-box.active { color: #FF727E; border-bottom: 6rpx solid #FF727E; } .list { width: 100%; padding: 25rpx 25rpx; } .list .list-item { width: 100%; padding: 30rpx 28rpx; background-color: #FFFFFF; border-radius: 25rpx; margin-bottom: 25rpx; } .list .list-item .item-top { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; } .list .list-item .item-top .tip-info { background-color: #FF727E; color: #FFFFFF; border-radius: 10rpx; font-size: 28rpx; padding: 8rpx 15rpx; margin-right: 15rpx; } .list .list-item .item-top .name { font-size: 36rpx; font-weight: 500; color: #222222; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .list .list-item .title { font-weight: 400; padding-top: 25rpx; font-size: 28rpx; color: #222222; }