523 lines
14 KiB
SCSS
523 lines
14 KiB
SCSS
@function px2rem($px) {
|
|
@return $px / 75+rem;
|
|
}
|
|
|
|
body,
|
|
html {
|
|
width: 100%;
|
|
background: #ffffff;
|
|
// overflow: hidden;
|
|
}
|
|
|
|
.back {
|
|
width: 100%;
|
|
height: px2rem(44);
|
|
line-height: px2rem(44);
|
|
position: fixed;
|
|
left: 0;
|
|
top: 0;
|
|
padding-top: px2rem(110);
|
|
padding-bottom: px2rem(22);
|
|
text-align: center;
|
|
color: #FFFFFF;
|
|
font-size: px2rem(38);
|
|
font-weight: bold;
|
|
z-index: 10;
|
|
background: #FFFFFF;
|
|
|
|
img {
|
|
width: px2rem(44);
|
|
height: px2rem(44);
|
|
position: absolute;
|
|
left: px2rem(18);
|
|
// top: px2rem(0);
|
|
}
|
|
|
|
p {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
font-size: px2rem(32);
|
|
color: #313131;
|
|
text-align: center;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
}
|
|
|
|
.user_info {
|
|
margin: px2rem(180) px2rem(32) 0;
|
|
background: #F2F3F7;
|
|
border-radius: px2rem(16);
|
|
padding: px2rem(24) px2rem(40);
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.avatar {
|
|
img {
|
|
width: px2rem(110);
|
|
height: px2rem(110);
|
|
border-radius: 50%;
|
|
}
|
|
}
|
|
|
|
.info {
|
|
margin: 0 px2rem(24);
|
|
|
|
.nick {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 600;
|
|
font-size: px2rem(34);
|
|
color: #333333;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
line-height: px2rem(48);
|
|
|
|
.erbanNo {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
font-size: px2rem(28);
|
|
color: #7B7B7D;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
margin-top: px2rem(2);
|
|
line-height: px2rem(28);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.salary_num {
|
|
margin: px2rem(20) px2rem(32) 0;
|
|
background: #F2F3F7;
|
|
border-radius: px2rem(16);
|
|
padding: px2rem(24) px2rem(20);
|
|
|
|
span {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
font-size: px2rem(30);
|
|
color: #313131;
|
|
line-height: px2rem(42);
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
}
|
|
|
|
.Enter_account {
|
|
background: linear-gradient(270deg, #500FFF 0%, #F854FC 100%);
|
|
border-radius: px2rem(16);
|
|
padding: px2rem(12) px2rem(20);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
font-size: px2rem(30);
|
|
color: #FFFFFF;
|
|
line-height: px2rem(42);
|
|
text-align: center;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
margin: px2rem(20) px2rem(32) 0;
|
|
}
|
|
|
|
.info_salary {
|
|
margin: px2rem(20) px2rem(32) 0;
|
|
|
|
.title {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.xian {
|
|
width: px2rem(8);
|
|
height: px2rem(34);
|
|
background: #C859FF;
|
|
border-radius: px2rem(32);
|
|
display: block;
|
|
}
|
|
|
|
.txt {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 600;
|
|
font-size: px2rem(36);
|
|
color: #313131;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
margin: 0 px2rem(14);
|
|
line-height: px2rem(50);
|
|
}
|
|
|
|
.time_box {
|
|
background: #313131;
|
|
border-radius: px2rem(24);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: px2rem(4) px2rem(6) px2rem(4) px2rem(12);
|
|
|
|
.time {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 600;
|
|
font-size: px2rem(24);
|
|
color: #FFFFFF;
|
|
line-height: px2rem(34);
|
|
text-align: center;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
|
|
img {
|
|
width: px2rem(34);
|
|
height: px2rem(34);
|
|
}
|
|
}
|
|
}
|
|
|
|
.content_box {
|
|
background: #F5EBFF;
|
|
border-radius: px2rem(16);
|
|
margin-top: px2rem(20);
|
|
padding: px2rem(18);
|
|
|
|
.felx_box {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-top: px2rem(18);
|
|
|
|
.Received_salary {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 600;
|
|
font-size: px2rem(28);
|
|
color: #313131;
|
|
line-height: px2rem(40);
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
|
|
.num {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 600;
|
|
font-size: px2rem(26);
|
|
color: #313131;
|
|
line-height: px2rem(36);
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
|
|
.Game_name,
|
|
.Game_Times {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
font-size: px2rem(28);
|
|
color: #313131;
|
|
line-height: px2rem(40);
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
}
|
|
|
|
.felx_box:first-child {
|
|
margin-top: px2rem(0);
|
|
}
|
|
}
|
|
}
|
|
|
|
.Daily_dataBox {
|
|
margin: px2rem(20) px2rem(32) 0;
|
|
|
|
.title {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.xian {
|
|
width: px2rem(8);
|
|
height: px2rem(34);
|
|
background: #C859FF;
|
|
border-radius: px2rem(32);
|
|
display: block;
|
|
}
|
|
|
|
.txt {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 600;
|
|
font-size: px2rem(36);
|
|
color: #313131;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
margin: 0 px2rem(14);
|
|
line-height: px2rem(50);
|
|
}
|
|
|
|
}
|
|
|
|
.content_list {
|
|
.content_box {
|
|
background: #F2F3F7;
|
|
border-radius: px2rem(24);
|
|
padding: px2rem(22) px2rem(18);
|
|
margin-top: px2rem(20);
|
|
|
|
.felx_box {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-top: px2rem(18);
|
|
|
|
.creat_time {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
font-size: px2rem(24);
|
|
color: #7B7B7D;
|
|
line-height: px2rem(34);
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
|
|
.Salary {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 600;
|
|
font-size: px2rem(28);
|
|
color: #313131;
|
|
line-height: px2rem(40);
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
|
|
.num {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 600;
|
|
font-size: px2rem(26);
|
|
color: #313131;
|
|
line-height: px2rem(36);
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
|
|
.Game_name,
|
|
.Game_Times {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
font-size: px2rem(28);
|
|
color: #313131;
|
|
line-height: px2rem(40);
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
|
|
.Go_game {
|
|
background: linear-gradient(270deg, #500FFF 0%, #F854FC 100%);
|
|
border-radius: px2rem(32);
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 600;
|
|
font-size: px2rem(24);
|
|
color: #FFFFFF;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: px2rem(10) px2rem(14);
|
|
}
|
|
|
|
.Receive_btn {
|
|
background: linear-gradient(270deg, #500FFF 0%, #F854FC 100%);
|
|
border-radius: px2rem(32);
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 600;
|
|
font-size: px2rem(24);
|
|
color: #FFFFFF;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: px2rem(10) px2rem(16);
|
|
}
|
|
|
|
.Expired_btn {
|
|
background: #CDCED6;
|
|
border-radius: px2rem(32);
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 600;
|
|
font-size: px2rem(24);
|
|
color: #FFFFFF;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: px2rem(10) px2rem(16);
|
|
}
|
|
.Receive{
|
|
background: linear-gradient(270deg, #500FFF 0%, #F854FC 100%);
|
|
color: #FFFFFF;
|
|
}
|
|
}
|
|
|
|
.felx_box:first-child {
|
|
margin-top: px2rem(0);
|
|
}
|
|
}
|
|
|
|
.content_box:last-child {
|
|
margin-bottom: px2rem(80);
|
|
}
|
|
}
|
|
}
|
|
|
|
.timeBox {
|
|
position: fixed;
|
|
left: 0;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background: rgba(0, 0, 0, .5);
|
|
z-index: 99;
|
|
display: none;
|
|
|
|
.timeBox_in {
|
|
width: px2rem(750);
|
|
height: px2rem(400);
|
|
border-radius: px2rem(32) px2rem(32) 0 0;
|
|
background: #fff;
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
|
|
.title {
|
|
width: 100%;
|
|
height: px2rem(44);
|
|
line-height: px2rem(44);
|
|
text-align: center;
|
|
color: #313131;
|
|
font-weight: 500;
|
|
font-size: px2rem(32);
|
|
position: absolute;
|
|
top: px2rem(24);
|
|
left: 0;
|
|
}
|
|
|
|
.but {
|
|
height: px2rem(44);
|
|
line-height: px2rem(44);
|
|
position: absolute;
|
|
right: px2rem(32);
|
|
top: px2rem(24);
|
|
z-index: 2;
|
|
color: #C859FF;
|
|
font-size: px2rem(32);
|
|
font-weight: 500;
|
|
}
|
|
|
|
ul {
|
|
width: px2rem(750);
|
|
height: 6rem;
|
|
margin-top: px2rem(120);
|
|
overflow-y: scroll;
|
|
|
|
&::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
|
|
li {
|
|
width: 100%;
|
|
text-align: center;
|
|
height: px2rem(64);
|
|
line-height: px2rem(64);
|
|
color: #7B7B7D;
|
|
font-size: px2rem(30);
|
|
font-weight: 400;
|
|
}
|
|
|
|
.act {
|
|
background: #F4F4F4;
|
|
font-weight: 500;
|
|
color: #313131;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.popup_tip {
|
|
display: none;
|
|
/* 初始状态下隐藏弹窗 */
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: rgba(0, 0, 0, 0.5);
|
|
z-index: 9999;
|
|
|
|
// padding: 0 px2rem(50);
|
|
// box-sizing: border-box;
|
|
/* 确保弹窗在最顶层 */
|
|
.popup_content {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
width: px2rem(500);
|
|
padding: px2rem(28) px2rem(46);
|
|
background: #FFFFFF;
|
|
border-radius: px2rem(32);
|
|
|
|
.title {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
font-size: px2rem(30);
|
|
color: #313131;
|
|
line-height: px2rem(42);
|
|
text-align: center;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
|
|
.content {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
font-size: px2rem(26);
|
|
color: #313131;
|
|
line-height: px2rem(36);
|
|
text-align: center;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
margin-top: px2rem(24);
|
|
}
|
|
|
|
.Enter_account {
|
|
background: linear-gradient(270deg, #500FFF 0%, #F854FC 100%);
|
|
border-radius: px2rem(50);
|
|
padding: px2rem(22) px2rem(54);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
font-size: px2rem(30);
|
|
color: #FFFFFF;
|
|
line-height: px2rem(42);
|
|
text-align: center;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
margin: px2rem(20) 0 0;
|
|
}
|
|
|
|
.tip_btn {
|
|
background: #F2F3F7;
|
|
border-radius: px2rem(50);
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 600;
|
|
font-size: px2rem(28);
|
|
color: #313131;
|
|
line-height: px2rem(40);
|
|
text-align: center;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
padding: px2rem(20);
|
|
margin-top: px2rem(30);
|
|
}
|
|
}
|
|
} |