|
@@ -7,10 +7,10 @@
|
|
position:relative;
|
|
position:relative;
|
|
.picturebox{
|
|
.picturebox{
|
|
width: 100%;
|
|
width: 100%;
|
|
- height: 438rpx;
|
|
|
|
|
|
+ height: 442rpx;
|
|
.img{
|
|
.img{
|
|
width: 100%;
|
|
width: 100%;
|
|
- height: 438rpx;
|
|
|
|
|
|
+ height: 442rpx;
|
|
image{
|
|
image{
|
|
width: 100%;
|
|
width: 100%;
|
|
height: 100%;
|
|
height: 100%;
|
|
@@ -27,8 +27,8 @@
|
|
margin-top: -62rpx;
|
|
margin-top: -62rpx;
|
|
z-index: 100;
|
|
z-index: 100;
|
|
.infobox{
|
|
.infobox{
|
|
- width: 94%;
|
|
|
|
- height: 217rpx;
|
|
|
|
|
|
+ width: 686rpx;
|
|
|
|
+ height: 222rpx;
|
|
background-color: white;
|
|
background-color: white;
|
|
display: flex;
|
|
display: flex;
|
|
justify-content: center;
|
|
justify-content: center;
|
|
@@ -62,7 +62,7 @@
|
|
border-top: solid #e5e5e5 2rpx;
|
|
border-top: solid #e5e5e5 2rpx;
|
|
.today{
|
|
.today{
|
|
font-size: 28rpx;
|
|
font-size: 28rpx;
|
|
- color: gray;
|
|
|
|
|
|
+ color: #707070;
|
|
margin-left: 10rpx;
|
|
margin-left: 10rpx;
|
|
display: flex;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
justify-content: flex-end;
|
|
@@ -70,6 +70,7 @@
|
|
.start{
|
|
.start{
|
|
display: flex;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
justify-content: flex-end;
|
|
|
|
+ color: #000000;
|
|
}
|
|
}
|
|
.day{
|
|
.day{
|
|
display: flex;
|
|
display: flex;
|
|
@@ -78,12 +79,13 @@
|
|
margin-left: auto;
|
|
margin-left: auto;
|
|
width: 90rpx;
|
|
width: 90rpx;
|
|
height: 42rpx;
|
|
height: 42rpx;
|
|
- background-color: #ECECEC;
|
|
|
|
- font-size: 25rpx;
|
|
|
|
|
|
+ background-color: #D9D9D980;
|
|
|
|
+ font-size: 22rpx;
|
|
color: black;
|
|
color: black;
|
|
}
|
|
}
|
|
.end{
|
|
.end{
|
|
margin-left: auto;
|
|
margin-left: auto;
|
|
|
|
+ color: #000000;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
@@ -92,7 +94,6 @@
|
|
|
|
|
|
|
|
|
|
.Legendary-Information{
|
|
.Legendary-Information{
|
|
- margin-top: 12rpx;
|
|
|
|
width: 100%;
|
|
width: 100%;
|
|
background-color: white;
|
|
background-color: white;
|
|
overflow-y: hidden;
|
|
overflow-y: hidden;
|
|
@@ -102,12 +103,12 @@
|
|
display: flex;
|
|
display: flex;
|
|
justify-content: center;
|
|
justify-content: center;
|
|
flex-wrap: wrap; /* 允许换行 */
|
|
flex-wrap: wrap; /* 允许换行 */
|
|
- gap: 20rpx; /* 设置间距 */
|
|
|
|
|
|
+ gap: 10rpx; /* 设置间距 */
|
|
|
|
|
|
.container {
|
|
.container {
|
|
display: flex; /* 使用 Flexbox 布局 */
|
|
display: flex; /* 使用 Flexbox 布局 */
|
|
flex-direction: column; /* 垂直排列 */
|
|
flex-direction: column; /* 垂直排列 */
|
|
- width: calc(50% - 20rpx); /* 计算宽度,考虑间距 */
|
|
|
|
|
|
+ width: 346rpx; /* 计算宽度,考虑间距 */
|
|
margin-bottom: 20rpx; /* 设置底部间距 */
|
|
margin-bottom: 20rpx; /* 设置底部间距 */
|
|
.picbox {
|
|
.picbox {
|
|
height: 280rpx;
|
|
height: 280rpx;
|
|
@@ -137,44 +138,49 @@
|
|
}
|
|
}
|
|
.cardbox {
|
|
.cardbox {
|
|
width:100%; /* 计算宽度,考虑间距 */
|
|
width:100%; /* 计算宽度,考虑间距 */
|
|
- margin-bottom: 20rpx; /* 设置卡片底部间距 */
|
|
|
|
background-color: #F9F9F9;
|
|
background-color: #F9F9F9;
|
|
box-sizing: border-box; /* 确保内边距和边框包含在宽度内 */
|
|
box-sizing: border-box; /* 确保内边距和边框包含在宽度内 */
|
|
- margin-bottom: 20rpx; /* 设置卡片底部间距 */
|
|
|
|
|
|
+ margin-bottom: 10rpx; /* 设置卡片底部间距 */
|
|
// width: 49%; /* 确保卡片宽度为100% */
|
|
// width: 49%; /* 确保卡片宽度为100% */
|
|
- height: auto;
|
|
|
|
|
|
+ height: 398rpx;
|
|
background-color: #F9F9F9;
|
|
background-color: #F9F9F9;
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: center;
|
|
|
|
+ align-items: center;
|
|
|
|
+ flex-direction: column;
|
|
// float: left;
|
|
// float: left;
|
|
.pic{
|
|
.pic{
|
|
- width: 100%;
|
|
|
|
- height: 206rpx;
|
|
|
|
|
|
+ width: 336rpx;
|
|
|
|
+ height: 198rpx;
|
|
border-radius: 10rpx;
|
|
border-radius: 10rpx;
|
|
}
|
|
}
|
|
.textobx{
|
|
.textobx{
|
|
- width: 100%;
|
|
|
|
- height: auto;
|
|
|
|
|
|
+ width: 302rpx;
|
|
|
|
+ height: 152rpx;
|
|
|
|
+ margin-bottom: 20rpx;
|
|
// padding-top: 6rpx;
|
|
// padding-top: 6rpx;
|
|
- padding-left: 20rpx;
|
|
|
|
- padding-right: 20rpx;
|
|
|
|
.title{
|
|
.title{
|
|
width: 100%;
|
|
width: 100%;
|
|
height: 50rpx;
|
|
height: 50rpx;
|
|
|
|
+ margin-top: 4rpx;
|
|
display: flex;
|
|
display: flex;
|
|
align-items: center;
|
|
align-items: center;
|
|
.til{
|
|
.til{
|
|
font-size: 28rpx;
|
|
font-size: 28rpx;
|
|
- font-weight: 600;
|
|
|
|
|
|
+ font-weight: 700;
|
|
|
|
+ color: #000000;
|
|
}
|
|
}
|
|
.collect{
|
|
.collect{
|
|
- width: 50rpx;
|
|
|
|
- height: 50rpx;
|
|
|
|
|
|
+ width: 46rpx;
|
|
|
|
+ height: 46rpx;
|
|
margin-left: auto;
|
|
margin-left: auto;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.miaosu{
|
|
.miaosu{
|
|
- width: 100%;
|
|
|
|
- height: 72rpx; /* 设置固定高度 */
|
|
|
|
- font-size: 28rpx;
|
|
|
|
|
|
+ width: 284rpx;
|
|
|
|
+ height: 70rpx; /* 设置固定高度 */
|
|
|
|
+ font-size: 26rpx;
|
|
|
|
+ font-weight: 400;
|
|
overflow: hidden; /* 隐藏超出部分 */
|
|
overflow: hidden; /* 隐藏超出部分 */
|
|
display: -webkit-box; /* 使用弹性盒子布局 */
|
|
display: -webkit-box; /* 使用弹性盒子布局 */
|
|
-webkit-box-orient: vertical; /* 垂直排列 */
|
|
-webkit-box-orient: vertical; /* 垂直排列 */
|
|
@@ -187,18 +193,21 @@
|
|
}
|
|
}
|
|
.bottom{
|
|
.bottom{
|
|
width: 100%;
|
|
width: 100%;
|
|
- height: 68rpx;
|
|
|
|
|
|
+ height: 46rpx;
|
|
|
|
+ margin-top: 4rpx;
|
|
display: flex;
|
|
display: flex;
|
|
- align-items: center;
|
|
|
|
|
|
+
|
|
.qian{
|
|
.qian{
|
|
- color: #C5262Ced;
|
|
|
|
|
|
+ font-size: 28;
|
|
|
|
+ font-weight: 400;
|
|
|
|
+ color: #C5262C;
|
|
display: flex;
|
|
display: flex;
|
|
.numbox{
|
|
.numbox{
|
|
margin-left: 6rpx;
|
|
margin-left: 6rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.soucang{
|
|
.soucang{
|
|
- width: 110rpx;
|
|
|
|
|
|
+ width: 118rpx;
|
|
height: 46rpx;
|
|
height: 46rpx;
|
|
font-size: 25rpx;
|
|
font-size: 25rpx;
|
|
background-color: #343027;
|
|
background-color: #343027;
|