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.
81 lines
2.0 KiB
81 lines
2.0 KiB
6 years ago
|
.preload-project-item {
|
||
|
width: 100%;
|
||
|
background: #fff;
|
||
|
box-sizing: border-box;
|
||
|
border-radius: 16rpx;
|
||
|
padding: 0 24rpx;
|
||
|
overflow: hidden;
|
||
|
margin-bottom: 20rpx;
|
||
|
}
|
||
|
.preload-project-item .header {
|
||
|
height: 52rpx;
|
||
|
margin-bottom: 10rpx;
|
||
|
margin-top: 20rpx;
|
||
|
border-radius: 8rpx;
|
||
|
background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%);
|
||
|
animation: loading 1.4s ease infinite;
|
||
|
background-size: 400% 100%;
|
||
|
}
|
||
|
.preload-project-item .content {
|
||
|
width: 100%;
|
||
|
height: 120rpx;
|
||
|
border-radius: 8rpx;
|
||
|
background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%);
|
||
|
animation: loading 1.4s ease infinite;
|
||
|
background-size: 400% 100%;
|
||
|
}
|
||
|
.preload-project-item .image-list {
|
||
|
display:grid;
|
||
|
grid-template-columns: repeat(auto-fit, minmax(214rpx, 1fr));
|
||
|
grid-gap: 10rpx;
|
||
|
height: 160rpx;
|
||
|
margin-top: 20rpx;
|
||
|
}
|
||
|
.preload-project-item .image-list .image-list-item {
|
||
|
width: 100%;
|
||
|
height: 100%;
|
||
|
border-radius: 16rpx;
|
||
|
overflow: hidden;
|
||
|
background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%);
|
||
|
animation: loading 1.4s ease infinite;
|
||
|
background-size: 400% 100%;
|
||
|
}
|
||
|
.preload-project-item .type {
|
||
|
height: 20rpx;
|
||
|
margin-top: 10rpx;
|
||
|
margin-bottom: 10rpx;
|
||
|
border-radius: 2rpx;
|
||
|
width: 50%;
|
||
|
background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%);
|
||
|
animation: loading 1.4s ease infinite;
|
||
|
background-size: 400% 100%;
|
||
|
}
|
||
|
.preload-project-item .hot-remark {
|
||
|
width: 100%;
|
||
|
height: 120rpx;
|
||
|
border-radius: 8rpx;
|
||
|
background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%);
|
||
|
animation: loading 1.4s ease infinite;
|
||
|
background-size: 400% 100%;
|
||
|
}
|
||
|
.preload-project-item .altitude {
|
||
|
width:100%;
|
||
|
height: 30rpx;
|
||
|
margin: 10rpx 0;
|
||
|
border-radius: 2rpx;
|
||
|
background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%);
|
||
|
animation: loading 1.4s ease infinite;
|
||
|
background-size: 400% 100%;
|
||
|
margin-bottom: 35rpx;
|
||
|
}
|
||
|
|
||
|
|
||
|
@keyframes loading {
|
||
|
0% {
|
||
|
background-position: 100% 50%
|
||
|
}
|
||
|
|
||
|
100% {
|
||
|
background-position: 0 50%
|
||
|
}
|
||
|
}
|