Compare commits
75 Commits
Author | SHA1 | Date | |
---|---|---|---|
![]() |
0f8d25edb3 | ||
![]() |
36525029bb | ||
![]() |
fdf018a180 | ||
![]() |
f7cf35f8bd | ||
![]() |
1705edf079 | ||
![]() |
50e716fdfe | ||
![]() |
8aa8ac618d | ||
![]() |
fd2873bc6b | ||
![]() |
2799036ad5 | ||
![]() |
8c4245d153 | ||
![]() |
0cc92b8949 | ||
![]() |
f39fda566c | ||
![]() |
2b424d2e89 | ||
![]() |
11452efa8b | ||
![]() |
8b41a43f53 | ||
![]() |
fde440750c | ||
![]() |
897be9dd99 | ||
![]() |
507d27a8b9 | ||
![]() |
5cf55fe451 | ||
![]() |
03e7a88218 | ||
![]() |
ba8980c599 | ||
![]() |
00d6d04bcb | ||
![]() |
3d47b18f9d | ||
![]() |
6371686a08 | ||
![]() |
c7f12aa85f | ||
![]() |
3b939cf27f | ||
![]() |
4616c0cdd7 | ||
![]() |
a2ae2b8e8c | ||
![]() |
7a82663ca9 | ||
![]() |
d81a796bb2 | ||
![]() |
f49d29abe6 | ||
![]() |
7b3a472788 | ||
![]() |
b7531e7c14 | ||
![]() |
840d5393be | ||
![]() |
727a37202a | ||
![]() |
e7c8454c44 | ||
![]() |
a7ff72d243 | ||
![]() |
b31d24178a | ||
![]() |
883116d043 | ||
![]() |
0cf9e75431 | ||
![]() |
2426f8fffa | ||
![]() |
321736d1ab | ||
![]() |
5d1a2aa96d | ||
![]() |
fef25d3cc1 | ||
![]() |
264b65e24c | ||
![]() |
b215e0d804 | ||
![]() |
51690d7fc6 | ||
![]() |
dd95263cb2 | ||
![]() |
1b99dc0a90 | ||
![]() |
39c7108646 | ||
![]() |
f0cb98ef62 | ||
![]() |
1c9ee68ae9 | ||
![]() |
57e929aad4 | ||
![]() |
10dad3f7f5 | ||
![]() |
c0c70679c4 | ||
![]() |
4178c9ed08 | ||
![]() |
178e0ffcd6 | ||
![]() |
7aaa2b47b3 | ||
![]() |
e107cea8c9 | ||
![]() |
0f5aa15201 | ||
![]() |
e2301327df | ||
![]() |
3cf68e463e | ||
![]() |
4dd4f27a06 | ||
![]() |
fc9885f271 | ||
![]() |
797f724485 | ||
![]() |
07f7f634a7 | ||
![]() |
95a27e7b3b | ||
![]() |
a241918253 | ||
![]() |
aa3f9a7203 | ||
![]() |
9cfd53a88c | ||
![]() |
2ef8354480 | ||
![]() |
f907063751 | ||
![]() |
c3307b083c | ||
![]() |
be26cc3637 | ||
![]() |
1e1db9a721 |
@@ -1147,7 +1147,7 @@ body {
|
||||
}
|
||||
|
||||
.english .giftBox .textBox .p1 {
|
||||
width: 70%;
|
||||
width: 73%;
|
||||
margin-left: 2rem;
|
||||
padding-right: 0;
|
||||
line-height: 0.34rem;
|
||||
@@ -1195,7 +1195,7 @@ body {
|
||||
width: 75%;
|
||||
padding-right: 0;
|
||||
white-space: nowrap;
|
||||
font-size: 0.21333rem;
|
||||
font-size: 0.24rem;
|
||||
}
|
||||
|
||||
.arabic .giftBox .giftList div .exp {
|
||||
|
@@ -1160,7 +1160,7 @@ body {
|
||||
// 英语
|
||||
.english {
|
||||
.giftBox .textBox .p1 {
|
||||
width: 70%;
|
||||
width: 73%;
|
||||
margin-left: 2rem;
|
||||
padding-right: 0;
|
||||
line-height: 0.34rem;
|
||||
@@ -1213,7 +1213,7 @@ body {
|
||||
width: 75%;
|
||||
padding-right: 0;
|
||||
white-space: nowrap;
|
||||
font-size: px2rem(16);
|
||||
font-size: px2rem(18);
|
||||
}
|
||||
|
||||
.giftBox .giftList div .exp {
|
||||
|
Before Width: | Height: | Size: 44 KiB After Width: | Height: | Size: 236 KiB |
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 131 KiB |
Before Width: | Height: | Size: 215 KiB After Width: | Height: | Size: 1.1 MiB |
Before Width: | Height: | Size: 102 KiB After Width: | Height: | Size: 492 KiB |
Before Width: | Height: | Size: 105 KiB After Width: | Height: | Size: 480 KiB |
Before Width: | Height: | Size: 193 KiB After Width: | Height: | Size: 1.0 MiB |
Before Width: | Height: | Size: 188 KiB After Width: | Height: | Size: 1012 KiB |
Before Width: | Height: | Size: 199 KiB After Width: | Height: | Size: 1.0 MiB |
Before Width: | Height: | Size: 105 KiB After Width: | Height: | Size: 462 KiB |
Before Width: | Height: | Size: 106 KiB After Width: | Height: | Size: 478 KiB |
@@ -16,7 +16,7 @@ langAr = {
|
||||
newIMg4:`./images/giftList4_ar.png`,
|
||||
text1: `تحدى زيادة المستوى`,
|
||||
text2: `قاعدة`,
|
||||
text3: `توقيت الحدث :2024.08.22-2024.08.13`,
|
||||
text3: `وقت النشاط:2024.08.13 إلى 08.22`,
|
||||
text4: `ارسال هديا ،لزيادة المستوى`,
|
||||
text5: `مستخدم vip:يمكنه ارسال هديا الحدث والحصول على اعلي نقاط`,
|
||||
text6: `509564EXP!`,
|
||||
|
@@ -15,19 +15,19 @@ langEn = {
|
||||
text1: `level event`,
|
||||
text2: `rule`,
|
||||
text3: `the time of event :2024.08.13-2024.08.22`,
|
||||
text4: `send gifts and increase ur level`,
|
||||
text5: `vip users can get more exp ,when they send gifts`,
|
||||
text4: `Send following gifts to get EXP`,
|
||||
text5: ` VIP5-9 can get additional EXP, UP TO`,
|
||||
text6: `1001000EXP!`,
|
||||
text7: `Moon ring`,
|
||||
text8: `Holy Demon Staff`,
|
||||
text8: `Crystal Moon`,
|
||||
text9: `Interstellar`,
|
||||
text10: `Interstellar Overlord`,
|
||||
text11: `level`,
|
||||
text12: `reward`,
|
||||
text13: `Level`,
|
||||
text14: `Headwear`,
|
||||
text14: `AvatarFr`,
|
||||
text15: `Chat bubble`,
|
||||
text16: `Entry`,
|
||||
text16: `Mount`,
|
||||
text17: `Medal`,
|
||||
text18: `Chat bubble`,
|
||||
text19: `Level's rewards`,
|
||||
@@ -38,10 +38,10 @@ langEn = {
|
||||
text23: ` `,
|
||||
text24: `Current:LV.`,
|
||||
text25: `more detalis`,
|
||||
text26: `Ranked according to the EXP increased by sending event gifts, EXP The higher the rank, the higher the rank`,
|
||||
text27: `(The top 50 users with the most EXP will receive event awards)`,
|
||||
text26: `Ranked according to the EXP increased by sending event gifts. the higher the EXP, the higher the rank`,
|
||||
text27: `(The top 50 will receive more rewards)`,
|
||||
text28: `EXP Points`,
|
||||
text29: `(Send gifts and increase ur level ,and get rewards)`,
|
||||
text29: `(Send following gifts to get EXP ,and get rewards)`,
|
||||
text30: `The all expx points`,
|
||||
text31: `The event rules`,
|
||||
text32: `Leaderboard rewards`,
|
||||
|
1278
view/molistar/activity/rechargeNew/css/index.css
Normal file
1309
view/molistar/activity/rechargeNew/css/index.scss
Normal file
BIN
view/molistar/activity/rechargeNew/images/bgBottom.png
Normal file
After Width: | Height: | Size: 61 KiB |
BIN
view/molistar/activity/rechargeNew/images/bgCentent.png
Normal file
After Width: | Height: | Size: 1.7 KiB |
BIN
view/molistar/activity/rechargeNew/images/bgTop.png
Normal file
After Width: | Height: | Size: 205 KiB |
BIN
view/molistar/activity/rechargeNew/images/bo.png
Normal file
After Width: | Height: | Size: 2.5 KiB |
BIN
view/molistar/activity/rechargeNew/images/but.png
Normal file
After Width: | Height: | Size: 23 KiB |
BIN
view/molistar/activity/rechargeNew/images/butAct.png
Normal file
After Width: | Height: | Size: 23 KiB |
BIN
view/molistar/activity/rechargeNew/images/close.png
Normal file
After Width: | Height: | Size: 10 KiB |
BIN
view/molistar/activity/rechargeNew/images/header-ar.png
Normal file
After Width: | Height: | Size: 1002 KiB |
BIN
view/molistar/activity/rechargeNew/images/header.png
Normal file
After Width: | Height: | Size: 1004 KiB |
BIN
view/molistar/activity/rechargeNew/images/icon1.png
Normal file
After Width: | Height: | Size: 327 B |
BIN
view/molistar/activity/rechargeNew/images/left.png
Normal file
After Width: | Height: | Size: 3.1 KiB |
BIN
view/molistar/activity/rechargeNew/images/logo.png
Normal file
After Width: | Height: | Size: 3.6 KiB |
BIN
view/molistar/activity/rechargeNew/images/myRechargeBg.png
Normal file
After Width: | Height: | Size: 490 KiB |
BIN
view/molistar/activity/rechargeNew/images/myRechargeBut.png
Normal file
After Width: | Height: | Size: 26 KiB |
BIN
view/molistar/activity/rechargeNew/images/pubBg.png
Normal file
After Width: | Height: | Size: 222 KiB |
BIN
view/molistar/activity/rechargeNew/images/pubTitle.png
Normal file
After Width: | Height: | Size: 40 KiB |
BIN
view/molistar/activity/rechargeNew/images/recharge10-ar.png
Normal file
After Width: | Height: | Size: 58 KiB |
BIN
view/molistar/activity/rechargeNew/images/recharge10.png
Normal file
After Width: | Height: | Size: 59 KiB |
BIN
view/molistar/activity/rechargeNew/images/recharge100-ar.png
Normal file
After Width: | Height: | Size: 59 KiB |
BIN
view/molistar/activity/rechargeNew/images/recharge100.png
Normal file
After Width: | Height: | Size: 59 KiB |
BIN
view/molistar/activity/rechargeNew/images/recharge1000-ar.png
Normal file
After Width: | Height: | Size: 80 KiB |
BIN
view/molistar/activity/rechargeNew/images/recharge1000.png
Normal file
After Width: | Height: | Size: 81 KiB |
BIN
view/molistar/activity/rechargeNew/images/recharge300-ar.png
Normal file
After Width: | Height: | Size: 79 KiB |
BIN
view/molistar/activity/rechargeNew/images/recharge300.png
Normal file
After Width: | Height: | Size: 79 KiB |
BIN
view/molistar/activity/rechargeNew/images/recharge3000-ar.png
Normal file
After Width: | Height: | Size: 643 KiB |
BIN
view/molistar/activity/rechargeNew/images/recharge3000.png
Normal file
After Width: | Height: | Size: 641 KiB |
BIN
view/molistar/activity/rechargeNew/images/recharge500-ar.png
Normal file
After Width: | Height: | Size: 79 KiB |
BIN
view/molistar/activity/rechargeNew/images/recharge500.png
Normal file
After Width: | Height: | Size: 77 KiB |
BIN
view/molistar/activity/rechargeNew/images/right.png
Normal file
After Width: | Height: | Size: 3.1 KiB |
BIN
view/molistar/activity/rechargeNew/images/rule_iconBg.png
Normal file
After Width: | Height: | Size: 1.1 KiB |
BIN
view/molistar/activity/rechargeNew/images/timeBg.png
Normal file
After Width: | Height: | Size: 29 KiB |
BIN
view/molistar/activity/rechargeNew/images/timeBgAct.png
Normal file
After Width: | Height: | Size: 30 KiB |
BIN
view/molistar/activity/rechargeNew/images/title.png
Normal file
After Width: | Height: | Size: 52 KiB |
BIN
view/molistar/activity/rechargeNew/images/top1.png
Normal file
After Width: | Height: | Size: 11 KiB |
BIN
view/molistar/activity/rechargeNew/images/top2.png
Normal file
After Width: | Height: | Size: 8.1 KiB |
BIN
view/molistar/activity/rechargeNew/images/top3.png
Normal file
After Width: | Height: | Size: 8.2 KiB |
BIN
view/molistar/activity/rechargeNew/images/travel/back.png
Normal file
After Width: | Height: | Size: 2.0 KiB |
BIN
view/molistar/activity/rechargeNew/images/travel/backB.png
Normal file
After Width: | Height: | Size: 1.9 KiB |
BIN
view/molistar/activity/rechargeNew/images/why.png
Normal file
After Width: | Height: | Size: 6.3 KiB |
266
view/molistar/activity/rechargeNew/index.html
Normal file
@@ -0,0 +1,266 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title class="text1"></title>
|
||||
<link rel="stylesheet" href="../../common/css/reset.css">
|
||||
<link rel="stylesheet" href="./css/index.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- 頂部返回 -->
|
||||
<div class="back">
|
||||
<img src="./images/travel/back.png" alt="">
|
||||
</div>
|
||||
<!-- 头部 -->
|
||||
<div class="header">
|
||||
<div class="rule_icon text2"></div>
|
||||
<!-- 倒计时 -->
|
||||
<div class="time">
|
||||
<div class="day">
|
||||
<b>0</b>
|
||||
<span class="text3"></span>
|
||||
</div>
|
||||
<div class="hour">
|
||||
<b>0</b>
|
||||
<span class="text4"></span>
|
||||
</div>
|
||||
<div class="colon"></div>
|
||||
<div class="min">
|
||||
<b>0</b>
|
||||
<span class="text5"></span>
|
||||
</div>
|
||||
<div class="colon"></div>
|
||||
<div class="sec">
|
||||
<b>0</b>
|
||||
<span class="text6"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 我的充值 -->
|
||||
<div class="myRecharge">
|
||||
<div class="title text7"></div>
|
||||
<p><b>$0</b><img style="display: none;" src="./images/why.png" alt=""></p>
|
||||
<div class="but text8"></div>
|
||||
</div>
|
||||
<!-- 充值档位到达10 -->
|
||||
<div class="recharge10 recharge1 recharges">
|
||||
<div class="top">
|
||||
<div class="title text9"></div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="rewardImg">
|
||||
<div class="ts" id="ts10"></div>
|
||||
<div class="zj" id="zj10"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<div class="but text10"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 充值档位到达100 -->
|
||||
<div class="recharge100 recharge2 recharges">
|
||||
<div class="top">
|
||||
<div class="title text11"></div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="rewardImg">
|
||||
<div class="ts" id="ts100"></div>
|
||||
<div class="zj" id="zj100"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<div class="but text10"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 充值档位到达300 -->
|
||||
<div class="recharge300 recharge3 recharges">
|
||||
<div class="top">
|
||||
<div class="title text12"></div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<!-- 奖励图片 -->
|
||||
<div class="rewardImg">
|
||||
<div class="ts" id="ts300"></div>
|
||||
<div class="zj" id="zj300"></div>
|
||||
</div>
|
||||
<!-- 前三标题 -->
|
||||
<div class="topTitle">
|
||||
<img src="./images/left.png" alt="" class="left">
|
||||
<b class="text13"></b>
|
||||
<img src="./images/right.png" alt="" class="right">
|
||||
</div>
|
||||
<!-- 前三信息 -->
|
||||
<div class="topBox">
|
||||
<div class="no2">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<img src="./images/top2.png" alt="" class="ts">
|
||||
</div>
|
||||
<div class="no1">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<img src="./images/top1.png" alt="" class="ts">
|
||||
</div>
|
||||
<div class="no3">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<img src="./images/top3.png" alt="" class="ts">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<div class="but text10"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 充值档位到达500 -->
|
||||
<div class="recharge500 recharge4 recharges">
|
||||
<div class="top">
|
||||
<div class="title text14"></div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<!-- 奖励图片 -->
|
||||
<div class="rewardImg">
|
||||
<div class="ts" id="ts500"></div>
|
||||
<div class="zj" id="zj500"></div>
|
||||
</div>
|
||||
<!-- 前三标题 -->
|
||||
<div class="topTitle">
|
||||
<img src="./images/left.png" alt="" class="left">
|
||||
<b class="text13"></b>
|
||||
<img src="./images/right.png" alt="" class="right">
|
||||
</div>
|
||||
<!-- 前三信息 -->
|
||||
<div class="topBox">
|
||||
<div class="no2">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<img src="./images/top2.png" alt="" class="ts">
|
||||
</div>
|
||||
<div class="no1">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<img src="./images/top1.png" alt="" class="ts">
|
||||
</div>
|
||||
<div class="no3">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<img src="./images/top3.png" alt="" class="ts">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<div class="but text10"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 充值档位到达1000 -->
|
||||
<div class="recharge1000 recharge5 recharges">
|
||||
<div class="top">
|
||||
<div class="title text15"></div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<!-- 奖励图片 -->
|
||||
<div class="rewardImg">
|
||||
<div class="ts" id="ts1000"></div>
|
||||
<div class="zj" id="zj1000"></div>
|
||||
</div>
|
||||
<!-- 前三标题 -->
|
||||
<div class="topTitle">
|
||||
<img src="./images/left.png" alt="" class="left">
|
||||
<b class="text13"></b>
|
||||
<img src="./images/right.png" alt="" class="right">
|
||||
</div>
|
||||
<!-- 前三信息 -->
|
||||
<div class="topBox">
|
||||
<div class="no2">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<img src="./images/top2.png" alt="" class="ts">
|
||||
</div>
|
||||
<div class="no1">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<img src="./images/top1.png" alt="" class="ts">
|
||||
</div>
|
||||
<div class="no3">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<img src="./images/top3.png" alt="" class="ts">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<div class="but text10"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 充值档位到达3000 -->
|
||||
<div class="recharge3000 recharge6 recharges">
|
||||
<div class="top">
|
||||
<div class="title text16"></div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<!-- 奖励图片 -->
|
||||
<div class="rewardImg">
|
||||
<div class="ts" id="ts3000"></div>
|
||||
<img src="./images/bo.png" alt="" class="bo">
|
||||
<img src="./images/why.png" alt="" class="why">
|
||||
</div>
|
||||
<!-- 前三标题 -->
|
||||
<div class="topTitle">
|
||||
<img src="./images/left.png" alt="" class="left">
|
||||
<b class="text26"></b>
|
||||
<img src="./images/right.png" alt="" class="right">
|
||||
</div>
|
||||
<!-- 前三信息 -->
|
||||
<div class="topBox">
|
||||
<div class="no2">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<img src="./images/top2.png" alt="" class="ts">
|
||||
</div>
|
||||
<div class="no1">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<img src="./images/top1.png" alt="" class="ts">
|
||||
</div>
|
||||
<div class="no3">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<img src="./images/top3.png" alt="" class="ts">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<div class="but text10"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 弹窗 -->
|
||||
<div class="pub">
|
||||
<div class="pub_in">
|
||||
<img src="./images/close.png" alt="" class="close">
|
||||
<div class="title">Rules </div>
|
||||
<div class="centent">
|
||||
<p>1、Recharge activity time: 0:00:00 on the 1st of each month to 23:59:59 on the last day of the month
|
||||
(GMT+3).</p>
|
||||
<p>2、You can only get each grade reward once.</p>
|
||||
<p>3、Each round of activities end, the rewards will automatically expire.</p>
|
||||
<p>4、Contact our official customer service to get your unique ID!</p>
|
||||
<p>5、Recharge agent can not join the activity.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 免责声明 -->
|
||||
<div class="disclaimer text24"></div>
|
||||
<div class="video">
|
||||
<video id="zjVideo" controls>
|
||||
<source src="./mp4/3000.mp4" type="video/mp4">
|
||||
</video>
|
||||
<img src="./images/close.png" alt="" class="close">
|
||||
</div>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
<script src="../../common/js/flexible.js"></script>
|
||||
<script src="../../common/js/jquery-3.2.1.min.js"></script>
|
||||
<script src="../../common/js/common2.js"></script>
|
||||
<script src="../../common/js/layer.js"></script>
|
||||
<script src="../../common/js/vconsole.min.js"></script>
|
||||
<script src="../../common/js/route-constant.js"></script>
|
||||
<script src="../../common/js/svga.min.js"></script>
|
||||
<script src="./local/en.js"></script>
|
||||
<script src="./local/zh.js"></script>
|
||||
<script src="./local/ar.js"></script>
|
||||
<script src="./js/index.js"></script>
|
||||
<script src="../../common/local/langHandler.js"></script>
|
309
view/molistar/activity/rechargeNew/js/index.js
Normal file
@@ -0,0 +1,309 @@
|
||||
let urlPrefix = getUrlPrefix()
|
||||
let browser = checkVersion()
|
||||
let env = EnvCheck();
|
||||
if (env == 'test') {
|
||||
new VConsole();
|
||||
}
|
||||
// 封裝layer消息提醒框
|
||||
let layerIndex
|
||||
var langReplace;
|
||||
var localLang;
|
||||
const showLoading = (content = langReplace(localLang.demoModule.layerIndex1)) => {
|
||||
layer.open({
|
||||
type: 2,
|
||||
shadeClose: false,
|
||||
content,
|
||||
success(e) {
|
||||
layerIndex = $(e).attr('index')
|
||||
}
|
||||
})
|
||||
}
|
||||
const hideLoading = (index) => {
|
||||
layer.close(index)
|
||||
}
|
||||
const toastMsg = (content = langReplace(localLang.demoModule.layerIndex2), time = 2) => {
|
||||
layer.open({
|
||||
content,
|
||||
time,
|
||||
skin: 'msg'
|
||||
})
|
||||
}
|
||||
var countupTime;//倒计时容器
|
||||
var isLock = true;
|
||||
var page = 1;
|
||||
var wealth;
|
||||
var limitWealth;
|
||||
// 初始化函數
|
||||
$(function () {
|
||||
getInfoFromClient();
|
||||
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
|
||||
setTimeout(function () {
|
||||
// 頁面全屏
|
||||
if (browser.app) {
|
||||
if (browser.android) {
|
||||
window.androidJsObj.initShowNav(false)
|
||||
} else {
|
||||
window.webkit.messageHandlers.initShowNav.postMessage(0)
|
||||
}
|
||||
};
|
||||
// 頂部返回事件
|
||||
$('.back img').click(() => {
|
||||
if (browser.android) {
|
||||
window.androidJsObj.closeWebView()
|
||||
} else {
|
||||
window.webkit.messageHandlers.closeWebView.postMessage(null)
|
||||
}
|
||||
})
|
||||
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
|
||||
langReplace = window.lang.replace;
|
||||
localLang = window.lang;
|
||||
translateFun();
|
||||
getConfig();
|
||||
}, 100)
|
||||
|
||||
})
|
||||
// 处理SVGA
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
function loadSVGA(containerId, svgaPath) {
|
||||
var container = document.getElementById(containerId);
|
||||
var player = new SVGA.Player(container);
|
||||
|
||||
var parser = new SVGA.Parser();
|
||||
parser.load(svgaPath, function (videoItem) {
|
||||
player.setVideoItem(videoItem);
|
||||
player.startAnimation();
|
||||
});
|
||||
}
|
||||
|
||||
loadSVGA('ts10', './svga/100.svga');
|
||||
loadSVGA('ts100', './svga/300.svga');
|
||||
loadSVGA('ts300', './svga/10.svga');
|
||||
loadSVGA('ts500', './svga/500.svga');
|
||||
loadSVGA('ts1000', './svga/1000.svga');
|
||||
loadSVGA('ts3000', './svga/3000.svga');
|
||||
loadSVGA('zj10', './svga/zj10.svga');
|
||||
loadSVGA('zj100', './svga/zj100.svga');
|
||||
loadSVGA('zj300', './svga/zj300.svga');
|
||||
loadSVGA('zj500', './svga/zj500.svga');
|
||||
loadSVGA('zj1000', './svga/zj1000.svga');
|
||||
});
|
||||
function translateFun() {
|
||||
var langReplace = window.lang.replace;
|
||||
var localLang = window.lang;
|
||||
$('.text1').text(langReplace(localLang.demoModule.text1));
|
||||
$('.text2').text(langReplace(localLang.demoModule.text2));
|
||||
$('.text3').text(langReplace(localLang.demoModule.text3));
|
||||
$('.text4').text(langReplace(localLang.demoModule.text4));
|
||||
$('.text5').text(langReplace(localLang.demoModule.text5));
|
||||
$('.text6').text(langReplace(localLang.demoModule.text6));
|
||||
$('.text7').text(langReplace(localLang.demoModule.text7));
|
||||
$('.text8').text(langReplace(localLang.demoModule.text8));
|
||||
$('.text9').text(langReplace(localLang.demoModule.text9));
|
||||
$('.text10').text(langReplace(localLang.demoModule.text10));
|
||||
$('.text11').text(langReplace(localLang.demoModule.text11));
|
||||
$('.text12').text(langReplace(localLang.demoModule.text12));
|
||||
$('.text13').text(langReplace(localLang.demoModule.text13));
|
||||
$('.text14').text(langReplace(localLang.demoModule.text14));
|
||||
$('.text15').text(langReplace(localLang.demoModule.text15));
|
||||
$('.text16').text(langReplace(localLang.demoModule.text16));
|
||||
$('.text26').text(langReplace(localLang.demoModule.text26));
|
||||
if (browser.android) {
|
||||
$('.text24').text(langReplace(localLang.demoModule.text25))
|
||||
} else {
|
||||
$('.text24').text(langReplace(localLang.demoModule.text24))
|
||||
}
|
||||
}
|
||||
// 配置接口
|
||||
function getConfig() {
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'get',
|
||||
url: urlPrefix + '/activity/h5/charge/rank',
|
||||
data: { uid: pubInfo.uid },
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
wealth = res.data.wealth;
|
||||
limitWealth = res.data.limitWealth;
|
||||
// 处理是否我的充值展示
|
||||
if(res.data.rechargeUser){
|
||||
$('.myRecharge').hide();
|
||||
}else{
|
||||
$('.myRecharge').show();
|
||||
}
|
||||
// 处理倒计时
|
||||
countup(res.data.endTime - res.timestamp);
|
||||
// 处理当前余额
|
||||
$('.myRecharge p b').text('$' + res.data.usb);
|
||||
// 渲染档位
|
||||
res.data.activityLevelUserVo.forEach((res, i) => {
|
||||
$(`.recharge${i + 1} .bottom .but`).attr('level', res.level);
|
||||
// 处理按钮状态
|
||||
if (res.receiveStatus == false) {
|
||||
if (res.receiveSwitch) {
|
||||
$(`.recharge${i + 1} .bottom .but`).attr('click', 1);
|
||||
$(`.recharge${i + 1} .bottom .but`).addClass('act');
|
||||
} else {
|
||||
$(`.recharge${i + 1} .bottom .but`).attr('click', 0);
|
||||
$(`.recharge${i + 1} .bottom .but`).removeClass('act');
|
||||
}
|
||||
} else {
|
||||
$(`.recharge${i + 1} .bottom .but`).attr('click', 0);
|
||||
$(`.recharge${i + 1} .bottom .but`).removeClass('act');
|
||||
$(`.recharge${i + 1} .bottom .but`).text(langReplace(localLang.demoModule.text23));
|
||||
}
|
||||
// 处理前三
|
||||
if (wealth > limitWealth) {
|
||||
res.userVos.forEach((val, index) => {
|
||||
$(`.recharge${i + 1} .content .topBox .no${index + 1} .tx`).attr('src', val.avatar);
|
||||
})
|
||||
} else {
|
||||
$(`.recharge${i + 1} .content .topTitle`).hide();
|
||||
$(`.recharge${i + 1} .content .topBox`).hide();
|
||||
}
|
||||
})
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
},
|
||||
error(err) {
|
||||
hideLoading(layerIndex)
|
||||
toastMsg(langReplace(localLang.demoModule.layerIndex3))
|
||||
}
|
||||
})
|
||||
}
|
||||
// 跳转充值
|
||||
$('.myRecharge .but').click(function () {
|
||||
if (browser.android) {
|
||||
let channel = pubInfo.deviceInfo.channel;
|
||||
if (channel == "google") {
|
||||
window.androidJsObj.openChargePage(6);
|
||||
} else {
|
||||
window.androidJsObj.openChargePage(6);
|
||||
window.location.href = urlPrefix + '/molistar/modules/pay/index.html?channelType=4';
|
||||
}
|
||||
} else if (browser.ios) {
|
||||
let channel = pubInfo.deviceInfo.channel;
|
||||
if (channel == "appstore") {
|
||||
window.webkit.messageHandlers.openChargePage.postMessage(null);
|
||||
} else {
|
||||
window.webkit.messageHandlers.chargePayClickPage.postMessage(6);
|
||||
window.location.href = urlPrefix + '/molistar/modules/pay/index.html?channelType=4';
|
||||
}
|
||||
}
|
||||
})
|
||||
// 打开规则弹窗
|
||||
$('.header .rule_icon').click(function () {
|
||||
$('.pub .pub_in .title').html(langReplace(localLang.demoModule.text17));
|
||||
$('.pub .pub_in .centent').html(langReplace(localLang.demoModule.text18));
|
||||
$('.pub ').show();
|
||||
bodyScroolFun(true);
|
||||
})
|
||||
// 打开我的充值弹窗
|
||||
$('.myRecharge p img').click(function () {
|
||||
$('.pub .pub_in .centent').addClass('myRechargeText');
|
||||
$('.pub .pub_in .title').html(langReplace(localLang.demoModule.text19));
|
||||
$('.pub .pub_in .centent').html(langReplace(localLang.demoModule.text20));
|
||||
$('.pub ').show();
|
||||
bodyScroolFun(true);
|
||||
})
|
||||
// 打开定制礼物弹窗
|
||||
$('.recharge3000 .content .rewardImg .why').click(function () {
|
||||
$('.pub .pub_in .centent').addClass('myRechargeTextWhy');
|
||||
$('.pub .pub_in .title').html(langReplace(localLang.demoModule.text21));
|
||||
$('.pub .pub_in .centent').html(langReplace(localLang.demoModule.text22));
|
||||
$('.pub ').show();
|
||||
bodyScroolFun(true);
|
||||
})
|
||||
// 关闭弹窗
|
||||
$('.pub .pub_in .close').click(function () {
|
||||
$('.pub .pub_in .centent').removeClass('myRechargeText');
|
||||
$('.pub .pub_in .centent').removeClass('myRechargeTextWhy');
|
||||
$('.pub ').hide();
|
||||
bodyScroolFun(false);
|
||||
})
|
||||
// 倒計時
|
||||
function countup(leftTime) {
|
||||
clearTimeout(countupTime)
|
||||
//獲取當前時間
|
||||
// var now = nowTime;
|
||||
var d = 0;
|
||||
var h = 0;
|
||||
var m = 0;
|
||||
var s = 0;
|
||||
//定義變數 d,h,m,s保存倒計時的時間
|
||||
var d, h, m, s;
|
||||
//遞歸每秒調⽤countTime⽅法,顯⽰動態時間效果
|
||||
if (leftTime > 0) {
|
||||
d = getzf(Math.floor(leftTime / 1000 / 60 / 60 / 24));
|
||||
h = getzf(Math.floor(leftTime / 1000 / 60 / 60 % 24));
|
||||
m = getzf(Math.floor(leftTime / 1000 / 60 % 60));
|
||||
s = getzf(Math.floor(leftTime / 1000 % 60));
|
||||
//將倒計時賦值到div中
|
||||
$('.header .time .day b').text(d);
|
||||
$('.header .time .hour b').text(h);
|
||||
$('.header .time .min b').text(m);
|
||||
$('.header .time .sec b').text(s);
|
||||
} else {
|
||||
getConfig();
|
||||
}
|
||||
if (leftTime > 0) {
|
||||
leftTime = leftTime - 1000;
|
||||
}
|
||||
countupTime = setTimeout(function () {
|
||||
countup(leftTime);
|
||||
}, 1000);
|
||||
}
|
||||
//补0操作
|
||||
function getzf(num) {
|
||||
if (parseInt(num) < 10) {
|
||||
num = '0' + num;
|
||||
}
|
||||
return num;
|
||||
}
|
||||
// 领取按钮
|
||||
$('.recharges .bottom .but').click(function () {
|
||||
var level = $(this).attr('level');
|
||||
var click = $(this).attr('click');
|
||||
if (click == 1) {
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'get',
|
||||
url: urlPrefix + '/activity/h5/charge/recv',
|
||||
data: { uid: pubInfo.uid, level },
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
getConfig();
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
},
|
||||
error(err) {
|
||||
hideLoading(layerIndex)
|
||||
toastMsg(langReplace(localLang.demoModule.layerIndex3))
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
// 打开mp4弹窗
|
||||
$('.recharge3000 .content .rewardImg .bo').click(function () {
|
||||
var video = document.getElementById('zjVideo');
|
||||
video.play();
|
||||
bodyScroolFun(true);
|
||||
$('.video').show();
|
||||
})
|
||||
// 关闭mp4弹窗
|
||||
$('.video .close').click(function () {
|
||||
var video = document.getElementById('zjVideo');
|
||||
video.pause();
|
||||
bodyScroolFun(false);
|
||||
$('.video').hide();
|
||||
})
|
||||
// 监听播放完毕事件
|
||||
var video = document.getElementById('zjVideo');
|
||||
video.addEventListener('ended', function () {
|
||||
video.pause();
|
||||
bodyScroolFun(false);
|
||||
$('.video').hide();
|
||||
});
|
45
view/molistar/activity/rechargeNew/local/ar.js
Normal file
@@ -0,0 +1,45 @@
|
||||
// 阿拉伯
|
||||
langAr = {
|
||||
// 模块
|
||||
demoModule: {
|
||||
layerIndex1: `جار التحميل...`,
|
||||
layerIndex2: `نجاح`,
|
||||
layerIndex3: `خطأ في الشبكة`,
|
||||
text1: `إعادة شحن شهرية`,
|
||||
text2: `القواعد`,
|
||||
text3: `يوم`,
|
||||
text4: `ساعة`,
|
||||
text5: `دقيقة`,
|
||||
text6: `ثانية`,
|
||||
text7: `إعادة شحني`,
|
||||
text8: `انتقل إلى إعادة الشحن`,
|
||||
text9: `إعادة شحن $10`,
|
||||
text10: `احصل على مكافأة`,
|
||||
text11: `إعادة شحن $100`,
|
||||
text12: `إعادة شحن $300`,
|
||||
text13: `أفضل 3 فائزين`,
|
||||
text14: `إعادة شحن $500`,
|
||||
text15: `إعادة شحن $1000`,
|
||||
text16: `إعادة شحن $3000`,
|
||||
text17: `القواعد`,
|
||||
text18: `
|
||||
<p>1، وقت نشاط إعادة الشحن: من 00:00:00 في اليوم الأول من كل شهر إلى 23:59:59 في اليوم الأخير من الشهر (GMT+3).</p>
|
||||
<p>2، يمكنك الحصول على مكافأة كل درجة مرة واحدة فقط.</p>
|
||||
<p>3، عند انتهاء كل جولة من الأنشطة، ستنتهي المكافآت تلقائيًا.</p>
|
||||
<p>4، اتصل بخدمة العملاء الرسمية للحصول على معرفك الفريد!</p>
|
||||
<p>5، لا يمكن لوكيل الشحن الانضمام إلى النشاط.</p>
|
||||
<p>6، هذا الحدث ليس مرتبطًا بجوجل/أبل.</p>
|
||||
`,
|
||||
text19: `إعادة شحن شهريتي`,
|
||||
text20: `
|
||||
<p>1، تشمل طرق إعادة الشحن Google وApple الداخلية وما إلى ذلك.</p>
|
||||
<p>2، لا يمكن لوكيل الشحن الانضمام إلى النشاط.</p>
|
||||
`,
|
||||
text21: `هدية مخصصة`,
|
||||
text22: `<p>يمكنك إرسال الفيديو الخاص بك إلى خدمة العملاء لدينا للحصول على هديتك المخصصة.</p>`,
|
||||
text23: `تم استلامه`,
|
||||
text24: `هذا الحدث غير مرتبط بشركة أبل.`,
|
||||
text25: `هذا الحدث غير مرتبط بشركة جوجل.`,
|
||||
text26: `أفضل 3 فائزين`,
|
||||
}
|
||||
}
|
43
view/molistar/activity/rechargeNew/local/en.js
Normal file
@@ -0,0 +1,43 @@
|
||||
langEn = {
|
||||
demoModule: {
|
||||
layerIndex1: `Loading...`,
|
||||
layerIndex2: `Success`,
|
||||
layerIndex3: `Network error`,
|
||||
text1: `Monthoy recharge`,
|
||||
text2: `Rules`,
|
||||
text3: `Day`,
|
||||
text4: `Hour`,
|
||||
text5: `Min`,
|
||||
text6: `Sec`,
|
||||
text7: `My Recharge`,
|
||||
text8: `Go to Recharge`,
|
||||
text9: `Recharge $10`,
|
||||
text10: `Get reward`,
|
||||
text11: `Recharge $100`,
|
||||
text12: `Recharge $300`,
|
||||
text13: `Top 3 Winner`,
|
||||
text14: `Recharge $500`,
|
||||
text15: `Recharge $1000`,
|
||||
text16: `Recharge $3000`,
|
||||
text17: `Rules`,
|
||||
text18: `
|
||||
<p>1. Recharge activity time: 0:00:00 on the 1st of each month to 23:59:59 on the last day of the month (GMT+3).</p>
|
||||
<p>2. You can only get each grade reward once.</p>
|
||||
<p>3. Each round of activities end, the rewards will automatically expire.</p>
|
||||
<p>4. Contact our official customer service to get your unique ID!</p>
|
||||
<p>5. Recharge agent can not join the activity.</p>
|
||||
<p>6. This event is not related to Google/Apple.</p>
|
||||
`,
|
||||
text19: `My Monthly Recharge`,
|
||||
text20: `
|
||||
<p>1、Recharge methods include Google, Apple internal purchase and so on.</p>
|
||||
<p>2、Recharge agent can not join the activity.</p>
|
||||
`,
|
||||
text21: `Customized Gift`,
|
||||
text22: `<p>You can send your special video to our customer service to get your customized gift.</p>`,
|
||||
text23: `Received`,
|
||||
text24: `This event is not related to Apple.`,
|
||||
text25: `This event is not related to Google.`,
|
||||
text26: `Top 3 Winner`,
|
||||
}
|
||||
}
|
45
view/molistar/activity/rechargeNew/local/zh.js
Normal file
@@ -0,0 +1,45 @@
|
||||
// 中文
|
||||
langZh = {
|
||||
// 模塊
|
||||
demoModule: {
|
||||
layerIndex1: `加載中...`,
|
||||
layerIndex2: `成功`,
|
||||
layerIndex3: `網絡錯誤`,
|
||||
text1: `月度充值`,
|
||||
text2: `規則`,
|
||||
text3: `天`,
|
||||
text4: `小時`,
|
||||
text5: `分鐘`,
|
||||
text6: `秒`,
|
||||
text7: `我的充值`,
|
||||
text8: `前往充值`,
|
||||
text9: `充值 $10`,
|
||||
text10: `獲得獎勵`,
|
||||
text11: `充值 $100`,
|
||||
text12: `充值 $300`,
|
||||
text13: `前三名獲獎者`,
|
||||
text14: `充值 $500`,
|
||||
text15: `充值 $1000`,
|
||||
text16: `充值 $3000`,
|
||||
text17: `規則`,
|
||||
text18: `
|
||||
<p>1、充值活動時間:每月1日00:00:00到每月最後一天23:59:59(GMT+3)。</p>
|
||||
<p>2、每個等級的獎勵只能獲得一次。</p>
|
||||
<p>3、每輪活動結束後,獎勵將自動過期。</p>
|
||||
<p>4、聯系客服獲取您的唯一ID!</p>
|
||||
<p>5、充值代理不能參加活動。</p>
|
||||
<p>6、該活動與谷歌/蘋果無關。</p>
|
||||
`,
|
||||
text19: `我的月度充值`,
|
||||
text20: `
|
||||
<p>1、充值方式包括Google、Apple內購等。</p>
|
||||
<p>2、充值代理不能參加活動。</p>
|
||||
`,
|
||||
text21: `定製禮品`,
|
||||
text22: `<p>您可以將您的特別視頻發送給我們的客服,以獲取定製禮品。</p>`,
|
||||
text23: `已領取`,
|
||||
text24: `本活動與蘋果無關`,
|
||||
text25: `本活動與谷歌無關`,
|
||||
text26: `前3名獲獎者`,
|
||||
}
|
||||
}
|
BIN
view/molistar/activity/rechargeNew/mp4/3000.mp4
Normal file
BIN
view/molistar/activity/rechargeNew/svga/10.svga
Normal file
BIN
view/molistar/activity/rechargeNew/svga/100.svga
Normal file
BIN
view/molistar/activity/rechargeNew/svga/1000.svga
Normal file
BIN
view/molistar/activity/rechargeNew/svga/300.svga
Normal file
BIN
view/molistar/activity/rechargeNew/svga/3000.svga
Normal file
BIN
view/molistar/activity/rechargeNew/svga/500.svga
Normal file
BIN
view/molistar/activity/rechargeNew/svga/zj10.svga
Normal file
BIN
view/molistar/activity/rechargeNew/svga/zj100.svga
Normal file
BIN
view/molistar/activity/rechargeNew/svga/zj1000.svga
Normal file
BIN
view/molistar/activity/rechargeNew/svga/zj300.svga
Normal file
BIN
view/molistar/activity/rechargeNew/svga/zj500.svga
Normal file
637
view/molistar/activity/ssGuild/css/index.css
Normal file
@@ -0,0 +1,637 @@
|
||||
@charset "UTF-8";
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
background: #00121E;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
html::-webkit-scrollbar,
|
||||
body::-webkit-scrollbar {
|
||||
display: none;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.back {
|
||||
width: 100%;
|
||||
height: 0.58667rem;
|
||||
line-height: 0.58667rem;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0.86667rem;
|
||||
text-align: center;
|
||||
color: #FFFFFF;
|
||||
font-size: 0.50667rem;
|
||||
font-weight: bold;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.back img {
|
||||
width: 0.58667rem;
|
||||
height: 0.58667rem;
|
||||
position: absolute;
|
||||
left: 0.24rem;
|
||||
top: 0rem;
|
||||
}
|
||||
|
||||
.header {
|
||||
width: 10rem;
|
||||
height: 32.90667rem;
|
||||
background: url(../images/header.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
margin: 0 auto 0rem;
|
||||
box-sizing: border-box;
|
||||
padding-top: 8.46667rem;
|
||||
}
|
||||
|
||||
.header .actTime {
|
||||
width: 7.06667rem;
|
||||
height: 0.77333rem;
|
||||
line-height: 0.77333rem;
|
||||
text-align: center;
|
||||
color: #FFEDC1;
|
||||
font-size: 0.37333rem;
|
||||
font-weight: 500;
|
||||
background: linear-gradient(0deg, #152738, #0F5881);
|
||||
border-radius: 0.77333rem;
|
||||
border: 0.04rem solid #FFDFB2;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 5.21333rem;
|
||||
}
|
||||
|
||||
.header .time {
|
||||
width: 7.6rem;
|
||||
height: 1.89333rem;
|
||||
margin: 0 auto 0.62667rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.header .time div {
|
||||
width: 1.33333rem;
|
||||
height: 1.89333rem;
|
||||
background: url(../images/timeBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.header .time div b {
|
||||
display: inline-block;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.58667rem;
|
||||
font-weight: 600;
|
||||
margin-top: 0.36rem;
|
||||
margin-bottom: 0.50667rem;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
height: 0.46667rem;
|
||||
}
|
||||
|
||||
.header .time div span {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.37333rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.header .content {
|
||||
width: 9.28rem;
|
||||
height: 4.02667rem;
|
||||
margin: 0 auto 0.36rem;
|
||||
background: url(../images/boxBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 0 0.53333rem;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.34667rem;
|
||||
font-weight: 400;
|
||||
line-height: 0.53333rem;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
/* 水平居中 */
|
||||
align-items: center;
|
||||
/* 垂直居中 */
|
||||
}
|
||||
|
||||
.header .tab {
|
||||
width: 8.93333rem;
|
||||
height: 1.30667rem;
|
||||
line-height: 1.30667rem;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 0 auto 0rem;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.header .tab div {
|
||||
width: 4.24rem;
|
||||
height: 1.30667rem;
|
||||
background: url(../images/tab.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #FFEFC3;
|
||||
font-size: 0.48rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.header .tab .act {
|
||||
background: url(../images/tabAct.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.page1 .cloud {
|
||||
width: 10rem;
|
||||
height: 11.06667rem;
|
||||
background: url(../images/cloud.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: -17.3rem auto -2.6rem;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.page1 .cloud .no1 {
|
||||
width: 5rem;
|
||||
height: 6.08rem;
|
||||
position: absolute;
|
||||
top: 1.50667rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background: url(../images/top1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.page1 .cloud .no1 .ts {
|
||||
width: 2.66667rem;
|
||||
height: 2.66667rem;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 0.93333rem;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.page1 .cloud .no1 .tx {
|
||||
width: 1.86667rem;
|
||||
height: 1.86667rem;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 1.33333rem;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.page1 .cloud .no1 .name {
|
||||
width: 57%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
height: 0.4rem;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.37333rem;
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 3.6rem;
|
||||
}
|
||||
|
||||
.page1 .cloud .no1 .id {
|
||||
width: 57%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
height: 0.4rem;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.37333rem;
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 4.02667rem;
|
||||
}
|
||||
|
||||
.page1 .cloud .no1 .grade {
|
||||
width: 1.01333rem;
|
||||
height: 0.66667rem;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 4.49333rem;
|
||||
}
|
||||
|
||||
.page1 .cloud .no2 {
|
||||
width: 3.65333rem;
|
||||
height: 5.06667rem;
|
||||
position: absolute;
|
||||
top: 3.14667rem;
|
||||
left: 0rem;
|
||||
background: url(../images/top2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.page1 .cloud .no2 .ts {
|
||||
width: 2.21333rem;
|
||||
height: 2.21333rem;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-62%);
|
||||
top: 0.8rem;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.page1 .cloud .no2 .tx {
|
||||
width: 1.54667rem;
|
||||
height: 1.54667rem;
|
||||
position: absolute;
|
||||
left: 0.8rem;
|
||||
top: 1.13333rem;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.page1 .cloud .no2 .name {
|
||||
width: 57%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
height: 0.4rem;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.37333rem;
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
transform: translateX(-62%);
|
||||
top: 3rem;
|
||||
}
|
||||
|
||||
.page1 .cloud .no2 .id {
|
||||
width: 57%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
height: 0.4rem;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.37333rem;
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
transform: translateX(-62%);
|
||||
top: 3.4rem;
|
||||
}
|
||||
|
||||
.page1 .cloud .no2 .grade {
|
||||
width: 0.8rem;
|
||||
height: 0.53333rem;
|
||||
position: absolute;
|
||||
left: 1.17333rem;
|
||||
top: 3.86667rem;
|
||||
}
|
||||
|
||||
.page1 .cloud .no3 {
|
||||
width: 3.65333rem;
|
||||
height: 5.06667rem;
|
||||
position: absolute;
|
||||
top: 3.14667rem;
|
||||
right: 0rem;
|
||||
background: url(../images/top3.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.page1 .cloud .no3 .ts {
|
||||
width: 2.21333rem;
|
||||
height: 2.21333rem;
|
||||
position: absolute;
|
||||
right: 0.45333rem;
|
||||
top: 0.8rem;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.page1 .cloud .no3 .tx {
|
||||
width: 1.54667rem;
|
||||
height: 1.54667rem;
|
||||
position: absolute;
|
||||
right: 0.78667rem;
|
||||
top: 1.13333rem;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.page1 .cloud .no3 .name {
|
||||
width: 57%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
height: 0.4rem;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.37333rem;
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
transform: translateX(-37%);
|
||||
top: 3.1rem;
|
||||
}
|
||||
|
||||
.page1 .cloud .no3 .id {
|
||||
width: 57%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
height: 0.4rem;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.34667rem;
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
transform: translateX(-37%);
|
||||
top: 3.5rem;
|
||||
}
|
||||
|
||||
.page1 .cloud .no3 .grade {
|
||||
width: 0.8rem;
|
||||
height: 0.53333rem;
|
||||
position: absolute;
|
||||
right: 1.16rem;
|
||||
top: 3.86667rem;
|
||||
}
|
||||
|
||||
.page1 ul {
|
||||
width: 9.86667rem;
|
||||
margin: 0 auto 0.49333rem;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.page1 ul li {
|
||||
width: 100%;
|
||||
height: 2.50667rem;
|
||||
background: url(../images/liBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 0 0.96rem 0 0.89333rem;
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
|
||||
.page1 ul li .num {
|
||||
float: left;
|
||||
width: 0.66667rem;
|
||||
height: 100%;
|
||||
line-height: 2.50667rem;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.48rem;
|
||||
font-weight: 600;
|
||||
margin-right: 0.50667rem;
|
||||
}
|
||||
|
||||
.page1 ul li .tx {
|
||||
float: left;
|
||||
display: block;
|
||||
width: 1.24rem;
|
||||
height: 1.25333rem;
|
||||
border-radius: 50%;
|
||||
border: 0.01333rem solid #FFEDBA;
|
||||
box-sizing: border-box;
|
||||
margin-top: 0.62667rem;
|
||||
margin-right: 0.42667rem;
|
||||
}
|
||||
|
||||
.page1 ul li .user {
|
||||
float: left;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.37333rem;
|
||||
font-weight: 6.66667rem;
|
||||
}
|
||||
|
||||
.page1 ul li .user p {
|
||||
width: 3.28rem;
|
||||
margin-top: 0.7rem;
|
||||
margin-bottom: 0.26667rem;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.page1 ul li .user b {
|
||||
font-weight: 400;
|
||||
font-size: 0.34667rem;
|
||||
}
|
||||
|
||||
.page1 ul li .grade {
|
||||
display: block;
|
||||
float: right;
|
||||
width: 1.01333rem;
|
||||
height: 0.66667rem;
|
||||
margin-top: 0.93333rem;
|
||||
}
|
||||
|
||||
.page1 .rule {
|
||||
display: block;
|
||||
width: 9.33333rem;
|
||||
height: 20.08rem;
|
||||
margin: 0 auto 0.4rem;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.page1 .my {
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 0;
|
||||
width: 10rem;
|
||||
height: 2.50667rem;
|
||||
background: url(../images/myBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 0 0.96rem 0 0.89333rem;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.page1 .my .num {
|
||||
float: left;
|
||||
width: 0.66667rem;
|
||||
height: 100%;
|
||||
line-height: 2.50667rem;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.48rem;
|
||||
font-weight: 600;
|
||||
margin-right: 0.50667rem;
|
||||
}
|
||||
|
||||
.page1 .my .tx {
|
||||
float: left;
|
||||
display: block;
|
||||
width: 1.24rem;
|
||||
height: 1.25333rem;
|
||||
border-radius: 50%;
|
||||
border: 0.01333rem solid #FFEDBA;
|
||||
box-sizing: border-box;
|
||||
margin-top: 0.62667rem;
|
||||
margin-right: 0.42667rem;
|
||||
}
|
||||
|
||||
.page1 .my .user {
|
||||
float: left;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.37333rem;
|
||||
font-weight: 6.66667rem;
|
||||
}
|
||||
|
||||
.page1 .my .user p {
|
||||
width: 3.28rem;
|
||||
margin-top: 0.7rem;
|
||||
margin-bottom: 0.26667rem;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.page1 .my .user b {
|
||||
font-weight: 400;
|
||||
font-size: 0.34667rem;
|
||||
}
|
||||
|
||||
.page1 .my .grade {
|
||||
display: block;
|
||||
float: right;
|
||||
width: 1.01333rem;
|
||||
height: 0.66667rem;
|
||||
margin-top: 0.93333rem;
|
||||
}
|
||||
|
||||
.page2 {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.page2 .my {
|
||||
width: 10rem;
|
||||
height: 11.54667rem;
|
||||
background: url(../images/page2Bg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: -16.25rem auto 0;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
padding-top: 6.72rem;
|
||||
margin-bottom: 0.44rem;
|
||||
}
|
||||
|
||||
.page2 .my .ts {
|
||||
position: absolute;
|
||||
width: 3.6rem;
|
||||
height: 3.6rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 2.10667rem;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.page2 .my .tx {
|
||||
width: 2.53333rem;
|
||||
height: 2.53333rem;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
top: 2.65333rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.page2 .my .leve {
|
||||
width: 1.01333rem;
|
||||
height: 0.66667rem;
|
||||
position: absolute;
|
||||
top: 5.74667rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.page2 .my p {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.37333rem;
|
||||
font-weight: 500;
|
||||
margin-bottom: 0.26667rem;
|
||||
}
|
||||
|
||||
.page2 .rule {
|
||||
width: 9.33333rem;
|
||||
height: 17.77333rem;
|
||||
display: block;
|
||||
margin: 0 auto 0.50667rem;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.bootomText {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.37333rem;
|
||||
font-weight: 400;
|
||||
margin-bottom: 0.25333rem;
|
||||
}
|
||||
|
||||
.bootomTextPage1 {
|
||||
margin-bottom: 2.8rem;
|
||||
}
|
||||
|
||||
.english .header {
|
||||
background: url(../images/header-en.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.arabic .header {
|
||||
background: url(../images/header-ar.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.arabic .page1 .my .grade {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.arabic .page1 .my .num {
|
||||
float: right;
|
||||
margin-right: 0;
|
||||
margin-left: 0.50667rem;
|
||||
}
|
||||
|
||||
.arabic .page1 .my .tx {
|
||||
float: right;
|
||||
margin-left: 0.42667rem;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.arabic .page1 .my .user {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.arabic .page1 .rule {
|
||||
height: 18.97333rem;
|
||||
}
|
||||
|
||||
.arabic .page1 ul li .grade {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.arabic .page1 ul li .num {
|
||||
float: right;
|
||||
margin-right: 0;
|
||||
margin-left: 0.50667rem;
|
||||
}
|
||||
|
||||
.arabic .page1 ul li .tx {
|
||||
float: right;
|
||||
margin-left: 0.42667rem;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.arabic .page1 ul li .user {
|
||||
float: right;
|
||||
}
|
652
view/molistar/activity/ssGuild/css/index.scss
Normal file
@@ -0,0 +1,652 @@
|
||||
@function px2rem($px) {
|
||||
@return $px / 75+rem;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
background: #00121E;
|
||||
overflow-x: hidden;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
width: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.back {
|
||||
width: 100%;
|
||||
height: px2rem(44);
|
||||
line-height: px2rem(44);
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: px2rem(65);
|
||||
text-align: center;
|
||||
color: #FFFFFF;
|
||||
font-size: px2rem(38);
|
||||
font-weight: bold;
|
||||
z-index: 10;
|
||||
|
||||
img {
|
||||
width: px2rem(44);
|
||||
height: px2rem(44);
|
||||
position: absolute;
|
||||
left: px2rem(18);
|
||||
top: px2rem(0);
|
||||
}
|
||||
}
|
||||
|
||||
.header {
|
||||
width: px2rem(750);
|
||||
height: px2rem(2468);
|
||||
background: url(../images/header.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
margin: 0 auto px2rem(0);
|
||||
box-sizing: border-box;
|
||||
padding-top: px2rem(635);
|
||||
|
||||
.actTime {
|
||||
width: px2rem(530);
|
||||
height: px2rem(58);
|
||||
line-height: px2rem(58);
|
||||
text-align: center;
|
||||
color: #FFEDC1;
|
||||
font-size: px2rem(28);
|
||||
font-weight: 500;
|
||||
background: linear-gradient(0deg, #152738, #0F5881);
|
||||
border-radius: px2rem(58);
|
||||
border: px2rem(3) solid #FFDFB2;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: px2rem(391);
|
||||
}
|
||||
|
||||
.time {
|
||||
width: px2rem(570);
|
||||
height: px2rem(142);
|
||||
margin: 0 auto px2rem(47);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
div {
|
||||
width: px2rem(100);
|
||||
height: px2rem(142);
|
||||
background: url(../images/timeBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
b {
|
||||
display: inline-block;
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(44);
|
||||
font-weight: 600;
|
||||
margin-top: 0.36rem;
|
||||
margin-bottom: px2rem(38);
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
height: px2rem(35);
|
||||
}
|
||||
|
||||
span {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(28);
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
width: px2rem(696);
|
||||
height: px2rem(302);
|
||||
margin: 0 auto px2rem(27);
|
||||
background: url(../images/boxBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 0 px2rem(40);
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(26);
|
||||
font-weight: 400;
|
||||
line-height: px2rem(40);
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
/* 水平居中 */
|
||||
align-items: center;
|
||||
/* 垂直居中 */
|
||||
}
|
||||
|
||||
.tab {
|
||||
width: px2rem(670);
|
||||
height: px2rem(98);
|
||||
line-height: px2rem(98);
|
||||
text-align: center;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 0 auto px2rem(0);
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
|
||||
div {
|
||||
width: px2rem(318);
|
||||
height: px2rem(98);
|
||||
background: url(../images/tab.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #FFEFC3;
|
||||
font-size: px2rem(36);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.act {
|
||||
background: url(../images/tabAct.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.page1 {
|
||||
// display: none;
|
||||
|
||||
.cloud {
|
||||
width: px2rem(750);
|
||||
height: px2rem(830);
|
||||
background: url(../images/cloud.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: -17.3rem auto -2.6rem;
|
||||
position: relative;
|
||||
|
||||
.no1 {
|
||||
width: px2rem(375);
|
||||
height: px2rem(456);
|
||||
position: absolute;
|
||||
top: px2rem(113);
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background: url(../images/top1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
z-index: 2;
|
||||
|
||||
.ts {
|
||||
width: px2rem(200);
|
||||
height: px2rem(200);
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: px2rem(70);
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.tx {
|
||||
width: px2rem(140);
|
||||
height: px2rem(140);
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: px2rem(100);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.name {
|
||||
width: 57%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
height: px2rem(30);
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(28);
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: px2rem(270);
|
||||
}
|
||||
|
||||
.id {
|
||||
width: 57%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
height: px2rem(30);
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(28);
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: px2rem(302);
|
||||
}
|
||||
|
||||
.grade {
|
||||
width: px2rem(76);
|
||||
height: px2rem(50);
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: px2rem(337);
|
||||
}
|
||||
}
|
||||
|
||||
.no2 {
|
||||
width: px2rem(274);
|
||||
height: px2rem(380);
|
||||
position: absolute;
|
||||
top: px2rem(236);
|
||||
left: 0rem;
|
||||
background: url(../images/top2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
.ts {
|
||||
width: px2rem(166);
|
||||
height: px2rem(166);
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-62%);
|
||||
top: px2rem(60);
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.tx {
|
||||
width: px2rem(116);
|
||||
height: px2rem(116);
|
||||
position: absolute;
|
||||
left: px2rem(60);
|
||||
top: px2rem(85);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.name {
|
||||
width: 57%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
height: px2rem(30);
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(28);
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
transform: translateX(-62%);
|
||||
top: 3rem;
|
||||
}
|
||||
|
||||
.id {
|
||||
width: 57%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
height: px2rem(30);
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(28);
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
transform: translateX(-62%);
|
||||
top: 3.4rem;
|
||||
}
|
||||
|
||||
.grade {
|
||||
width: px2rem(60);
|
||||
height: px2rem(40);
|
||||
position: absolute;
|
||||
left: px2rem(88);
|
||||
top: px2rem(290);
|
||||
}
|
||||
}
|
||||
|
||||
.no3 {
|
||||
width: px2rem(274);
|
||||
height: px2rem(380);
|
||||
position: absolute;
|
||||
top: px2rem(236);
|
||||
right: 0rem;
|
||||
background: url(../images/top3.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
.ts {
|
||||
width: px2rem(166);
|
||||
height: px2rem(166);
|
||||
position: absolute;
|
||||
right: px2rem(34);
|
||||
top: px2rem(60);
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.tx {
|
||||
width: px2rem(116);
|
||||
height: px2rem(116);
|
||||
position: absolute;
|
||||
right: px2rem(59);
|
||||
top: px2rem(85);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.name {
|
||||
width: 57%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
height: px2rem(30);
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(28);
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
transform: translateX(-37%);
|
||||
top: 3.1rem;
|
||||
}
|
||||
|
||||
.id {
|
||||
width: 57%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
height: px2rem(30);
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(26);
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
transform: translateX(-37%);
|
||||
top: 3.5rem;
|
||||
}
|
||||
|
||||
.grade {
|
||||
width: px2rem(60);
|
||||
height: px2rem(40);
|
||||
position: absolute;
|
||||
right: px2rem(87);
|
||||
top: px2rem(290);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
width: px2rem(740);
|
||||
margin: 0 auto px2rem(37);
|
||||
position: relative;
|
||||
|
||||
li {
|
||||
width: 100%;
|
||||
height: px2rem(188);
|
||||
background: url(../images/liBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 0 px2rem(72) 0 px2rem(67);
|
||||
margin-bottom: px2rem(15);
|
||||
|
||||
.num {
|
||||
float: left;
|
||||
width: px2rem(50);
|
||||
height: 100%;
|
||||
line-height: px2rem(188);
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(36);
|
||||
font-weight: 600;
|
||||
margin-right: px2rem(38);
|
||||
}
|
||||
|
||||
.tx {
|
||||
float: left;
|
||||
display: block;
|
||||
width: px2rem(93);
|
||||
height: px2rem(94);
|
||||
border-radius: 50%;
|
||||
border: px2rem(1) solid #FFEDBA;
|
||||
box-sizing: border-box;
|
||||
margin-top: px2rem(47);
|
||||
margin-right: px2rem(32);
|
||||
}
|
||||
|
||||
.user {
|
||||
float: left;
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(28);
|
||||
font-weight: px2rem(500);
|
||||
|
||||
p {
|
||||
width: px2rem(246);
|
||||
margin-top: 0.7rem;
|
||||
margin-bottom: px2rem(20);
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
b {
|
||||
font-weight: 400;
|
||||
font-size: px2rem(26);
|
||||
}
|
||||
}
|
||||
|
||||
.grade {
|
||||
display: block;
|
||||
float: right;
|
||||
width: px2rem(76);
|
||||
height: px2rem(50);
|
||||
margin-top: px2rem(70);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.rule {
|
||||
display: block;
|
||||
width: px2rem(700);
|
||||
height: px2rem(1506);
|
||||
margin: 0 auto px2rem(30);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.my {
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 0;
|
||||
width: px2rem(750);
|
||||
height: px2rem(188);
|
||||
background: url(../images/myBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 0 px2rem(72) 0 px2rem(67);
|
||||
z-index: 9;
|
||||
|
||||
.num {
|
||||
float: left;
|
||||
width: px2rem(50);
|
||||
height: 100%;
|
||||
line-height: px2rem(188);
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(36);
|
||||
font-weight: 600;
|
||||
margin-right: px2rem(38);
|
||||
}
|
||||
|
||||
.tx {
|
||||
float: left;
|
||||
display: block;
|
||||
width: px2rem(93);
|
||||
height: px2rem(94);
|
||||
border-radius: 50%;
|
||||
border: px2rem(1) solid #FFEDBA;
|
||||
box-sizing: border-box;
|
||||
margin-top: px2rem(47);
|
||||
margin-right: px2rem(32);
|
||||
}
|
||||
|
||||
.user {
|
||||
float: left;
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(28);
|
||||
font-weight: px2rem(500);
|
||||
|
||||
p {
|
||||
width: px2rem(246);
|
||||
margin-top: 0.7rem;
|
||||
margin-bottom: px2rem(20);
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
b {
|
||||
font-weight: 400;
|
||||
font-size: px2rem(26);
|
||||
}
|
||||
}
|
||||
|
||||
.grade {
|
||||
display: block;
|
||||
float: right;
|
||||
width: px2rem(76);
|
||||
height: px2rem(50);
|
||||
margin-top: px2rem(70);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.page2 {
|
||||
display: none;
|
||||
|
||||
.my {
|
||||
width: px2rem(750);
|
||||
height: px2rem(866);
|
||||
background: url(../images/page2Bg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: -16.25rem auto 0;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
padding-top: px2rem(504);
|
||||
margin-bottom: px2rem(33);
|
||||
|
||||
.ts {
|
||||
position: absolute;
|
||||
width: px2rem(270);
|
||||
height: px2rem(270);
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: px2rem(158);
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.tx {
|
||||
width: px2rem(190);
|
||||
height: px2rem(190);
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
top: px2rem(199);
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
|
||||
}
|
||||
|
||||
.leve {
|
||||
width: px2rem(76);
|
||||
height: px2rem(50);
|
||||
position: absolute;
|
||||
top: px2rem(431);
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
p {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(28);
|
||||
font-weight: 500;
|
||||
margin-bottom: px2rem(20);
|
||||
}
|
||||
}
|
||||
|
||||
.rule {
|
||||
width: px2rem(700);
|
||||
height: px2rem(1333);
|
||||
display: block;
|
||||
margin: 0 auto px2rem(38);
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
|
||||
.bootomText {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(28);
|
||||
font-weight: 400;
|
||||
margin-bottom: px2rem(19);
|
||||
}
|
||||
|
||||
.bootomTextPage1 {
|
||||
margin-bottom: px2rem(210);
|
||||
}
|
||||
|
||||
.english {
|
||||
.header {
|
||||
background: url(../images/header-en.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.arabic {
|
||||
.header {
|
||||
background: url(../images/header-ar.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.page1 .my {
|
||||
.grade {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.num {
|
||||
float: right;
|
||||
margin-right: 0;
|
||||
margin-left: 0.50667rem;
|
||||
}
|
||||
|
||||
.tx {
|
||||
float: right;
|
||||
margin-left: 0.42667rem;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.user {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
.page1 .rule {
|
||||
height: px2rem(1423);
|
||||
}
|
||||
|
||||
.page1 ul li {
|
||||
.grade {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.num {
|
||||
float: right;
|
||||
margin-right: 0;
|
||||
margin-left: 0.50667rem;
|
||||
}
|
||||
|
||||
.tx {
|
||||
float: right;
|
||||
margin-left: 0.42667rem;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.user {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
}
|
BIN
view/molistar/activity/ssGuild/images/A.png
Normal file
After Width: | Height: | Size: 2.1 KiB |
BIN
view/molistar/activity/ssGuild/images/B.png
Normal file
After Width: | Height: | Size: 2.2 KiB |
BIN
view/molistar/activity/ssGuild/images/S.png
Normal file
After Width: | Height: | Size: 2.1 KiB |
BIN
view/molistar/activity/ssGuild/images/SS.png
Normal file
After Width: | Height: | Size: 2.1 KiB |
BIN
view/molistar/activity/ssGuild/images/boxBg.png
Normal file
After Width: | Height: | Size: 5.8 KiB |
BIN
view/molistar/activity/ssGuild/images/cloud.png
Normal file
After Width: | Height: | Size: 122 KiB |
BIN
view/molistar/activity/ssGuild/images/header-ar.png
Normal file
After Width: | Height: | Size: 549 KiB |
BIN
view/molistar/activity/ssGuild/images/header-en.png
Normal file
After Width: | Height: | Size: 554 KiB |
BIN
view/molistar/activity/ssGuild/images/header.png
Normal file
After Width: | Height: | Size: 554 KiB |
BIN
view/molistar/activity/ssGuild/images/liBg.png
Normal file
After Width: | Height: | Size: 47 KiB |
BIN
view/molistar/activity/ssGuild/images/myBg.png
Normal file
After Width: | Height: | Size: 47 KiB |
BIN
view/molistar/activity/ssGuild/images/null.png
Normal file
After Width: | Height: | Size: 4.0 KiB |
BIN
view/molistar/activity/ssGuild/images/page1Rule-ar.png
Normal file
After Width: | Height: | Size: 113 KiB |
BIN
view/molistar/activity/ssGuild/images/page1Rule-en.png
Normal file
After Width: | Height: | Size: 119 KiB |
BIN
view/molistar/activity/ssGuild/images/page1Rule.png
Normal file
After Width: | Height: | Size: 119 KiB |
BIN
view/molistar/activity/ssGuild/images/page2Bg.png
Normal file
After Width: | Height: | Size: 244 KiB |
BIN
view/molistar/activity/ssGuild/images/page2Rule-ar.png
Normal file
After Width: | Height: | Size: 64 KiB |
BIN
view/molistar/activity/ssGuild/images/page2Rule-en.png
Normal file
After Width: | Height: | Size: 70 KiB |
BIN
view/molistar/activity/ssGuild/images/page2Rule.png
Normal file
After Width: | Height: | Size: 70 KiB |
BIN
view/molistar/activity/ssGuild/images/page2Ts.png
Normal file
After Width: | Height: | Size: 20 KiB |
BIN
view/molistar/activity/ssGuild/images/tab.png
Normal file
After Width: | Height: | Size: 7.3 KiB |
BIN
view/molistar/activity/ssGuild/images/tabAct.png
Normal file
After Width: | Height: | Size: 5.9 KiB |
BIN
view/molistar/activity/ssGuild/images/timeBg.png
Normal file
After Width: | Height: | Size: 5.7 KiB |
BIN
view/molistar/activity/ssGuild/images/top1.png
Normal file
After Width: | Height: | Size: 34 KiB |
BIN
view/molistar/activity/ssGuild/images/top2.png
Normal file
After Width: | Height: | Size: 93 KiB |
BIN
view/molistar/activity/ssGuild/images/top23.png
Normal file
After Width: | Height: | Size: 26 KiB |