A1300399510/PCAdmissionOfficer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: 优化CSS样式和布局调整

Browse Source 
- 调整头部样式和布局
- 优化列表和卡片样式
- 修复滚动条显示问题
- 更新颜色和间距
- 添加边框和阴影效果
This commit is contained in:
DESKTOP-RQ919RC\Pc
2025-07-22 18:51:34 +08:00
parent d638dade41
commit 693a0465ff
4 changed files with 300 additions and 126 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
H5/h5.css
View File

@@ -75,6 +75,9 @@ body {
z-index: 3; z-index: 3;
width: 4.46rem; width: 4.46rem;
} }
.admission-officer .list {
margin-top: 1.2rem;
}
.admission-officer .list .item { .admission-officer .list .item {
width: 9rem; width: 9rem;
position: relative; position: relative;
@@ -104,8 +107,8 @@ body {
} }
.admission-officer .list .item .header .abbreviation .school-other { .admission-officer .list .item .header .abbreviation .school-other {
position: absolute; position: absolute;
top: -0.0133rem; top: -1px;
left: -0.0133rem; left: -1px;
width: 2rem; width: 2rem;
height: 0.96rem; height: 0.96rem;
z-index: 1; z-index: 1;
@@ -350,9 +353,31 @@ body {
width: 9rem; width: 9rem;
height: 5.06rem; height: 5.06rem;
position: relative; position: relative;
margin: 0 auto 0.54rem; margin: 0 auto;
z-index: 1; z-index: 1;
} }
.admission-officer .interview-box::after {
content: "";
width: 100%;
height: 0.38rem;
background-color: #000000;
border-radius: 0.2rem 0.2rem 0 0;
display: block;
position: absolute;
top: 0;
left: 0;
}
.admission-officer .interview-box::before {
content: "";
width: 100%;
height: 0.38rem;
background-color: #000000;
border-radius: 0 0 0.2rem 0.2rem;
display: block;
position: absolute;
bottom: 0;
left: 0;
}
.admission-officer .interview-box .head { .admission-officer .interview-box .head {
position: absolute; position: absolute;
top: 0; top: 0;
@@ -433,7 +458,7 @@ body {
width: 100vw; width: 100vw;
box-sizing: border-box; box-sizing: border-box;
white-space: nowrap; white-space: nowrap;
margin-bottom: 1.2rem; margin-top: 0.54rem;
overflow: auto; overflow: auto;
} }
.admission-officer .interview-list .item { .admission-officer .interview-list .item {
@@ -471,7 +496,7 @@ body {
.admission-officer .preach-box { .admission-officer .preach-box {
width: 9rem; width: 9rem;
position: relative; position: relative;
margin: 0 auto 0.54rem; margin: 1.2rem auto 0;
background: linear-gradient(123.15792388deg, #dfeaea 0%, #fbf9f5 100%); background: linear-gradient(123.15792388deg, #dfeaea 0%, #fbf9f5 100%);
border: 0.0133rem solid #e8efee; border: 0.0133rem solid #e8efee;
border-radius: 0.4rem; border-radius: 0.4rem;

34
H5/h5.less
View File

@@ -89,6 +89,7 @@ body {
} }
.list { .list {
margin-top: 1.2rem;
.item { .item {
width: 9rem; width: 9rem;
position: relative; position: relative;
@@ -122,8 +123,8 @@ body {
.school-other { .school-other {
position: absolute; position: absolute;
top: -0.0133rem; top: -1px;
left: -0.0133rem; left: -1px;
width: 2rem; width: 2rem;
height: 0.96rem; height: 0.96rem;
z-index: 1; z-index: 1;
@@ -419,8 +420,31 @@ body {
width: 9rem; width: 9rem;
height: 5.06rem; height: 5.06rem;
position: relative; position: relative;
margin: 0 auto 0.54rem; margin: 0 auto;
z-index: 1; z-index: 1;
&::after {
content: "";
width: 100%;
height: 0.38rem;
background-color: rgba(0, 0, 0, 1);
border-radius: 0.2rem 0.2rem 0 0;
display: block;
position: absolute;
top: 0;
left: 0;
}
&::before {
content: "";
width: 100%;
height: 0.38rem;
background-color: rgba(0, 0, 0, 1);
border-radius: 0 0 0.2rem 0.2rem;
display: block;
position: absolute;
bottom: 0;
left: 0;
}
.head { .head {
position: absolute; position: absolute;
@@ -513,7 +537,7 @@ body {
width: 100vw; width: 100vw;
box-sizing: border-box; box-sizing: border-box;
white-space: nowrap; white-space: nowrap;
margin-bottom: 1.2rem; margin-top: 0.54rem;
overflow: auto; overflow: auto;
.item { .item {
@@ -559,7 +583,7 @@ body {
width: 9rem; width: 9rem;
// height: 5.88rem; // height: 5.88rem;
position: relative; position: relative;
margin: 0 auto 0.54rem; margin: 1.2rem auto 0;
background: linear-gradient(123.157923884672deg, rgba(223, 234, 234, 1) 0%, rgba(251, 249, 245, 1) 100%); background: linear-gradient(123.157923884672deg, rgba(223, 234, 234, 1) 0%, rgba(251, 249, 245, 1) 100%);
border: 0.0133rem solid rgba(232, 239, 238, 1); border: 0.0133rem solid rgba(232, 239, 238, 1);
border-radius: 0.4rem; border-radius: 0.4rem;

153
css/index.css
View File

@@ -38,11 +38,18 @@ body {
.admission-officer a:hover { .admission-officer a:hover {
text-decoration: underline; text-decoration: underline;
} }
.admission-officer .one-line-display {
word-break: keep-all;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.admission-officer .admission-head { .admission-officer .admission-head {
width: 100%; width: 100%;
height: 144px; height: 144px;
background-color: #3c7de9; background-color: #3c7de9;
position: relative; position: relative;
margin-top: -50px;
} }
.admission-officer .admission-head .admission-head-logo { .admission-officer .admission-head .admission-head-logo {
width: 223px; width: 223px;
@@ -50,6 +57,7 @@ body {
position: absolute; position: absolute;
top: 60px; top: 60px;
left: calc((100vw - 1200px) / 2); left: calc((100vw - 1200px) / 2);
z-index: 1;
} }
@media screen and (max-width: 1200px) { @media screen and (max-width: 1200px) {
.admission-officer .admission-head .admission-head-logo { .admission-officer .admission-head .admission-head-logo {
@@ -65,50 +73,14 @@ body {
transform: translateX(-50%); transform: translateX(-50%);
overflow: hidden; overflow: hidden;
} }
.admission-officer .admission-head .admission-head-gray {
position: absolute;
top: 122px;
left: 50%;
transform: translateX(-50%);
width: 1920px;
height: 91px;
z-index: 1;
}
.admission-officer .admission-head .admission-head-gray::after {
content: "";
position: absolute;
top: 0;
right: 1px;
height: 91px;
width: calc((100vw - 1920px) / 2);
background-color: #f6f6f6;
transform: translateX(100%);
}
.admission-officer .admission-head .admission-head-gray::before {
content: "";
position: absolute;
top: 0;
left: 1px;
height: 91px;
width: calc((100vw - 1920px) / 2);
background-color: #f6f6f6;
transform: translateX(-100%);
}
.admission-officer .admission-head .admission-head-1 { .admission-officer .admission-head .admission-head-1 {
position: absolute; position: absolute;
top: 122px; top: 0;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
width: 1920px; min-width: 1920px;
height: 68px; height: 216px;
} width: 100%;
.admission-officer .admission-head .admission-head-2 {
position: absolute;
top: 122px;
left: 50%;
transform: translateX(-50%);
width: 1920px;
height: 91px;
} }
.admission-officer .admission-body { .admission-officer .admission-body {
width: 1200px; width: 1200px;
@@ -119,7 +91,7 @@ body {
.admission-officer .admission-body .interview-box { .admission-officer .admission-body .interview-box {
width: 100%; width: 100%;
height: 435px; height: 435px;
margin: 0 auto 22px; margin: 0 auto;
position: relative; position: relative;
z-index: 1; z-index: 1;
} }
@@ -141,12 +113,10 @@ body {
} }
.admission-officer .admission-body .interview-box .left .head .icon { .admission-officer .admission-body .interview-box .left .head .icon {
width: 38px; width: 38px;
height: 50px;
margin-right: 1px; margin-right: 1px;
} }
.admission-officer .admission-body .interview-box .left .head .name { .admission-officer .admission-body .interview-box .left .head .name {
width: 125px; width: 125px;
height: 36px;
} }
.admission-officer .admission-body .interview-box .left .content { .admission-officer .admission-body .interview-box .left .content {
width: 592px; width: 592px;
@@ -155,7 +125,30 @@ body {
border-radius: 10px; border-radius: 10px;
overflow: hidden; overflow: hidden;
} }
.admission-officer .admission-body .interview-box .left .content::after {
content: "";
width: 100%;
height: 19px;
background-color: #000000;
border-radius: 10px 10px 0 0;
display: block;
position: absolute;
top: 0;
left: 0;
}
.admission-officer .admission-body .interview-box .left .content::before {
content: "";
width: 100%;
height: 19px;
background-color: #000000;
border-radius: 0 0 10px 10px;
display: block;
position: absolute;
bottom: 0;
left: 0;
}
.admission-officer .admission-body .interview-box .left .content .img { .admission-officer .admission-body .interview-box .left .content .img {
width: 592px;
height: 333px; height: 333px;
} }
.admission-officer .admission-body .interview-box .left .content .play-btn { .admission-officer .admission-body .interview-box .left .content .play-btn {
@@ -318,7 +311,7 @@ body {
.admission-officer .admission-body .preach-box { .admission-officer .admission-body .preach-box {
width: 100%; width: 100%;
height: 435px; height: 435px;
margin: 0 auto 22px; margin: 0 auto;
position: relative; position: relative;
z-index: 1; z-index: 1;
} }
@@ -374,10 +367,22 @@ body {
.admission-officer .admission-body .preach-box .left .box .list { .admission-officer .admission-body .preach-box .left .box .list {
width: 404px; width: 404px;
margin: 0 auto; margin: 0 auto;
overflow: auto;
height: 280px;
/* 隐藏垂直滚动条 */
scrollbar-width: none;
/* Firefox */
-ms-overflow-style: none;
/* IE 和 Edge */
overflow-y: auto;
/* 确保内容可滚动 */
}
.admission-officer .admission-body .preach-box .left .box .list::-webkit-scrollbar {
display: none;
/* 隐藏滚动条 */
} }
.admission-officer .admission-body .preach-box .left .box .list .item { .admission-officer .admission-body .preach-box .left .box .list .item {
width: 404px; height: 70px;
height: 73px;
padding-left: 18px; padding-left: 18px;
padding-right: 20px; padding-right: 20px;
cursor: pointer; cursor: pointer;
@@ -407,6 +412,7 @@ body {
font-size: 15px; font-size: 15px;
color: #000000; color: #000000;
margin-bottom: 4px; margin-bottom: 4px;
width: 355px;
} }
.admission-officer .admission-body .preach-box .left .box .list .item .info .time { .admission-officer .admission-body .preach-box .left .box .list .item .info .time {
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif; font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
@@ -451,7 +457,7 @@ body {
border-radius: 10px; border-radius: 10px;
} }
.admission-officer .admission-body .interview-more { .admission-officer .admission-body .interview-more {
margin-bottom: 102px; margin-top: 22px;
} }
.admission-officer .admission-body .interview-more .case { .admission-officer .admission-body .interview-more .case {
width: 139px; width: 139px;
@@ -507,17 +513,39 @@ body {
overflow: hidden; overflow: hidden;
} }
.admission-officer .admission-body .interview-more .swiper-box .swiper .swiper-item { .admission-officer .admission-body .interview-more .swiper-box .swiper .swiper-item {
width: 356px; width: 471px;
height: 200px; height: 200px;
position: relative; position: relative;
border-radius: 10px; border-radius: 10px;
cursor: pointer; cursor: pointer;
} }
.admission-officer .admission-body .interview-more .swiper-box .swiper .swiper-item::after {
content: "";
width: 100%;
height: 12px;
background-color: #000000;
border-radius: 10px 10px 0 0;
display: block;
position: absolute;
top: 0;
left: 0;
}
.admission-officer .admission-body .interview-more .swiper-box .swiper .swiper-item::before {
content: "";
width: 100%;
height: 12px;
background-color: #000000;
border-radius: 0 0 10px 10px;
display: block;
position: absolute;
bottom: 0;
left: 0;
}
.admission-officer .admission-body .interview-more .swiper-box .swiper .swiper-item:not(:last-child) { .admission-officer .admission-body .interview-more .swiper-box .swiper .swiper-item:not(:last-child) {
margin-right: 10px; margin-right: 10px;
} }
.admission-officer .admission-body .interview-more .swiper-box .swiper .swiper-item .img { .admission-officer .admission-body .interview-more .swiper-box .swiper .swiper-item .img {
width: 356px; width: 471px;
height: 200px; height: 200px;
border-radius: 10px; border-radius: 10px;
} }
@@ -544,6 +572,7 @@ body {
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif; font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
} }
.admission-officer .admission-body .school-list { .admission-officer .admission-body .school-list {
margin-top: 102px;
margin-bottom: 90px; margin-bottom: 90px;
} }
.admission-officer .admission-body .school-list .school-item:not(:last-child) { .admission-officer .admission-body .school-list .school-item:not(:last-child) {
@@ -596,6 +625,7 @@ body {
.admission-officer .admission-body .school-list .school-item .right .info .img { .admission-officer .admission-body .school-list .school-item .right .info .img {
height: 47px; height: 47px;
margin-right: 10px; margin-right: 10px;
cursor: pointer;
} }
.admission-officer .admission-body .school-list .school-item .right .info .name { .admission-officer .admission-body .school-list .school-item .right .info .name {
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif; font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
@@ -604,6 +634,7 @@ body {
font-size: 20px; font-size: 20px;
color: #000000; color: #000000;
margin-bottom: 6px; margin-bottom: 6px;
cursor: pointer;
} }
.admission-officer .admission-body .school-list .school-item .right .info .name .arrows { .admission-officer .admission-body .school-list .school-item .right .info .name .arrows {
width: 12px; width: 12px;
@@ -614,6 +645,7 @@ body {
color: #555555; color: #555555;
font-size: 13px; font-size: 13px;
font-family: "ArialMT", "Arial", sans-serif; font-family: "ArialMT", "Arial", sans-serif;
cursor: pointer;
} }
.admission-officer .admission-body .school-list .school-item .right .introduce { .admission-officer .admission-body .school-list .school-item .right .introduce {
font-size: 14px; font-size: 14px;
@@ -670,6 +702,9 @@ body {
z-index: -1; z-index: -1;
fill: #fff; fill: #fff;
} }
.admission-officer .admission-body .school-list .school-item .right .content .year .item.unfold .svg {
fill: #7d2882;
}
.admission-officer .admission-body .school-list .school-item .right .content .year .item.pitch { .admission-officer .admission-body .school-list .school-item .right .content .year .item.pitch {
color: #ffffff; color: #ffffff;
font-weight: 650; font-weight: 650;
@@ -717,7 +752,7 @@ body {
top: 28px; top: 28px;
left: 0; left: 0;
width: 92px; width: 92px;
background-color: #76c45e; background-color: #7d2882;
border-radius: 0 0 10px 10px; border-radius: 0 0 10px 10px;
padding-top: 6px; padding-top: 6px;
} }
@@ -845,7 +880,8 @@ body {
} }
.admission-officer .admission-body .retrospect .list .item::after { .admission-officer .admission-body .retrospect .list .item::after {
content: ""; content: "";
background: linear-gradient(90deg, #d6e5e5 0%, rgba(246, 242, 234, 0.976)); background: linear-gradient(90deg, #ffffff 0%, rgba(255, 255, 255, 0.9686) 100%);
border: 1px solid #f2f2f2;
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
@@ -943,12 +979,12 @@ body {
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
background-color: rgba(0, 0, 0, 0.2); background-color: rgba(0, 0, 0, 0.2);
z-index: 100; z-index: 10000;
} }
.admission-officer .admission-body .more-school-mask .more-school { .admission-officer .admission-body .more-school-mask .more-school {
width: 706px; width: 706px;
overflow: hidden; overflow: hidden;
background: linear-gradient(90deg, #d6e5e5 0%, #f6f2ea 100%); background: #fff;
border-radius: 20px; border-radius: 20px;
position: relative; position: relative;
} }
@@ -965,6 +1001,7 @@ body {
height: 100px; height: 100px;
padding-left: 36px; padding-left: 36px;
background-color: #ffffff; background-color: #ffffff;
border-bottom: 1px dotted #d7d7d7;
} }
.admission-officer .admission-body .more-school-mask .more-school .head .img { .admission-officer .admission-body .more-school-mask .more-school .head .img {
height: 47px; height: 47px;
@@ -1012,7 +1049,7 @@ body {
top: 0; top: 0;
left: 0; left: 0;
z-index: -1; z-index: -1;
fill: #fff; fill: #ebebeb;
} }
.admission-officer .admission-body .more-school-mask .more-school .content .year .item.pitch { .admission-officer .admission-body .more-school-mask .more-school .content .year .item.pitch {
color: #ffffff; color: #ffffff;
@@ -1028,6 +1065,7 @@ body {
margin-left: 5px; margin-left: 5px;
vertical-align: middle; vertical-align: middle;
transition: all 0.3s; transition: all 0.3s;
margin-top: 3px;
} }
.admission-officer .admission-body .more-school-mask .more-school .content .year .item.more.pitch .arrows { .admission-officer .admission-body .more-school-mask .more-school .content .year .item.more.pitch .arrows {
fill: #fff; fill: #fff;
@@ -1088,7 +1126,8 @@ body {
text-decoration: underline; text-decoration: underline;
} }
.admission-officer .admission-body .more-school-mask .more-school .content .list { .admission-officer .admission-body .more-school-mask .more-school .content .list {
height: 448px; max-height: 448px;
min-height: 138px;
overflow: auto; overflow: auto;
padding-right: 20px; padding-right: 20px;
} }
@@ -1107,7 +1146,7 @@ body {
} }
.admission-officer .admission-body .more-school-mask .more-school .content .list .item { .admission-officer .admission-body .more-school-mask .more-school .content .list .item {
padding: 12px 10px 10px 20px; padding: 12px 10px 10px 20px;
background-color: #ffffff; background-color: #f6f6f6;
border-radius: 10px; border-radius: 10px;
} }
.admission-officer .admission-body .more-school-mask .more-school .content .list .item:not(:last-child) { .admission-officer .admission-body .more-school-mask .more-school .content .list .item:not(:last-child) {
@@ -1185,7 +1224,7 @@ body {
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
background-color: rgba(0, 0, 0, 0.4); background-color: rgba(0, 0, 0, 0.4);
z-index: 100; z-index: 10000;
} }
.admission-officer .admission-body .paly-box-mask .paly-box { .admission-officer .admission-body .paly-box-mask .paly-box {
position: relative; position: relative;

204
css/index.less
View File

@@ -44,11 +44,19 @@ body {
} }
} }
.one-line-display {
word-break: keep-all;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.admission-head { .admission-head {
width: 100%; width: 100%;
height: 144px; height: 144px;
background-color: rgba(60, 125, 233, 1); background-color: rgba(60, 125, 233, 1);
position: relative; position: relative;
margin-top: -50px;
.admission-head-logo { .admission-head-logo {
width: 223px; width: 223px;
@@ -56,6 +64,7 @@ body {
position: absolute; position: absolute;
top: 60px; top: 60px;
left: calc((100vw - 1200px) / 2); left: calc((100vw - 1200px) / 2);
z-index: 1;
@media screen and (max-width: 1200px) { @media screen and (max-width: 1200px) {
left: 0; left: 0;
} }
@@ -71,55 +80,56 @@ body {
overflow: hidden; overflow: hidden;
} }
.admission-head-gray { // .admission-head-gray {
position: absolute; // position: absolute;
top: 122px; // top: 122px;
left: 50%; // left: 50%;
transform: translateX(-50%); // transform: translateX(-50%);
width: 1920px; // width: 1920px;
height: 91px; // height: 91px;
z-index: 1; // z-index: 1;
&::after { // &::after {
content: ""; // content: "";
position: absolute; // position: absolute;
top: 0; // top: 0;
right: 1px; // right: 1px;
height: 91px; // height: 91px;
width: calc((100vw - 1920px) / 2); // width: calc((100vw - 1920px) / 2);
background-color: #f6f6f6; // background-color: #f6f6f6;
transform: translateX(100%); // transform: translateX(100%);
} // }
&::before { // &::before {
content: ""; // content: "";
position: absolute; // position: absolute;
top: 0; // top: 0;
left: 1px; // left: 1px;
height: 91px; // height: 91px;
width: calc((100vw - 1920px) / 2); // width: calc((100vw - 1920px) / 2);
background-color: #f6f6f6; // background-color: #f6f6f6;
transform: translateX(-100%); // transform: translateX(-100%);
} // }
} // }
.admission-head-1 { .admission-head-1 {
position: absolute; position: absolute;
top: 122px; top: 0;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
width: 1920px; min-width: 1920px;
height: 68px; height: 216px;
width: 100%;
} }
.admission-head-2 { // .admission-head-2 {
position: absolute; // position: absolute;
top: 122px; // top: 122px;
left: 50%; // left: 50%;
transform: translateX(-50%); // transform: translateX(-50%);
width: 1920px; // width: 1920px;
height: 91px; // height: 91px;
} // }
} }
.admission-body { .admission-body {
@@ -130,7 +140,7 @@ body {
.interview-box { .interview-box {
width: 100%; width: 100%;
height: 435px; height: 435px;
margin: 0 auto 22px; margin: 0 auto;
position: relative; position: relative;
z-index: 1; z-index: 1;
@@ -152,12 +162,12 @@ body {
margin-bottom: 11px; margin-bottom: 11px;
.icon { .icon {
width: 38px; width: 38px;
height: 50px; // height: 50px;
margin-right: 1px; margin-right: 1px;
} }
.name { .name {
width: 125px; width: 125px;
height: 36px; // height: 36px;
} }
} }
@@ -167,9 +177,32 @@ body {
position: relative; position: relative;
border-radius: 10px; border-radius: 10px;
overflow: hidden; overflow: hidden;
&::after {
content: "";
width: 100%;
height: 19px;
background-color: rgba(0, 0, 0, 1);
border-radius: 10px 10px 0 0;
display: block;
position: absolute;
top: 0;
left: 0;
}
&::before {
content: "";
width: 100%;
height: 19px;
background-color: rgba(0, 0, 0, 1);
border-radius: 0 0 10px 10px;
display: block;
position: absolute;
bottom: 0;
left: 0;
}
.img { .img {
// width: 592px; width: 592px;
height: 333px; height: 333px;
} }
@@ -182,6 +215,7 @@ body {
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
cursor: pointer; cursor: pointer;
} }
.bottom { .bottom {
position: absolute; position: absolute;
left: 0; left: 0;
@@ -352,7 +386,7 @@ body {
.preach-box { .preach-box {
width: 100%; width: 100%;
height: 435px; height: 435px;
margin: 0 auto 22px; margin: 0 auto;
position: relative; position: relative;
z-index: 1; z-index: 1;
@@ -410,10 +444,21 @@ body {
.list { .list {
width: 404px; width: 404px;
margin: 0 auto; margin: 0 auto;
overflow: auto;
height: 280px;
/* 隐藏垂直滚动条 */
scrollbar-width: none; /* Firefox */
-ms-overflow-style: none; /* IE 和 Edge */
overflow-y: auto; /* 确保内容可滚动 */
&::-webkit-scrollbar {
display: none; /* 隐藏滚动条 */
}
.item { .item {
width: 404px; // width: 404px;
height: 73px; height: 70px;
padding-left: 18px; padding-left: 18px;
padding-right: 20px; padding-right: 20px;
cursor: pointer; cursor: pointer;
@@ -449,6 +494,7 @@ body {
font-size: 15px; font-size: 15px;
color: #000000; color: #000000;
margin-bottom: 4px; margin-bottom: 4px;
width: 355px;
} }
.time { .time {
@@ -507,7 +553,8 @@ body {
} }
.interview-more { .interview-more {
margin-bottom: 102px; margin-top: 22px;
// margin-bottom: 102px;
.case { .case {
width: 139px; width: 139px;
@@ -570,18 +617,42 @@ body {
overflow: hidden; overflow: hidden;
.swiper-item { .swiper-item {
width: 356px; width: 471px;
height: 200px; height: 200px;
position: relative; position: relative;
border-radius: 10px; border-radius: 10px;
cursor: pointer; cursor: pointer;
&::after {
content: "";
width: 100%;
height: 12px;
background-color: rgba(0, 0, 0, 1);
border-radius: 10px 10px 0 0;
display: block;
position: absolute;
top: 0;
left: 0;
}
&::before {
content: "";
width: 100%;
height: 12px;
background-color: rgba(0, 0, 0, 1);
border-radius: 0 0 10px 10px;
display: block;
position: absolute;
bottom: 0;
left: 0;
}
&:not(:last-child) { &:not(:last-child) {
margin-right: 10px; margin-right: 10px;
} }
.img { .img {
width: 356px; width: 471px;
height: 200px; height: 200px;
border-radius: 10px; border-radius: 10px;
} }
@@ -615,6 +686,7 @@ body {
} }
.school-list { .school-list {
margin-top: 102px;
margin-bottom: 90px; margin-bottom: 90px;
.school-item { .school-item {
@@ -667,6 +739,7 @@ body {
.img { .img {
height: 47px; height: 47px;
margin-right: 10px; margin-right: 10px;
cursor: pointer;
} }
.name { .name {
@@ -676,6 +749,8 @@ body {
font-size: 20px; font-size: 20px;
color: #000000; color: #000000;
margin-bottom: 6px; margin-bottom: 6px;
cursor: pointer;
.arrows { .arrows {
width: 12px; width: 12px;
height: 12px; height: 12px;
@@ -687,6 +762,7 @@ body {
color: #555555; color: #555555;
font-size: 13px; font-size: 13px;
font-family: "ArialMT", "Arial", sans-serif; font-family: "ArialMT", "Arial", sans-serif;
cursor: pointer;
} }
} }
@@ -746,6 +822,12 @@ body {
fill: #fff; fill: #fff;
} }
&.unfold {
.svg {
fill: #7d2882;
}
}
&.pitch { &.pitch {
color: #ffffff; color: #ffffff;
font-weight: 650; font-weight: 650;
@@ -805,7 +887,7 @@ body {
top: 28px; top: 28px;
left: 0; left: 0;
width: 92px; width: 92px;
background-color: rgba(118, 196, 94, 1); background-color: #7d2882;
border-radius: 0 0 10px 10px; border-radius: 0 0 10px 10px;
padding-top: 6px; padding-top: 6px;
&::after { &::after {
@@ -952,7 +1034,9 @@ body {
z-index: 1; z-index: 1;
&::after { &::after {
content: ""; content: "";
background: linear-gradient(90deg, #d6e5e5 0%, rgba(246, 242, 234, 0.976)); // background: linear-gradient(90deg, #d6e5e5 0%, rgba(246, 242, 234, 0.976));
background: linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.9686) 100%);
border: 1px solid #f2f2f2;
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
@@ -1066,13 +1150,13 @@ body {
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
background-color: rgba(0, 0, 0, 0.2); background-color: rgba(0, 0, 0, 0.2);
z-index: 100; z-index: 10000;
.more-school { .more-school {
width: 706px; width: 706px;
border-radius: 20px; border-radius: 20px;
overflow: hidden; overflow: hidden;
background: linear-gradient(90deg, rgba(214, 229, 229, 1) 0%, rgba(246, 242, 234, 1) 100%); background: #fff;
border-radius: 20px; border-radius: 20px;
position: relative; position: relative;
@@ -1090,7 +1174,7 @@ body {
height: 100px; height: 100px;
padding-left: 36px; padding-left: 36px;
background-color: rgba(255, 255, 255, 1); background-color: rgba(255, 255, 255, 1);
border-bottom: 1px dotted #d7d7d7;
.img { .img {
height: 47px; height: 47px;
margin-right: 10px; margin-right: 10px;
@@ -1141,7 +1225,7 @@ body {
top: 0; top: 0;
left: 0; left: 0;
z-index: -1; z-index: -1;
fill: #fff; fill: #ebebeb;
} }
&.pitch { &.pitch {
@@ -1159,6 +1243,7 @@ body {
margin-left: 5px; margin-left: 5px;
vertical-align: middle; vertical-align: middle;
transition: all 0.3s; transition: all 0.3s;
margin-top: 3px;
} }
&.more { &.more {
@@ -1230,7 +1315,8 @@ body {
} }
.list { .list {
height: 448px; max-height: 448px;
min-height: 138px;
overflow: auto; overflow: auto;
padding-right: 20px; padding-right: 20px;
@@ -1253,7 +1339,7 @@ body {
.item { .item {
padding: 12px 10px 10px 20px; padding: 12px 10px 10px 20px;
background-color: #ffffff; background-color: rgba(246, 246, 246, 1);
border-radius: 10px; border-radius: 10px;
&:not(:last-child) { &:not(:last-child) {
@@ -1342,7 +1428,7 @@ body {
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
background-color: rgba(0, 0, 0, 0.4); background-color: rgba(0, 0, 0, 0.4);
z-index: 100; z-index: 10000;
.paly-box { .paly-box {
position: relative; position: relative;
.close { .close {