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.
128 lines
2.0 KiB
128 lines
2.0 KiB
2 years ago
|
|
||
|
|
page{
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
background: #17181a;
|
||
|
|
color: #ccc;
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tab{
|
||
|
|
display: flex;
|
||
|
|
}
|
||
|
|
.tab-item{
|
||
|
|
flex: 1;
|
||
|
|
font-size: 10pt;
|
||
|
|
text-align: center;
|
||
|
|
line-height: 72rpx;
|
||
|
|
border-bottom: 6rpx solid #eee;
|
||
|
|
}
|
||
|
|
.content{
|
||
|
|
flex: 1;
|
||
|
|
}
|
||
|
|
.content>swiper{
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
.player{
|
||
|
|
background: #222;
|
||
|
|
border-top: 1px solid #252525;
|
||
|
|
height: 112rpx;
|
||
|
|
}
|
||
|
|
.tab-item.active{
|
||
|
|
color:#c25b5b;
|
||
|
|
border-bottom-color: #c25b5b;
|
||
|
|
}
|
||
|
|
.content-info{
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
::-webkit-scrollbar{
|
||
|
|
width: 0;
|
||
|
|
height: 0;
|
||
|
|
color: transparent;
|
||
|
|
}
|
||
|
|
.content-info-slide {
|
||
|
|
height: 302rpx;
|
||
|
|
margin-top: 20px;
|
||
|
|
}
|
||
|
|
.content-info-slide image{
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
.content-info-portal{
|
||
|
|
display: flex;
|
||
|
|
margin-bottom: 15px;
|
||
|
|
}
|
||
|
|
.content-info-portal>view{
|
||
|
|
flex: 1;
|
||
|
|
font-size: 11pt;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
.content-info-portal image{
|
||
|
|
width: 120rpx;
|
||
|
|
height: 120rpx;
|
||
|
|
display: block;
|
||
|
|
margin: 20rpx auto;
|
||
|
|
}
|
||
|
|
::-webkit-scrollbar{
|
||
|
|
width:0;
|
||
|
|
height:0;
|
||
|
|
color:transparent;
|
||
|
|
}
|
||
|
|
.content-info-list{
|
||
|
|
font-size: 11pt;
|
||
|
|
margin-bottom:20rpx;
|
||
|
|
}
|
||
|
|
.content-info-list>.list-title{
|
||
|
|
margin: 20rpx 35rpx;
|
||
|
|
}
|
||
|
|
.content-info-list>.list-inner{
|
||
|
|
display:flex;
|
||
|
|
flex-wrap: wrap;
|
||
|
|
margin:0 20rpx;
|
||
|
|
}
|
||
|
|
.content-info-list>.list-inner>.list-item{
|
||
|
|
flex: 1;
|
||
|
|
}
|
||
|
|
.content-info-list>.list-inner>.list-item>image{
|
||
|
|
display: block;
|
||
|
|
width:200rpx;
|
||
|
|
height:200rpx;
|
||
|
|
margin:0 auto;
|
||
|
|
border-radius: 10rpx;
|
||
|
|
border:1rpx solid #555;
|
||
|
|
}
|
||
|
|
.content-info-list>.list-inner>.list-item>view{
|
||
|
|
width:200rpx;
|
||
|
|
margin:10rpx auto;
|
||
|
|
font-size: 10pt;
|
||
|
|
}
|
||
|
|
.player{
|
||
|
|
display:flex;
|
||
|
|
align-items: center;
|
||
|
|
background: #222;
|
||
|
|
border-top: 1px solid #252525;
|
||
|
|
height: 112rpx;
|
||
|
|
}
|
||
|
|
.player-cover{
|
||
|
|
width:80rpx;
|
||
|
|
height:80rpx;
|
||
|
|
margin-left: 15rpx;
|
||
|
|
border-radius: 8rpx;
|
||
|
|
border: 1px solid #333;
|
||
|
|
}
|
||
|
|
.play-info{
|
||
|
|
flex:1;
|
||
|
|
font-size: 10pt;
|
||
|
|
line-height: 38rpx;
|
||
|
|
margin-left: 20rpx;
|
||
|
|
padding-bottom: 8rpx;
|
||
|
|
}
|
||
|
|
.play-info-singer{
|
||
|
|
color:#888;
|
||
|
|
}
|
||
|
|
.player-controls image{
|
||
|
|
width:80rpx;
|
||
|
|
height: 80rpx;
|
||
|
|
margin-right:15rpx ;
|
||
|
|
}
|