You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
94 lines
7.6 KiB
94 lines
7.6 KiB
/**index.wxss**/ |
|
/* .userinfo { |
|
display: flex; |
|
flex-direction: column; |
|
align-items: center; |
|
} */ |
|
/* .nav{height:420rpx;width:100%;background: linear-gradient(to bottom,#FFCB12 0%,#ffffff 100%);} */ |
|
.nav{width:100%;background: linear-gradient(to bottom,#FFCB12 0%,#ffffff 100%);} |
|
.search{height:64rpx;width:100%;padding:16rpx 0;} |
|
.search .search-box{width:94%;border-radius: 180rpx;background-color:#fff;height:100%;margin:0 auto;display:flex;justify-content: start;} |
|
.search .search-box .search-icon{width:70rpx;height:100%;} |
|
.search .search-box .search-icon image{width:32rpx;height:32rpx;padding:16rpx 0rpx 16rpx 38rpx;} |
|
.search .search-box .search-input{width:590rpx;} |
|
.search .search-box .search-input input{height:100%;width:90%;padding-left:10rpx} |
|
.banner{height:322rpx;width:100%;margin:11rpx 0;} |
|
.banner .banner-box{width:94%;border-radius: 16rpx;background-color:#fff;height:100%;margin:0 auto;} |
|
.banner .banner-box swiper{height:100%;} |
|
.banner .banner-box swiper-item{text-align: center;} |
|
.banner .banner-box swiper-item image{width: 100%;height:322rpx;border-radius: 16rpx;} |
|
.index-five{width:94%;margin:32rpx auto;display:flex;justify-content: space-around;} |
|
.index-five .five-list{width:16%;text-align: center;line-height:50rpx;color:#8D8D8D;font-size:24rpx;} |
|
.index-five .five-list image{width:96rpx;height:96rpx;} |
|
.active{width:100%;} |
|
.active .active-title{width:94%;display: flex;justify-content: start;margin:22rpx auto;height:50rpx;line-height: 50rpx;} |
|
.active .active-title .name{z-index: 2;font-size:36rpx;} |
|
.active .active-title image{width:42rpx;height:42rpx;vertical-align: sub;margin-left:-15rpx;z-index: 1} |
|
.active .ac-img{width:94%;margin:0 auto;margin-bottom:8rpx;} |
|
.active .ac-img image{width:100%;box-shadow: 0px 10px 8px 0px rgba(0,0,0,0.06);height:208rpx;border-radius: 16rpx;} |
|
.active .ing-content{width:94%;margin:22rpx auto;} |
|
.active .ing-content .ing-title{height:60rpx;line-height: 60rpx;display: flex;justify-content: start;} |
|
.active .ing-content .ing-title .title-name{width:50%;text-align: center;} |
|
.active .ing-content .ing-title .title-start{font-size:30rpx;color:#979691} |
|
.active .ing-content .ing-title .title-hot image{width:24rpx;height:24rpx} |
|
.active .ing-content .img-circle{width:100%;display: flex;justify-content: space-between;flex-wrap: wrap;margin-top:20rpx;} |
|
.four-list{width:48%;border-radius:16rpx;overflow: hidden;margin-bottom:22rpx;background: #ffffff;box-shadow: 0px 8px 8px 0px rgba(0,0,0,0.04);} |
|
.four-list .bigimg{width:100%;height:228rpx;} |
|
.four-list .four-word{padding: 5rpx 10rpx 10rpx;} |
|
.four-word .four-title{overflow: hidden;display:-webkit-box;-webkit-line-clamp:2; -webkit-box-orient: vertical; |
|
word-break:break-all;font-size:24rpx;color:#7E7B70;line-height:38rpx;} |
|
.four-word .four-log{height:40rpx;line-height:40rpx;font-size:18rpx;color:#C1C1C1;width:100%;display: flex;justify-content: space-around;text-align: center;} |
|
.four-word .four-log text{width:30%;word-break:keep-all; white-space:nowrap;overflow:hidden; text-overflow:ellipsis;} |
|
.four-word .four-log view{padding:0 12rpx} |
|
.four-word .four-name{font-size:24rpx;color:#2A2A2A;line-height:40rpx;} |
|
.four-word .four-name image{width:20rpx;height:20rpx;margin-left:10rpx;vertical-align: sub;} |
|
.four-word .four-bottom{display: flex;justify-content: space-between;font-size:20rpx;color:#C9C9C9;height:40rpx;line-height:40rpx;} |
|
.four-word .four-bottom text{font-size:24rpx;color:#F66A01;font-weight:bold;} |
|
.four-word .four-bottom text text{font-size:18rpx;} |
|
.active .active-more{height:40rpx;line-height:40rpx;text-align: center;color:#FF7F0A;font-size:28rpx} |
|
.active .active-more image{height:40rpx;width:40rpx;vertical-align: sub;} |
|
.popularity{width:94%;margin:30rpx auto;height:900rpx;border-radius:16rpx;position: relative;} |
|
.popularity .popimg{width:100%;height:100%;} |
|
.popularity .popview{position: absolute;top:0;left:0;width:100%;border-radius: 20rpx; |
|
background-image: '' no-repeat;background-size: cover;} |
|
.popularity .popview .poptitle{height:60rpx;margin:20rpx auto; width:90%;display: flex;justify-content: space-between;} |
|
.popularity .popview .poptitle .title-left{height:60rpx;width:275rpx;position: relative;} |
|
.popularity .popview .poptitle .title-left image{height:100%;width:100%;} |
|
.popularity .popview .poptitle .title-left view{position: absolute;left:32rpx;top:4rpx;letter-spacing: 25rpx;color:#fff;font-weight: bold;font-size:36rpx;} |
|
.popularity .popview .poptitle .title-right{width:154rpx;height:56rpx;line-height:56rpx;opacity: 0.7; background: rgba(255,255,255,0.20); |
|
border: 1px solid #ffffff;border-radius: 71rpx;box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.08);color:#fff;font-size:24rpx;} |
|
.popularity .popview .poptitle .title-right image{width:28rpx;height:28rpx;vertical-align: sub;margin:0 8rpx;} |
|
.popularity .popview .three-list{width:88%;margin:2rpx auto 20rpx auto;opacity: 1;background: #ffffff;border: 1px solid rgba(0,0,0,0.04);border-radius: 17rpx; |
|
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.08), 0px 8px 8px 0px rgba(0,0,0,0.05);display: flex;padding:25rpx 20rpx;justify-content: space-between;} |
|
.popularity .popview .three-list .three-left{width:44%;} |
|
.popularity .popview .three-list .three-left image{width:100%;height:190rpx;border-radius: 12rpx;} |
|
.popularity .popview .three-list .three-right{width:52%;} |
|
.popularity .popview .three-list .three-title{overflow: hidden;display:-webkit-box;-webkit-line-clamp:2; -webkit-box-orient: vertical; |
|
word-break:break-all;font-size:24rpx;color:#7E7B70;line-height:38rpx;height:76rpx;} |
|
.wonderful{width:100%;background: #FAFAFA;padding:5rpx 0;} |
|
.wonderful .wonder-name{width:94%;margin:22rpx auto;height:50rpx;line-height: 50rpx;display: flex;justify-content: space-between;} |
|
.wonderful .wonderful-title{display: flex;justify-content: start;} |
|
.wonderful .wonderful-title .name{font-size:36rpx;color:#FFCB12} |
|
.wonderful .wonderful-title .names{font-size:36rpx;} |
|
.wonderful .wonderful-title image{width:42rpx;height:42rpx;vertical-align: sub;} |
|
.wonderful .wonder-more{color:#F66A01;font-size: 24rpx;} |
|
.wonderful .wonder-more image{width:28rpx;height:28rpx;vertical-align: sub;} |
|
.wonderful .wonder-view{width:94%;margin:20rpx auto;display: flex;justify-content: space-between;} |
|
.wonderful .wonder-view .wonder-list{width:31%;background: #ffffff;border-radius: 16rpx;box-shadow: 0px 8rpx 8rpx 0px rgba(0,0,0,0.05)} |
|
.wonderful .wonder-view .wonder-list .list-top{width:128rpx;height:128rpx;margin:36rpx auto;position: relative;} |
|
.wonderful .wonder-view .wonder-list .list-top .top-ava{width:100%;height:100%;border-radius:50%;} |
|
.wonderful .wonder-view .wonder-list .list-top .top-log{position: absolute;bottom:0;right:0;width:20rpx;height:20rpx;} |
|
.wonderful .wonder-view .wonder-list .list-view{padding:5rpx 20rpx;} |
|
.wonderful .wonder-view .wonder-list .list-view .list-name{font-size:30rpx;text-align:center;} |
|
.wonderful .wonder-view .wonder-list .list-view .list-intro{color:#AEAEAE;font-size:22rpx;overflow: hidden;display:-webkit-box;-webkit-line-clamp:2; -webkit-box-orient: vertical; |
|
word-break:break-all;} |
|
.wonderful .wonder-view .wonder-list .list-view .join{height:56rpx;line-height: 56rpx;color:#FF6C01;background: #fdf6ec;border: 2rpx solid #ff6c01; |
|
border-radius: 148rpx; box-shadow: 0px 8rpx 8rpx 0px rgba(0,0,0,0.05);width:90%;margin:20rpx auto;text-align: center; font-size:28rpx;} |
|
.wonderful .wonder-view .wonder-list .list-view .joined{height:56rpx;line-height: 56rpx;color:#ccc;background: #fdf6ec;border: 2rpx solid #ccc; |
|
border-radius: 148rpx; box-shadow: 0px 8rpx 8rpx 0px rgba(0,0,0,0.05);width:90%;margin:20rpx auto;text-align: center; font-size:28rpx;} |
|
|
|
.wonderful .youlike-view{display: flex;justify-content: space-between;flex-wrap: wrap;margin:20rpx auto;width:90%} |
|
.index-three{ |
|
/* height:800rpx; */ |
|
overflow-y: scroll; |
|
} |