163 lines
4.2 KiB
CSS
163 lines
4.2 KiB
CSS
@font-face {
|
|
font-family: 'iconfont'; /* project id 1584362 */
|
|
src: url('//at.alicdn.com/t/font_1584362_38u2h39vioe.eot');
|
|
src: url('//at.alicdn.com/t/font_1584362_38u2h39vioe.eot?#iefix') format('embedded-opentype'),
|
|
url('//at.alicdn.com/t/font_1584362_38u2h39vioe.woff2') format('woff2'),
|
|
url('//at.alicdn.com/t/font_1584362_38u2h39vioe.woff') format('woff'),
|
|
url('//at.alicdn.com/t/font_1584362_38u2h39vioe.ttf') format('truetype'),
|
|
url('//at.alicdn.com/t/font_1584362_38u2h39vioe.svg#iconfont') format('svg');
|
|
}
|
|
html{
|
|
min-height: 100vh;
|
|
background: #F6F6F6;
|
|
|
|
}
|
|
.header{
|
|
width: 20rem;
|
|
height: 3.41rem;
|
|
background: white;
|
|
display: inline-block;
|
|
position: relative;
|
|
}
|
|
.header .title{
|
|
width:4rem;
|
|
height:0.91rem;
|
|
font-size:0.96rem;
|
|
font-family:PingFang SC;
|
|
font-weight:bold;
|
|
color:rgba(0,0,0,1);
|
|
margin-left: 8.08rem;
|
|
margin-top: 1.92rem;
|
|
line-height:0.91rem ;
|
|
}
|
|
.header a{
|
|
position: absolute;
|
|
display: block;
|
|
color:rgba(51,51,51,1);
|
|
width: 2rem;
|
|
height: 2rem;
|
|
top: 1.42rem;
|
|
font-family: 'iconfont'; /* project id 1584362 */
|
|
line-height: 2rem;
|
|
text-align: center;
|
|
font-size:1.7rem ;
|
|
font-weight: 700;
|
|
text-decoration: none;
|
|
|
|
}
|
|
.page-top{
|
|
width:20rem;
|
|
height:4rem;
|
|
background:rgba(104,130,207,1);
|
|
}
|
|
.page-top span{
|
|
width:4.5rem;
|
|
height:0.8rem;
|
|
font-size:0.85rem;
|
|
font-family:PingFang SC;
|
|
font-weight:500;
|
|
color:rgba(255,255,255,1);
|
|
line-height:0.8rem ;
|
|
display:inline-block;
|
|
margin-top: 1.49rem;
|
|
margin-left: 0.53rem;
|
|
cursor: pointer;
|
|
}
|
|
.container{
|
|
width:20rem;
|
|
height:9.92rem;
|
|
background:rgba(255,255,255,1);
|
|
position: relative;
|
|
}
|
|
.value{
|
|
width: 6.67rem;
|
|
height: 9.92rem;
|
|
margin-left: 1.92rem;
|
|
display: flex;
|
|
flex-flow: column nowrap;
|
|
justify-content: space-around;
|
|
|
|
}
|
|
.value .content{
|
|
width:6.67rem;
|
|
height:2rem;
|
|
font-size:0.75rem;
|
|
font-family:PingFang SC;
|
|
font-weight:500;
|
|
color:rgba(57,85,168,1);
|
|
position: relative;
|
|
}
|
|
.content .name,.content .time{
|
|
width: 6.67rem;
|
|
height: 1rem;
|
|
line-height: 1rem;
|
|
}
|
|
.container:before{
|
|
content: '';
|
|
position: absolute;
|
|
left: 1.12rem;
|
|
top: 1.52rem;
|
|
width:0.06rem;
|
|
height:7rem;
|
|
background:rgba(104,130,207,1);
|
|
z-index: 1;
|
|
}
|
|
.value .content:before{
|
|
width:0.4rem;
|
|
height:0.4rem;
|
|
content: '';
|
|
transform: translateY(-50%);
|
|
border-radius: 50%;
|
|
cursor: pointer;
|
|
top: 50%;
|
|
right: 7.26rem;
|
|
background: #999999;
|
|
position: absolute;
|
|
z-index: 2;
|
|
}
|
|
.value .content#a:before{
|
|
width: 0.53rem;
|
|
height: 0.53rem;
|
|
background: #3955A8;
|
|
right: 7.17rem;
|
|
}
|
|
.ma{
|
|
width:20rem;
|
|
height:4.8rem;
|
|
background:rgba(255,255,255,1);
|
|
margin-top: 0.53rem;
|
|
}
|
|
.ma .top,.ma .down{
|
|
width: 19.47rem;
|
|
height: 2.4rem;
|
|
font-size:0.75rem;
|
|
font-family:PingFang SC;
|
|
font-weight:500;
|
|
color:rgba(51,51,51,1);
|
|
line-height:2.4rem;
|
|
margin-left: 0.53rem;
|
|
}
|
|
.ma .top span{
|
|
color: #3955A8;
|
|
}
|
|
.ma .down .down-left{
|
|
height: 2.4rem;
|
|
font-size:0.75rem;
|
|
font-family:PingFang SC;
|
|
font-weight:500;
|
|
color:rgba(51,51,51,1);
|
|
line-height:2.4rem;
|
|
width: 7.87rem;
|
|
float: left;
|
|
}
|
|
.ma .down .down_right{
|
|
height: 2.4rem;
|
|
font-size:0.75rem;
|
|
font-weight:500;
|
|
color:rgba(51,51,51,1);
|
|
line-height:2.4rem;
|
|
width: 5.6rem;
|
|
margin-right: 0.53rem;
|
|
float: right;
|
|
font-family: 'iconfont'; /* project id 1584362 */
|
|
} |