一体机放大效果开发
This commit is contained in:
@@ -576,16 +576,16 @@ function getHoursBetween(startTimeStr, endTimeStr) {
|
||||
}
|
||||
|
||||
.btnback {
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
width: 96rpx;
|
||||
height: 96rpx;
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 52rpx;
|
||||
height: 52rpx;
|
||||
width: 78rpx;
|
||||
height: 78rpx;
|
||||
}
|
||||
|
||||
image {
|
||||
@@ -599,16 +599,16 @@ image {
|
||||
flex-direction: column;
|
||||
|
||||
.content-top {
|
||||
padding: 28rpx;
|
||||
padding-top: 50rpx;
|
||||
padding: 42rpx;
|
||||
padding-top: 75rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
|
||||
.companyinfo-left {
|
||||
width: 96rpx;
|
||||
height: 96rpx;
|
||||
margin-right: 24rpx;
|
||||
width: 144rpx;
|
||||
height: 144rpx;
|
||||
margin-right: 36rpx;
|
||||
}
|
||||
|
||||
.companyinfo-right {
|
||||
@@ -616,7 +616,7 @@ image {
|
||||
|
||||
.row1 {
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
font-size: 48rpx;
|
||||
color: #333333;
|
||||
font-family: "PingFangSC-Medium", "PingFang SC", "Helvetica Neue",
|
||||
Helvetica, Arial, "Microsoft YaHei", sans-serif;
|
||||
@@ -624,9 +624,9 @@ image {
|
||||
|
||||
.row2 {
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
font-size: 42rpx;
|
||||
color: #6c7282;
|
||||
line-height: 45rpx;
|
||||
line-height: 68rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
@@ -634,15 +634,15 @@ image {
|
||||
}
|
||||
|
||||
.locations {
|
||||
padding: 0 28rpx;
|
||||
height: 86rpx;
|
||||
padding: 0 42rpx;
|
||||
height: 129rpx;
|
||||
|
||||
position: relative;
|
||||
margin-bottom: 36rpx;
|
||||
margin-bottom: 54rpx;
|
||||
|
||||
.location-img {
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
border: 2rpx solid #efefef;
|
||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||
border: 3rpx solid #efefef;
|
||||
}
|
||||
|
||||
.location-info {
|
||||
@@ -654,7 +654,7 @@ image {
|
||||
height: 100%;
|
||||
|
||||
.info {
|
||||
padding: 0 60rpx;
|
||||
padding: 0 90rpx;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -663,16 +663,16 @@ image {
|
||||
|
||||
.info-title {
|
||||
font-weight: 600;
|
||||
font-size: 28rpx;
|
||||
font-size: 42rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.info-text {
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
font-size: 42rpx;
|
||||
color: #9b9b9b;
|
||||
position: relative;
|
||||
padding-right: 20rpx;
|
||||
padding-right: 30rpx;
|
||||
}
|
||||
|
||||
.info-text::before {
|
||||
@@ -680,9 +680,9 @@ image {
|
||||
right: 0;
|
||||
top: 50%;
|
||||
content: "";
|
||||
width: 4rpx;
|
||||
height: 16rpx;
|
||||
border-radius: 2rpx;
|
||||
width: 6rpx;
|
||||
height: 24rpx;
|
||||
border-radius: 3rpx;
|
||||
background: #9b9b9b;
|
||||
transform: translate(0, -75%) rotate(-45deg);
|
||||
}
|
||||
@@ -692,9 +692,9 @@ image {
|
||||
right: 0;
|
||||
top: 50%;
|
||||
content: "";
|
||||
width: 4rpx;
|
||||
height: 16rpx;
|
||||
border-radius: 2rpx;
|
||||
width: 6rpx;
|
||||
height: 24rpx;
|
||||
border-radius: 3rpx;
|
||||
background: #9b9b9b;
|
||||
transform: translate(0, -25%) rotate(45deg);
|
||||
}
|
||||
@@ -703,42 +703,42 @@ image {
|
||||
}
|
||||
|
||||
.conetent-info {
|
||||
padding: 0 28rpx;
|
||||
padding: 0 42rpx;
|
||||
overflow: hidden;
|
||||
max-height: 0rpx;
|
||||
transition: max-height 0.3s ease;
|
||||
|
||||
.info-title {
|
||||
font-weight: 600;
|
||||
font-size: 28rpx;
|
||||
font-size: 42rpx;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.info-desirption {
|
||||
margin-top: 12rpx;
|
||||
margin-top: 18rpx;
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
font-size: 42rpx;
|
||||
color: #495265;
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
.title2 {
|
||||
margin-top: 48rpx;
|
||||
margin-top: 72rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.company-times {
|
||||
padding-top: 40rpx;
|
||||
padding-top: 60rpx;
|
||||
|
||||
.info-title {
|
||||
font-weight: 600;
|
||||
font-size: 28rpx;
|
||||
font-size: 42rpx;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
|
||||
.expanded {
|
||||
max-height: 1000rpx; // 足够显示完整内容
|
||||
max-height: 1500rpx; // 足够显示完整内容
|
||||
}
|
||||
|
||||
.expand {
|
||||
@@ -746,14 +746,14 @@ image {
|
||||
flex-wrap: nowrap;
|
||||
white-space: nowrap;
|
||||
justify-content: center;
|
||||
margin-bottom: 46rpx;
|
||||
margin-bottom: 69rpx;
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
font-size: 42rpx;
|
||||
color: #256bfa;
|
||||
|
||||
.expand-img {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
}
|
||||
|
||||
.expand-img-active {
|
||||
@@ -768,11 +768,11 @@ image {
|
||||
background: #f4f4f4;
|
||||
|
||||
.views {
|
||||
padding: 28rpx;
|
||||
padding: 42rpx;
|
||||
|
||||
.Detail-title {
|
||||
font-weight: 600;
|
||||
font-size: 32rpx;
|
||||
font-size: 48rpx;
|
||||
color: #000000;
|
||||
position: relative;
|
||||
|
||||
@@ -790,19 +790,19 @@ image {
|
||||
content: "";
|
||||
left: -14rpx;
|
||||
bottom: 0;
|
||||
height: 16rpx;
|
||||
width: 108rpx;
|
||||
height: 24rpx;
|
||||
width: 162rpx;
|
||||
background: linear-gradient(to right, #cbdeff, #ffffff);
|
||||
border-radius: 8rpx;
|
||||
border-radius: 12rpx;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.cards {
|
||||
padding: 32rpx;
|
||||
padding: 48rpx;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(0, 0, 0, 0.04);
|
||||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||||
margin-top: 22rpx;
|
||||
box-shadow: 0rpx 0rpx 12rpx 0rpx rgba(0, 0, 0, 0.04);
|
||||
border-radius: 30rpx 30rpx 30rpx 30rpx;
|
||||
margin-top: 33rpx;
|
||||
|
||||
.card-company {
|
||||
display: flex;
|
||||
@@ -811,36 +811,36 @@ image {
|
||||
|
||||
.company {
|
||||
font-weight: 600;
|
||||
font-size: 32rpx;
|
||||
font-size: 48rpx;
|
||||
color: #333333;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
margin-right: 10rpx;
|
||||
width: 45rpx;
|
||||
height: 45rpx;
|
||||
margin-right: 15rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.salary {
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
font-size: 42rpx;
|
||||
white-space: nowrap;
|
||||
line-height: 48rpx;
|
||||
line-height: 72rpx;
|
||||
}
|
||||
|
||||
.ris {
|
||||
background: #53acff;
|
||||
color: #fff;
|
||||
padding: 7rpx 20rpx;
|
||||
border-radius: 8rpx;
|
||||
padding: 11rpx 30rpx;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.card-companyName {
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
font-size: 42rpx;
|
||||
color: #6c7282;
|
||||
}
|
||||
|
||||
@@ -850,69 +850,69 @@ image {
|
||||
|
||||
.tag {
|
||||
width: fit-content;
|
||||
height: 30rpx;
|
||||
height: 45rpx;
|
||||
background: #e0f0ff;
|
||||
border-radius: 4rpx;
|
||||
padding: 6rpx 26rpx;
|
||||
line-height: 30rpx;
|
||||
border-radius: 6rpx;
|
||||
padding: 9rpx 39rpx;
|
||||
line-height: 45rpx;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
font-size: 36rpx;
|
||||
color: #595959;
|
||||
text-align: center;
|
||||
margin-top: 14rpx;
|
||||
margin-top: 21rpx;
|
||||
white-space: nowrap;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 20rpx;
|
||||
margin-right: 30rpx;
|
||||
|
||||
image {
|
||||
width: 22rpx;
|
||||
height: 22rpx;
|
||||
margin-right: 8rpx;
|
||||
width: 33rpx;
|
||||
height: 33rpx;
|
||||
margin-right: 12rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.card-bottom {
|
||||
margin-top: 15rpx;
|
||||
margin-top: 23rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 28rpx;
|
||||
font-size: 42rpx;
|
||||
color: #6c7282;
|
||||
}
|
||||
}
|
||||
|
||||
.detail-box {
|
||||
padding-top: 20rpx;
|
||||
padding-top: 30rpx;
|
||||
box-sizing: border-box;
|
||||
.company-header1 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 12px;
|
||||
margin-top: 18px;
|
||||
.name1 {
|
||||
font-weight: 600;
|
||||
margin-right: 12px;
|
||||
font-size: 18px;
|
||||
margin-right: 18px;
|
||||
font-size: 27px;
|
||||
}
|
||||
.company-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 15px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin-right: 23px;
|
||||
}
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.header-detail {
|
||||
background: #5599ff;
|
||||
border-radius: 18px;
|
||||
padding: 2px 16px;
|
||||
border-radius: 27px;
|
||||
padding: 3px 24px;
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
font-size: 21px;
|
||||
}
|
||||
}
|
||||
.icon {
|
||||
margin-right: 6px;
|
||||
margin-right: 9px;
|
||||
color: #409eff;
|
||||
}
|
||||
.booth-no {
|
||||
@@ -921,31 +921,31 @@ image {
|
||||
}
|
||||
|
||||
.detail-item {
|
||||
margin-top: 16rpx;
|
||||
margin-top: 24rpx;
|
||||
background: linear-gradient(to bottom, #deecff 0%, #ffffff 100%);
|
||||
box-shadow: 0 0 10rpx rgba(0, 95, 169, 0.19);
|
||||
border-radius: 12rpx;
|
||||
border: 2rpx solid #ffffff;
|
||||
padding: 30rpx;
|
||||
box-shadow: 0 0 15rpx rgba(0, 95, 169, 0.19);
|
||||
border-radius: 18rpx;
|
||||
border: 3rpx solid #ffffff;
|
||||
padding: 45rpx;
|
||||
}
|
||||
|
||||
.name {
|
||||
font-size: 32rpx;
|
||||
font-size: 48rpx;
|
||||
font-weight: 600;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
margin-top: 10rpx;
|
||||
margin-top: 15rpx;
|
||||
|
||||
.status {
|
||||
width: 160rpx;
|
||||
width: 240rpx;
|
||||
text-align: center;
|
||||
margin-left: 24rpx;
|
||||
font-size: 24rpx;
|
||||
margin-left: 36rpx;
|
||||
font-size: 36rpx;
|
||||
background-size: 100% 100%;
|
||||
font-weight: 600;
|
||||
padding: 6rpx 0;
|
||||
margin: 18rpx 0;
|
||||
padding: 9rpx 0;
|
||||
margin: 27rpx 0;
|
||||
}
|
||||
.btn {
|
||||
width: 100%;
|
||||
@@ -954,8 +954,8 @@ image {
|
||||
justify-content: flex-end;
|
||||
|
||||
button {
|
||||
margin: 10rpx;
|
||||
font-size: 24rpx;
|
||||
margin: 15rpx;
|
||||
font-size: 36rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -970,15 +970,15 @@ image {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16rpx;
|
||||
gap: 24rpx;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.tag-item {
|
||||
padding: 6rpx 30rpx;
|
||||
border-radius: 6rpx;
|
||||
padding: 9rpx 45rpx;
|
||||
border-radius: 9rpx;
|
||||
background-color: #e5f1ff;
|
||||
color: #589bff;
|
||||
font-size: 28rpx;
|
||||
font-size: 42rpx;
|
||||
|
||||
&.success {
|
||||
background-color: #e6f8eb;
|
||||
@@ -994,7 +994,7 @@ image {
|
||||
justify-content: space-between;
|
||||
color: #1477f1;
|
||||
font-weight: 600;
|
||||
font-size: 30rpx;
|
||||
font-size: 45rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1004,7 +1004,7 @@ image {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 24rpx 30rpx 10rpx 30rpx;
|
||||
padding: 36rpx 45rpx 15rpx 45rpx;
|
||||
|
||||
.time-left,
|
||||
.time-right {
|
||||
@@ -1012,23 +1012,23 @@ image {
|
||||
|
||||
.left-date {
|
||||
font-weight: 500;
|
||||
font-size: 48rpx;
|
||||
font-size: 72rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.left-dateDay {
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
font-size: 36rpx;
|
||||
color: #333333;
|
||||
margin-top: 12rpx;
|
||||
margin-top: 18rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.line {
|
||||
width: 40rpx;
|
||||
width: 60rpx;
|
||||
height: 0rpx;
|
||||
border: 2rpx solid #d4d4d4;
|
||||
margin-top: 64rpx;
|
||||
border: 3rpx solid #d4d4d4;
|
||||
margin-top: 96rpx;
|
||||
}
|
||||
|
||||
.time-center {
|
||||
@@ -1040,45 +1040,45 @@ image {
|
||||
|
||||
.center-date {
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
font-size: 42rpx;
|
||||
color: #ff881a;
|
||||
}
|
||||
|
||||
.center-dateDay {
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
font-size: 36rpx;
|
||||
color: #333333;
|
||||
margin-top: 6rpx;
|
||||
line-height: 48rpx;
|
||||
width: 104rpx;
|
||||
height: 48rpx;
|
||||
margin-top: 9rpx;
|
||||
line-height: 72rpx;
|
||||
width: 156rpx;
|
||||
height: 72rpx;
|
||||
background: #f9f9f9;
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx -4rpx 24rpx 0rpx rgba(11, 44, 112, 0.12);
|
||||
box-shadow: 0rpx -4rpx 36rpx 0rpx rgba(11, 44, 112, 0.12);
|
||||
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
||||
|
||||
padding: 40rpx 28rpx 20rpx 28rpx;
|
||||
padding: 60rpx 42rpx 30rpx 42rpx;
|
||||
|
||||
.btn-wq {
|
||||
height: 90rpx;
|
||||
height: 135rpx;
|
||||
background: #256bfa;
|
||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||
border-radius: 18rpx 18rpx 18rpx 18rpx;
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
font-size: 48rpx;
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
line-height: 90rpx;
|
||||
line-height: 135rpx;
|
||||
}
|
||||
|
||||
.btn-desbel {
|
||||
background: #6697fb;
|
||||
box-shadow: 0rpx -4rpx 24rpx 0rpx rgba(11, 44, 112, 0.12);
|
||||
box-shadow: 0rpx -4rpx 36rpx 0rpx rgba(11, 44, 112, 0.12);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user