no message
This commit is contained in:
A1300399510
parent
600fbfb8c3
commit
7effa0f099
209
css/details.css
209
css/details.css
@ -960,20 +960,181 @@
|
|||||||
width: 14px;
|
width: 14px;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
}
|
}
|
||||||
.else {
|
.right {
|
||||||
width: 290px;
|
width: 290px;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
.right .live {
|
||||||
|
width: 100%;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
background: linear-gradient(-24.24254087deg, #d6dcf0 0%, #dae6f2 19%, #eff2cc 62%, #eff9f1 100%);
|
||||||
|
border-radius: 11px;
|
||||||
|
padding-top: 20px;
|
||||||
|
padding-bottom: 30px;
|
||||||
|
}
|
||||||
|
.right .live .head {
|
||||||
|
margin-bottom: 17px;
|
||||||
|
}
|
||||||
|
.right .live .head .icon {
|
||||||
|
width: 89px;
|
||||||
|
height: 28px;
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
.right .live .head .text {
|
||||||
|
width: 104px;
|
||||||
|
height: 24px;
|
||||||
|
background-color: #026277;
|
||||||
|
border-radius: 4px;
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 13px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.right .live .head .text .triangle {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: -3px;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
width: 6px;
|
||||||
|
height: 11px;
|
||||||
|
}
|
||||||
|
.right .live .content-box {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.right .live .content-box .triangle {
|
||||||
|
width: 14px;
|
||||||
|
height: 5px;
|
||||||
|
position: absolute;
|
||||||
|
bottom: -4px;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%) rotate(180deg);
|
||||||
|
}
|
||||||
|
.right .live .content-box .point {
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
bottom: 28px;
|
||||||
|
}
|
||||||
|
.right .live .content-box .point .item {
|
||||||
|
width: 10px;
|
||||||
|
height: 4px;
|
||||||
|
background-color: #d7d7d7;
|
||||||
|
border-radius: 20px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.right .live .content-box .point .item:not(:last-of-type) {
|
||||||
|
margin-right: 4px;
|
||||||
|
}
|
||||||
|
.right .live .content-box .point .item.pitch {
|
||||||
|
background-color: #fa6b11;
|
||||||
|
}
|
||||||
|
.right .live .content {
|
||||||
|
height: 340px;
|
||||||
|
background-color: rgba(255, 255, 255, 0.80392157);
|
||||||
|
border-radius: 8px;
|
||||||
|
margin: 0 11px 27px;
|
||||||
|
display: flex;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.right .live .content .swiper {
|
||||||
|
margin-bottom: 5px;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.right .live .content .swiper .swiper-item {
|
||||||
|
width: 268px;
|
||||||
|
padding-top: 8px;
|
||||||
|
}
|
||||||
|
.right .live .content .swiper .swiper-item .item {
|
||||||
|
position: relative;
|
||||||
|
padding-bottom: 13px;
|
||||||
|
}
|
||||||
|
.right .live .content .swiper .swiper-item .item:not(:last-of-type)::after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
width: calc(100% - 50px);
|
||||||
|
height: 1px;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
border-bottom: 1px dotted #ebebeb;
|
||||||
|
}
|
||||||
|
.right .live .content .swiper .swiper-item .item .icon-box {
|
||||||
|
padding-left: 9px;
|
||||||
|
padding-right: 13px;
|
||||||
|
}
|
||||||
|
.right .live .content .swiper .swiper-item .item .icon-box .icon {
|
||||||
|
width: 28px;
|
||||||
|
}
|
||||||
|
.right .live .content .swiper .swiper-item .item .text {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #000000;
|
||||||
|
line-height: 26px;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
padding-top: 8px;
|
||||||
|
padding-right: 8px;
|
||||||
|
}
|
||||||
|
.right .live .content .swiper .swiper-item .item .text .admissionState {
|
||||||
|
height: 20px;
|
||||||
|
background-color: #b30081;
|
||||||
|
border-radius: 115px;
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 13px;
|
||||||
|
padding: 0 6px;
|
||||||
|
display: inline-flex;
|
||||||
|
width: fit-content;
|
||||||
|
}
|
||||||
|
.right .live .content .swiper .swiper-item .item .text .admissionState.state2 {
|
||||||
|
background-color: #bec105;
|
||||||
|
}
|
||||||
|
.right .live .content .swiper .swiper-item .item .text .admissionState.state3 {
|
||||||
|
background-color: #04b0d5;
|
||||||
|
}
|
||||||
|
.right .live .word {
|
||||||
|
margin-bottom: 9px;
|
||||||
|
}
|
||||||
|
.right .live .word .item {
|
||||||
|
width: 34px;
|
||||||
|
height: 22px;
|
||||||
|
padding: 0 5px;
|
||||||
|
box-sizing: content-box;
|
||||||
|
}
|
||||||
|
.right .live .word .item:not(:last-of-type) {
|
||||||
|
border-right: 1px solid #aaaaaa;
|
||||||
|
}
|
||||||
|
.right .live .hint {
|
||||||
|
font-size: 13px;
|
||||||
|
color: #333333;
|
||||||
|
line-height: 26px;
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 13px;
|
||||||
|
}
|
||||||
|
.right .live .QR-code {
|
||||||
|
width: 120px;
|
||||||
|
height: 120px;
|
||||||
|
background-color: #ffffff;
|
||||||
|
border-radius: 8px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
.right .live .QR-code .icon {
|
||||||
|
width: 103px;
|
||||||
|
height: 103px;
|
||||||
|
}
|
||||||
|
.right .else {
|
||||||
|
width: 100%;
|
||||||
background: -webkit-linear-gradient(270.00883066deg, #f7fbf7 0%, #eaf6ea 100%);
|
background: -webkit-linear-gradient(270.00883066deg, #f7fbf7 0%, #eaf6ea 100%);
|
||||||
background: -moz-linear-gradient(179.99116934deg, #f7fbf7 0%, #eaf6ea 100%);
|
background: -moz-linear-gradient(179.99116934deg, #f7fbf7 0%, #eaf6ea 100%);
|
||||||
background: linear-gradient(179.99116934deg, #f7fbf7 0%, #eaf6ea 100%);
|
background: linear-gradient(179.99116934deg, #f7fbf7 0%, #eaf6ea 100%);
|
||||||
border: none;
|
border: none;
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
padding: 20px 10px 0;
|
padding: 20px 10px 0;
|
||||||
margin-left: 10px;
|
|
||||||
}
|
}
|
||||||
.else .school {
|
.right .else .school {
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
.else .school .logo {
|
.right .else .school .logo {
|
||||||
width: 50px;
|
width: 50px;
|
||||||
height: 50px;
|
height: 50px;
|
||||||
background-color: #ffffff;
|
background-color: #ffffff;
|
||||||
@ -981,10 +1142,10 @@
|
|||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
}
|
}
|
||||||
.else .school .logo .img {
|
.right .else .school .logo .img {
|
||||||
height: 30px;
|
height: 30px;
|
||||||
}
|
}
|
||||||
.else .school .info .name {
|
.right .else .school .info .name {
|
||||||
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
|
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
|
||||||
font-weight: 650;
|
font-weight: 650;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
@ -992,17 +1153,17 @@
|
|||||||
color: #000000;
|
color: #000000;
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
}
|
}
|
||||||
.else .school .info .name-en {
|
.right .else .school .info .name-en {
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
color: #555555;
|
color: #555555;
|
||||||
}
|
}
|
||||||
.else .case {
|
.right .else .case {
|
||||||
width: 270px;
|
width: 270px;
|
||||||
background-color: #ffffff;
|
background-color: #ffffff;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
.else .case .head {
|
.right .else .case .head {
|
||||||
width: 270px;
|
width: 270px;
|
||||||
height: 45px;
|
height: 45px;
|
||||||
border-bottom: 1px dotted #ebebeb;
|
border-bottom: 1px dotted #ebebeb;
|
||||||
@ -1011,7 +1172,7 @@
|
|||||||
border-radius: 8px 8px 0 0;
|
border-radius: 8px 8px 0 0;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
.else .case .head .dot {
|
.right .else .case .head .dot {
|
||||||
width: 14px;
|
width: 14px;
|
||||||
height: 14px;
|
height: 14px;
|
||||||
background-color: #e7f7ee;
|
background-color: #e7f7ee;
|
||||||
@ -1020,7 +1181,7 @@
|
|||||||
position: relative;
|
position: relative;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
}
|
}
|
||||||
.else .case .head .dot::after {
|
.right .else .case .head .dot::after {
|
||||||
content: "";
|
content: "";
|
||||||
width: 6px;
|
width: 6px;
|
||||||
height: 6px;
|
height: 6px;
|
||||||
@ -1034,59 +1195,59 @@
|
|||||||
left: 50%;
|
left: 50%;
|
||||||
transform: translate(-50%, -50%);
|
transform: translate(-50%, -50%);
|
||||||
}
|
}
|
||||||
.else .case .head .text {
|
.right .else .case .head .text {
|
||||||
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
|
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
|
||||||
font-weight: 650;
|
font-weight: 650;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
color: #000000;
|
color: #000000;
|
||||||
}
|
}
|
||||||
.else .case .head .img {
|
.right .else .case .head .img {
|
||||||
width: 14px;
|
width: 14px;
|
||||||
height: 14px;
|
height: 14px;
|
||||||
transform: rotate(270deg);
|
transform: rotate(270deg);
|
||||||
}
|
}
|
||||||
.else .case .list .item {
|
.right .else .case .list .item {
|
||||||
padding: 20px 10px;
|
padding: 20px 10px;
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
.else .case .list .item:not(:last-of-type) {
|
.right .else .case .list .item:not(:last-of-type) {
|
||||||
border-bottom: 1px solid #f6f6f6;
|
border-bottom: 1px solid #f6f6f6;
|
||||||
}
|
}
|
||||||
.else .case .list .item .name {
|
.right .else .case .list .item .name {
|
||||||
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
|
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
|
||||||
font-weight: 650;
|
font-weight: 650;
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
color: #000000;
|
color: #000000;
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
}
|
}
|
||||||
.else .case .list .item .brief {
|
.right .else .case .list .item .brief {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
color: #7f7f7f;
|
color: #7f7f7f;
|
||||||
}
|
}
|
||||||
.else .case .list .item .brief span {
|
.right .else .case .list .item .brief span {
|
||||||
color: #d7d7d7;
|
color: #d7d7d7;
|
||||||
margin: 0 8px;
|
margin: 0 8px;
|
||||||
}
|
}
|
||||||
.else .case.mj .list .item {
|
.right .else .case.mj .list .item {
|
||||||
padding-top: 15px;
|
padding-top: 15px;
|
||||||
}
|
}
|
||||||
.else .case.mj .list .item:not(:last-of-type) {
|
.right .else .case.mj .list .item:not(:last-of-type) {
|
||||||
border-bottom: 1px dotted #ebebeb;
|
border-bottom: 1px dotted #ebebeb;
|
||||||
}
|
}
|
||||||
.else .case.mj .list .name {
|
.right .else .case.mj .list .name {
|
||||||
font-weight: 650;
|
font-weight: 650;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
color: #000000;
|
color: #000000;
|
||||||
}
|
}
|
||||||
.else .case.mj .list .brief-box {
|
.right .else .case.mj .list .brief-box {
|
||||||
padding: 10px 15px 10px 10px;
|
padding: 10px 15px 10px 10px;
|
||||||
width: 251px;
|
width: 251px;
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
background-color: #f7f7f7;
|
background-color: #f7f7f7;
|
||||||
}
|
}
|
||||||
.else .case.mj .list .brief {
|
.right .else .case.mj .list .brief {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
|
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
@ -1100,7 +1261,7 @@
|
|||||||
-webkit-line-clamp: 2;
|
-webkit-line-clamp: 2;
|
||||||
-webkit-box-orient: vertical;
|
-webkit-box-orient: vertical;
|
||||||
}
|
}
|
||||||
.else .case.mj .list .brief .avatar {
|
.right .else .case.mj .list .brief .avatar {
|
||||||
width: 20px;
|
width: 20px;
|
||||||
height: 20px;
|
height: 20px;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
|
|||||||
183
css/details.less
183
css/details.less
@ -1104,15 +1104,193 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.else {
|
.right {
|
||||||
width: 290px;
|
width: 290px;
|
||||||
|
margin-left: 10px;
|
||||||
|
|
||||||
|
.live {
|
||||||
|
width: 100%;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
background: linear-gradient(-24.2425408707597deg, rgba(214, 220, 240, 1) 0%, rgba(218, 230, 242, 1) 19%, rgba(239, 242, 204, 1) 62%, rgba(239, 249, 241, 1) 100%);
|
||||||
|
border-radius: 11px;
|
||||||
|
padding-top: 20px;
|
||||||
|
|
||||||
|
padding-bottom: 30px;
|
||||||
|
.head {
|
||||||
|
margin-bottom: 17px;
|
||||||
|
.icon {
|
||||||
|
width: 89px;
|
||||||
|
height: 28px;
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text {
|
||||||
|
width: 104px;
|
||||||
|
height: 24px;
|
||||||
|
background-color: rgba(2, 98, 119, 1);
|
||||||
|
border-radius: 4px;
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 13px;
|
||||||
|
position: relative;
|
||||||
|
.triangle {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: -3px;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
width: 6px;
|
||||||
|
height: 11px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-box {
|
||||||
|
position: relative;
|
||||||
|
.triangle {
|
||||||
|
width: 14px;
|
||||||
|
height: 5px;
|
||||||
|
position: absolute;
|
||||||
|
bottom: -4px;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%) rotate(180deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.point {
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
bottom: 28px;
|
||||||
|
.item {
|
||||||
|
&:not(:last-of-type) {
|
||||||
|
margin-right: 4px;
|
||||||
|
}
|
||||||
|
width: 10px;
|
||||||
|
height: 4px;
|
||||||
|
background-color: rgba(215, 215, 215, 1);
|
||||||
|
border-radius: 20px;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
&.pitch {
|
||||||
|
background-color: rgba(250, 107, 17, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
// width: 268px;
|
||||||
|
height: 340px;
|
||||||
|
background-color: rgba(255, 255, 255, 0.803921568627451);
|
||||||
|
border-radius: 8px;
|
||||||
|
margin: 0 11px 27px;
|
||||||
|
display: flex;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
.swiper {
|
||||||
|
margin-bottom: 5px;
|
||||||
|
display: flex;
|
||||||
|
.swiper-item {
|
||||||
|
width: 268px;
|
||||||
|
padding-top: 8px;
|
||||||
|
.item {
|
||||||
|
position: relative;
|
||||||
|
padding-bottom: 13px;
|
||||||
|
|
||||||
|
&:not(:last-of-type)::after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
width: calc(100% - 50px);
|
||||||
|
height: 1px;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
border-bottom: 1px dotted rgb(235, 235, 235);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-box {
|
||||||
|
padding-left: 9px;
|
||||||
|
padding-right: 13px;
|
||||||
|
.icon {
|
||||||
|
width: 28px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.text {
|
||||||
|
.admissionState {
|
||||||
|
height: 20px;
|
||||||
|
background-color: rgba(179, 0, 129, 1);
|
||||||
|
border-radius: 115px;
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 13px;
|
||||||
|
padding: 0 6px;
|
||||||
|
display: inline-flex;
|
||||||
|
width: fit-content;
|
||||||
|
|
||||||
|
&.state2 {
|
||||||
|
background-color: #bec105;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.state3 {
|
||||||
|
background-color: rgba(4, 176, 213, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
font-size: 14px;
|
||||||
|
color: #000000;
|
||||||
|
line-height: 26px;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
padding-top: 8px;
|
||||||
|
padding-right: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.word {
|
||||||
|
.item {
|
||||||
|
width: 34px;
|
||||||
|
height: 22px;
|
||||||
|
padding: 0 5px;
|
||||||
|
box-sizing: content-box;
|
||||||
|
&:not(:last-of-type) {
|
||||||
|
border-right: 1px solid #aaaaaa;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
margin-bottom: 9px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hint {
|
||||||
|
font-size: 13px;
|
||||||
|
color: #333333;
|
||||||
|
line-height: 26px;
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 13px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.QR-code {
|
||||||
|
width: 120px;
|
||||||
|
height: 120px;
|
||||||
|
background-color: rgba(255, 255, 255, 1);
|
||||||
|
border-radius: 8px;
|
||||||
|
margin: 0 auto;
|
||||||
|
.icon {
|
||||||
|
width: 103px;
|
||||||
|
height: 103px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.else {
|
||||||
|
width: 100%;
|
||||||
background: -webkit-linear-gradient(270.008830663227deg, rgba(247, 251, 247, 1) 0%, rgba(234, 246, 234, 1) 100%);
|
background: -webkit-linear-gradient(270.008830663227deg, rgba(247, 251, 247, 1) 0%, rgba(234, 246, 234, 1) 100%);
|
||||||
background: -moz-linear-gradient(179.991169336773deg, rgba(247, 251, 247, 1) 0%, rgba(234, 246, 234, 1) 100%);
|
background: -moz-linear-gradient(179.991169336773deg, rgba(247, 251, 247, 1) 0%, rgba(234, 246, 234, 1) 100%);
|
||||||
background: linear-gradient(179.991169336773deg, rgba(247, 251, 247, 1) 0%, rgba(234, 246, 234, 1) 100%);
|
background: linear-gradient(179.991169336773deg, rgba(247, 251, 247, 1) 0%, rgba(234, 246, 234, 1) 100%);
|
||||||
border: none;
|
border: none;
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
padding: 20px 10px 0;
|
padding: 20px 10px 0;
|
||||||
margin-left: 10px;
|
|
||||||
|
|
||||||
.school {
|
.school {
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
@ -1269,6 +1447,7 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.state-mask {
|
.state-mask {
|
||||||
|
|||||||
@ -483,7 +483,60 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="right">
|
||||||
|
<div class="live">
|
||||||
|
<div class="head flexcenter">
|
||||||
|
<img class="icon" src="/img/talk-live-icon.png" />
|
||||||
|
|
||||||
|
<div class="text flexcenter">
|
||||||
|
<img class="triangle" src="/img/triangle-dark-cyan.svg" />
|
||||||
|
招生官为你答疑
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="content-box">
|
||||||
|
<div ref="swiperRef" class="content">
|
||||||
|
<div class="swiper" bindchange="admissionChange">
|
||||||
|
<div class="swiper-item" :class="'swiper-item' + index" v-for="(item,index) in urls" :key="index">
|
||||||
|
<div class="item flexacenter" v-for="(item,index) in item" :key="index">
|
||||||
|
<div class="flexcenter icon-box">
|
||||||
|
<img class="icon" :src="item.logo" />
|
||||||
|
</div>
|
||||||
|
<div class="text flex1">
|
||||||
|
<div class="admissionState flexcenter" :class="'state' + item.mold">{{ moldObj[item.mold] }}</div>
|
||||||
|
{{ item.title }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="point flexcenter">
|
||||||
|
<div class="item " :class="{'pitch': admissionCurrent == index}" v-for="(item,index) in urls" :key="index" @click="cutSwiper(index)">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<img class="triangle" src="/img/triangle-white-lucency.svg">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="word flexcenter">
|
||||||
|
<img class="item" src="/img/word-live.png">
|
||||||
|
<img class="item" src="/img/word-playback.png">
|
||||||
|
<img class="item" src="/img/word-answer.png">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="hint">请添加申请小助手</div>
|
||||||
|
|
||||||
|
<div class="QR-code flexcenter">
|
||||||
|
<img class="icon" src="https://u.gter.net/assistantwxqrcode.png">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="else">
|
<div class="else">
|
||||||
|
<div class=""></div>
|
||||||
<div class="school flexacenter">
|
<div class="school flexacenter">
|
||||||
<div class="logo flexcenter">
|
<div class="logo flexcenter">
|
||||||
<img class="img" src="http://127.0.0.1:5500/images/%E9%A6%96%E9%A1%B5/u74.png" />
|
<img class="img" src="http://127.0.0.1:5500/images/%E9%A6%96%E9%A1%B5/u74.png" />
|
||||||
@ -536,6 +589,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- 底部 -->
|
<!-- 底部 -->
|
||||||
<div class="base flexcenter">
|
<div class="base flexcenter">
|
||||||
<div v-if="(contras.ismanage == null || contras.ismanage == 0) && (contras.status == null || contras.status == 0)" class="type1 flexacenter">
|
<div v-if="(contras.ismanage == null || contras.ismanage == 0) && (contras.status == null || contras.status == 0)" class="type1 flexacenter">
|
||||||
@ -878,7 +933,57 @@
|
|||||||
view: 242,
|
view: 242,
|
||||||
}])
|
}])
|
||||||
|
|
||||||
return {offerList, side, sideKey, info, disciplineObj, rankingsObj, cutStudyMode, studyMode, course, contras, copy, download, stateObj, bindblur, remark, addComparison, cutSide, detailsRef, stateState, cutState, changeType, deletee}
|
const urls = ref([[{
|
||||||
|
logo: "https://oss.x-php.com/school/J6BSwE-VfCFkCb1SBaR7ec6NYmTA4pRcOalNHJQuwf83NTE2",
|
||||||
|
mold: 2,
|
||||||
|
title: "11.27 19:00 | 高达90%就业率！工科生不能错过的香港城大工学院线上宣讲会快来了解！",
|
||||||
|
url: "https://bbs.gter.net/thread-2619710-1-1.html",
|
||||||
|
}, {
|
||||||
|
logo: "https://oss.x-php.com/school/J6BSwE-VfCFkCLVSBaR7ec6NYmTA5sRfNP5NHJQuwf83NTE2",
|
||||||
|
mold: 1,
|
||||||
|
title: "香港大学 香港大学社会科学硕士（社会数据分析）线上公开课暨宣讲会",
|
||||||
|
url: "https://bbs.gter.net/thread-2619923-1-1.html"
|
||||||
|
}, {
|
||||||
|
logo: "https://oss.x-php.com/school/J6BSwE6VfCFmDrknc6IXB9eUbGqEscEIOawLEogy25QhNzUxNg~~",
|
||||||
|
mold: 2,
|
||||||
|
title: "11.28 19:30 | 毕业起薪高 工作一年学费回本？昆杜研究生项目优点真的太太太太多了！ ",
|
||||||
|
url: "https://bbs.gter.net/thread-2620009-1-1.html",
|
||||||
|
}, {
|
||||||
|
logo: "https://oss.x-php.com/school/J6BSwE-VfCFkCLRSBaR7ec6NYmTHuZYPMKxNHJQuwf83NTE2",
|
||||||
|
mold: 3,
|
||||||
|
title: "招生资讯 | 香港中文大学 政务与政策科学学院授课式硕士课程",
|
||||||
|
url: "https://bbs.gter.net/thread-2616456-1-1.html",
|
||||||
|
}], [{
|
||||||
|
logo: "https://oss.x-php.com/school/J6BSwE-VfCFkCLRSBaR7ec6NYmTHuZYPMKxNHJQuwf83NTE2",
|
||||||
|
mold: 3,
|
||||||
|
title: "长期答疑 | 香港中文大学 经济学理学硕士课程-2025入学现正招生",
|
||||||
|
url: "https://bbs.gter.net/thread-2617401-1-1.html",
|
||||||
|
}]])
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
const moldObj = ref({
|
||||||
|
1: "直播",
|
||||||
|
2: "回放",
|
||||||
|
3: "答疑"
|
||||||
|
})
|
||||||
|
|
||||||
|
let admissionCurrent = ref(0)
|
||||||
|
|
||||||
|
const swiperRef = ref(null)
|
||||||
|
|
||||||
|
// 写一个 点击切换轮播图
|
||||||
|
const cutSwiper = index => {
|
||||||
|
admissionCurrent.value = index
|
||||||
|
const dom = document.querySelector(".swiper-item" + index)
|
||||||
|
const left = dom.offsetLeft
|
||||||
|
swiperRef.value.scrollTo({
|
||||||
|
left,
|
||||||
|
behavior: "smooth",
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
return {swiperRef, cutSwiper, admissionCurrent, moldObj, urls, offerList, side, sideKey, info, disciplineObj, rankingsObj, cutStudyMode, studyMode, course, contras, copy, download, stateObj, bindblur, remark, addComparison, cutSide, detailsRef, stateState, cutState, changeType, deletee}
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
subject.component("text-module", textModule)
|
subject.component("text-module", textModule)
|
||||||
|
|||||||
BIN
img/talk-live-icon.png
Normal file
BIN
img/talk-live-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.9 KiB |
6
img/triangle-dark-cyan.svg
Normal file
6
img/triangle-dark-cyan.svg
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6px" height="11px" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g transform="matrix(1 0 0 1 -6180 -544 )">
|
||||||
|
<path d="M 5.80208333333333 0.2041015625 C 5.93402777777778 0.340169270833332 6 0.501302083333332 6 0.6875 L 6 10.3125 C 6 10.4986979166667 5.93402777777778 10.6598307291667 5.80208333333333 10.7958984375 C 5.67013888888889 10.9319661458333 5.51388888888889 11 5.33333333333333 11 C 5.15277777777778 11 4.99652777777778 10.9319661458333 4.86458333333333 10.7958984375 L 0.197916666666667 5.9833984375 C 0.0659722222222223 5.84733072916667 0 5.68619791666667 0 5.5 C 0 5.31380208333333 0.0659722222222223 5.15266927083333 0.197916666666667 5.0166015625 L 4.86458333333333 0.2041015625 C 4.99652777777778 0.0680338541666659 5.15277777777778 0 5.33333333333333 0 C 5.51388888888889 0 5.67013888888889 0.0680338541666659 5.80208333333333 0.2041015625 Z " fill-rule="nonzero" fill="#026277" stroke="none" transform="matrix(1 0 0 1 6180 544 )" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
6
img/triangle-white-lucency.svg
Normal file
6
img/triangle-white-lucency.svg
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="16px" height="8px" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g transform="matrix(1 0 0 1 -7022 -940 )">
|
||||||
|
<path d="M 7022 948 L 7030 940 L 7038 948 L 7022 948 Z " fill-rule="nonzero" fill="#ffffff" stroke="none" fill-opacity="0.698039215686274" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
BIN
img/word-answer.png
Normal file
BIN
img/word-answer.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
BIN
img/word-live.png
Normal file
BIN
img/word-live.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
BIN
img/word-playback.png
Normal file
BIN
img/word-playback.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
Loading…
Reference in New Issue
Block a user