Files
2025-07-07 15:55:44 +08:00

152 lines
2.8 KiB
SCSS

.container {
padding: 0 16px 24px;
.swiper {
margin: 14px 0 18px;
}
.pageTitle {
margin: 14px 0 15px;
}
.errorAlert {
display: flex;
justify-content: center;
align-items: center;
color: #f56c6c;
background-color: #fef0f0;
padding: 8px;
font-size: 14px;
}
.MTTypeDataWrapper {
padding: 12px 4px 30px;
display: flex;
overflow-y: auto;
.MTTypeData {
display: flex;
column-gap: 10px;
.MTTypeDataItem {
position: relative;
flex-shrink: 0;
display: flex;
flex-direction: column;
justify-content: space-between;
width: 302px;
height: 379px;
padding: 14px 16px 103px;
box-sizing: border-box;
box-shadow: -1px 0px 5px 1px rgba(0, 0, 0, 0.1);
.title {
display: flex;
justify-content: space-between;
.label {
font-size: 28px;
line-height: 40px;
font-weight: 700;
color: #333333;
}
.tag {
display: flex;
justify-content: center;
align-items: center;
width: 66px;
height: 27px;
border-radius: 100px;
font-size: 14px;
font-weight: 700;
color: #fff;
background-color: #25c0e5;
}
}
.descs {
display: flex;
flex-direction: column;
.descItem {
display: flex;
justify-content: space-between;
align-items: center;
height: 44px;
border-bottom: 1px solid #ededed;
// &:last-child {
// border-bottom: none;
// }
}
}
.registerBtn {
position: absolute;
left: 50%;
bottom: 25px;
transform: translateX(-50%);
width: 168px;
height: 48px;
white-space: nowrap;
}
}
}
}
.detailModal {
position: relative;
width: calc(100vw - 50px);
max-width: 363px;
padding: 32px 29px 42px;
background-color: #fff;
box-sizing: border-box;
.closeIcon {
position: absolute;
top: 18px;
right: 21px;
width: 17px;
height: 17px;
}
.titleWrapper {
display: flex;
flex-direction: column;
align-items: center;
row-gap: 12px;
color: #333333;
padding: 12px;
margin: 24px 0;
box-shadow: -1px 0 5px 1px rgba(0, 0, 0, 0.1);
.title {
margin: 0;
font-size: 24px;
font-weight: 700;
line-height: 34px;
}
.value {
font-size: 36px;
font-weight: 700;
color: #29bbe4;
line-height: 52px;
}
}
.validateStatusWrapper {
margin-top: 6px;
font-size: 12px;
.validateStatus {
display: flex;
column-gap: 5px;
align-items: center;
.verificationRes {
display: flex;
justify-content: center;
align-items: center;
width: 17px;
height: 17px;
.right {
width: 17px;
height: 17px;
}
.error {
width: 10px;
height: 10px;
}
}
.rightText {
color: #43cf7c;
}
.errorText {
color: #d43030;
}
}
}
}
}