Compare commits
52 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
ae4a154f4e | ||
|
|
4f57268711 | ||
|
|
9bc282355a | ||
|
|
a6e07a0a53 | ||
|
|
fac5382c94 | ||
|
|
8a97e3d012 | ||
|
|
b69489915e | ||
|
|
46646a9844 | ||
|
|
1ee16e30b0 | ||
|
|
38f366eb12 | ||
|
|
a60957801b | ||
|
|
fdc4751729 | ||
|
|
d6b132560e | ||
|
|
ea65228196 | ||
|
|
4c27cb0d56 | ||
|
|
2765e7a492 | ||
|
|
2b36a988b5 | ||
|
|
331aaff831 | ||
|
|
a7572f697d | ||
|
|
a98c5c7a78 | ||
|
|
2939bd9c60 | ||
|
|
bce4feb0a1 | ||
|
|
21d7a4c75b | ||
|
|
6a2b7760b4 | ||
|
|
7ec576e15e | ||
|
|
a75ffcabb0 | ||
|
|
3aad1aae7d | ||
|
|
03f290f314 | ||
|
|
c748d67e8d | ||
|
|
174e6ba807 | ||
|
|
2c7123bae3 | ||
|
|
008517d6bd | ||
|
|
9aa85b8e8d | ||
|
|
562c1fa400 | ||
|
|
ad87ab144a | ||
|
|
6e3bcd5f06 | ||
|
|
71f3893016 | ||
|
|
c126d1e86d | ||
|
|
fbf475ffe5 | ||
|
|
bb090e29a8 | ||
|
|
3ea9b0b772 | ||
|
|
3984328459 | ||
|
|
da180fef1c | ||
|
|
c8d5a7d4fa | ||
|
|
3b3dbe45b0 | ||
|
|
9c34a21367 | ||
|
|
8aefbf5751 | ||
|
|
ce3045af25 | ||
|
|
d0439a6946 | ||
|
|
09070b47aa | ||
|
|
c624fe12f2 | ||
|
|
158bf0f53d |
731
view/molistar/activity/2024-cityLove/css/index.css
Normal file
731
view/molistar/activity/2024-cityLove/css/index.css
Normal file
@@ -0,0 +1,731 @@
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
background: #F9E4D6;
|
||||
}
|
||||
|
||||
.rabbit {
|
||||
z-index: 999;
|
||||
width: 0.8rem;
|
||||
height: 0.8rem;
|
||||
}
|
||||
|
||||
.back {
|
||||
position: fixed;
|
||||
top: 0.93333rem;
|
||||
left: 0.45333rem;
|
||||
z-index: 99;
|
||||
width: 0.82667rem;
|
||||
height: 0.82667rem;
|
||||
}
|
||||
|
||||
.back img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.back p {
|
||||
color: #fff;
|
||||
font-size: 0.42667rem;
|
||||
position: absolute;
|
||||
width: 9rem;
|
||||
left: 0;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
line-height: 0.82667rem;
|
||||
}
|
||||
|
||||
.header {
|
||||
width: 10rem;
|
||||
height: 11.6rem;
|
||||
background: url(../images/header.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
margin: 0 auto 0rem;
|
||||
}
|
||||
|
||||
.header .rule_icon {
|
||||
position: absolute;
|
||||
width: 1.76rem;
|
||||
height: 0.97333rem;
|
||||
right: 0;
|
||||
top: 4.6rem;
|
||||
}
|
||||
|
||||
.header .tab {
|
||||
width: 7.89333rem;
|
||||
height: 1.36rem;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 7.64rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.header .tab div {
|
||||
width: 3.46667rem;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.header .tab .tab1 {
|
||||
background: url(../images/tab1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.header .tab .tab2 {
|
||||
background: url(../images/tab2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.header .tab .act1 {
|
||||
background: url(../images/tabAct1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.header .tab .act2 {
|
||||
background: url(../images/tabAct2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.page1 .page1Box1 {
|
||||
width: 10rem;
|
||||
height: 9.74667rem;
|
||||
display: block;
|
||||
margin: -2.6rem auto 0rem;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.page1 .page1Box2 {
|
||||
width: 10rem;
|
||||
height: 12.44rem;
|
||||
display: block;
|
||||
margin: -1.1rem auto 0rem;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.page1 .page1Box3 {
|
||||
width: 10rem;
|
||||
height: 12.28rem;
|
||||
display: block;
|
||||
margin: -1.1rem auto 0rem;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.page1 .page1Box4 {
|
||||
width: 10rem;
|
||||
height: 15rem;
|
||||
margin: -1.1rem auto 0rem;
|
||||
position: relative;
|
||||
background: url(../images/page1Box4.png) no-repeat 100% 100%;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.page1 .page1Box4 .left {
|
||||
width: 3.48rem;
|
||||
height: 0.84rem;
|
||||
line-height: 0.81333rem;
|
||||
background: url(../images/page1Box4_left.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #FF5B8D;
|
||||
font-size: 0.28rem;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 2.69333rem;
|
||||
text-indent: 2.55rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.page1 .page1Box4 .right {
|
||||
width: 3.48rem;
|
||||
height: 0.84rem;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 2.69333rem;
|
||||
}
|
||||
|
||||
.page1 .page1Box4 .dayLimit {
|
||||
width: 0.76rem;
|
||||
height: 0.36rem;
|
||||
line-height: 0.36rem;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-size: 0.16rem;
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
top: 4.10667rem;
|
||||
background: url(../images/dayLimit.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
text-indent: 0.05rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.page1 .page1Box4 .dayLimit1 {
|
||||
left: 2.81333rem;
|
||||
}
|
||||
|
||||
.page1 .page1Box4 .dayLimit2 {
|
||||
left: 5.49333rem;
|
||||
}
|
||||
|
||||
.page1 .page1Box4 .dayLimit3 {
|
||||
left: 8.22667rem;
|
||||
}
|
||||
|
||||
.page1 .page1Box4 .convert {
|
||||
width: 1.73333rem;
|
||||
height: 0.61333rem;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.page1 .page1Box4 .convert1 {
|
||||
left: 1.37333rem;
|
||||
top: 6.33333rem;
|
||||
}
|
||||
|
||||
.page1 .page1Box4 .convert2 {
|
||||
left: 4.04rem;
|
||||
top: 6.33333rem;
|
||||
}
|
||||
|
||||
.page1 .page1Box4 .convert3 {
|
||||
left: 6.8rem;
|
||||
top: 6.33333rem;
|
||||
}
|
||||
|
||||
.page1 .page1Box4 .convert4 {
|
||||
left: 1.37333rem;
|
||||
top: 9.45333rem;
|
||||
}
|
||||
|
||||
.page1 .page1Box4 .convert5 {
|
||||
left: 4.04rem;
|
||||
top: 9.45333rem;
|
||||
}
|
||||
|
||||
.page1 .page1Box4 .convert6 {
|
||||
left: 6.8rem;
|
||||
top: 9.45333rem;
|
||||
}
|
||||
|
||||
.page1 .page1Box4 .convert7 {
|
||||
left: 2.8rem;
|
||||
top: 12.65333rem;
|
||||
}
|
||||
|
||||
.page1 .page1Box4 .convert8 {
|
||||
left: 5.45333rem;
|
||||
top: 12.65333rem;
|
||||
}
|
||||
|
||||
.page2 {
|
||||
display: none;
|
||||
width: 10rem;
|
||||
height: 20.56rem;
|
||||
background: url(../images/page2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
margin: -2.6rem auto 1.33333rem;
|
||||
}
|
||||
|
||||
.page2 .first .left_ts {
|
||||
width: 2.16rem;
|
||||
height: 2.13333rem;
|
||||
position: absolute;
|
||||
left: 2.16rem;
|
||||
top: 2.68rem;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.page2 .first .right_ts {
|
||||
width: 2.16rem;
|
||||
height: 2.13333rem;
|
||||
position: absolute;
|
||||
right: 2.16rem;
|
||||
top: 2.68rem;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.page2 .first .left_tx {
|
||||
width: 1.76rem;
|
||||
height: 1.76rem;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
left: 2.33333rem;
|
||||
top: 2.89333rem;
|
||||
}
|
||||
|
||||
.page2 .first .right_tx {
|
||||
width: 1.76rem;
|
||||
height: 1.76rem;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
right: 2.33333rem;
|
||||
top: 2.89333rem;
|
||||
}
|
||||
|
||||
.page2 .first .score {
|
||||
width: 1.5rem;
|
||||
text-align: center;
|
||||
-webkit-text-stroke: 0.01333rem #FE5A9F;
|
||||
/* Safari */
|
||||
font-size: 0.28rem;
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 3.82667rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.page2 .first .leftNick {
|
||||
width: 2.16rem;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
position: absolute;
|
||||
left: 2.24rem;
|
||||
top: 5rem;
|
||||
color: #B8004E;
|
||||
font-weight: bold;
|
||||
font-size: 0.28rem;
|
||||
}
|
||||
|
||||
.page2 .first .rightNick {
|
||||
width: 2.16rem;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
position: absolute;
|
||||
right: 2.24rem;
|
||||
top: 5rem;
|
||||
color: #B8004E;
|
||||
font-weight: bold;
|
||||
font-size: 0.28rem;
|
||||
}
|
||||
|
||||
.page2 .notFirst {
|
||||
width: 8.88rem;
|
||||
height: 12rem;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 7.13333rem;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.page2 .notFirst::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.page2 .notFirst li {
|
||||
width: 8.88rem;
|
||||
height: 1.82667rem;
|
||||
background: url(../images/listBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.page2 .notFirst li .num {
|
||||
width: 0.66667rem;
|
||||
height: 100%;
|
||||
line-height: 1.82667rem;
|
||||
text-align: center;
|
||||
color: #B16B74;
|
||||
font-size: 0.30667rem;
|
||||
font-weight: 500;
|
||||
float: left;
|
||||
margin-left: 0.52rem;
|
||||
margin-right: 0.2rem;
|
||||
}
|
||||
|
||||
.page2 .notFirst li .left_tx {
|
||||
width: 1.09333rem;
|
||||
height: 1.09333rem;
|
||||
border-radius: 1.09333rem;
|
||||
float: left;
|
||||
margin-top: 0.38667rem;
|
||||
border: 0.02667rem solid #FFABC7;
|
||||
margin-right: 0.18667rem;
|
||||
}
|
||||
|
||||
.page2 .notFirst li .right_tx {
|
||||
width: 1.09333rem;
|
||||
height: 1.09333rem;
|
||||
border-radius: 1.09333rem;
|
||||
float: left;
|
||||
margin-top: 0.38667rem;
|
||||
border: 0.02667rem solid #FFABC7;
|
||||
}
|
||||
|
||||
.page2 .notFirst li .love {
|
||||
width: 1.02667rem;
|
||||
height: 0.90667rem;
|
||||
position: absolute;
|
||||
left: 2.10667rem;
|
||||
top: 0.50667rem;
|
||||
}
|
||||
|
||||
.page2 .notFirst li .nickLeft {
|
||||
width: 2.2rem;
|
||||
color: #FF658E;
|
||||
font-size: 0.28rem;
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
left: 4rem;
|
||||
top: 0.58667rem;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.page2 .notFirst li .nickRight {
|
||||
width: 2.2rem;
|
||||
color: #FF658E;
|
||||
font-size: 0.28rem;
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
left: 4rem;
|
||||
top: 0.98667rem;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.page2 .notFirst li .score {
|
||||
float: right;
|
||||
height: 100%;
|
||||
line-height: 1.82667rem;
|
||||
color: #FE5F93;
|
||||
font-size: 0.32rem;
|
||||
margin-right: 1rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.page2 .my {
|
||||
width: 10rem;
|
||||
height: 3.16rem;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
background: url(../images/my.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
background: url(../images/my2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
transition: all .3s;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.page2 .my .more {
|
||||
width: 1.24rem;
|
||||
height: 1.24rem;
|
||||
position: absolute;
|
||||
right: 0.09333rem;
|
||||
top: -0.41333rem;
|
||||
}
|
||||
|
||||
.page2 .my ul {
|
||||
width: 8.88rem;
|
||||
height: 1.82667rem;
|
||||
margin: 1.10667rem auto 0;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.page2 .my ul::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.page2 .my ul li {
|
||||
width: 100%;
|
||||
height: 1.82667rem;
|
||||
background: url(../images/myList.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
margin-bottom: 0.10667rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.page2 .my ul li .num {
|
||||
width: 0.66667rem;
|
||||
height: 100%;
|
||||
line-height: 1.82667rem;
|
||||
text-align: center;
|
||||
color: #B16B74;
|
||||
font-size: 0.30667rem;
|
||||
font-weight: 500;
|
||||
float: left;
|
||||
margin-left: 0.52rem;
|
||||
margin-right: 0.2rem;
|
||||
}
|
||||
|
||||
.page2 .my ul li .left_tx {
|
||||
width: 1.09333rem;
|
||||
height: 1.09333rem;
|
||||
border-radius: 1.09333rem;
|
||||
float: left;
|
||||
margin-top: 0.38667rem;
|
||||
border: 0.02667rem solid #FFABC7;
|
||||
margin-right: 0.18667rem;
|
||||
}
|
||||
|
||||
.page2 .my ul li .right_tx {
|
||||
width: 1.09333rem;
|
||||
height: 1.09333rem;
|
||||
border-radius: 1.09333rem;
|
||||
float: left;
|
||||
margin-top: 0.38667rem;
|
||||
border: 0.02667rem solid #FFABC7;
|
||||
}
|
||||
|
||||
.page2 .my ul li .love {
|
||||
width: 1.02667rem;
|
||||
height: 0.90667rem;
|
||||
position: absolute;
|
||||
left: 2.10667rem;
|
||||
top: 0.50667rem;
|
||||
}
|
||||
|
||||
.page2 .my ul li .nickLeft {
|
||||
width: 2.2rem;
|
||||
color: #FF658E;
|
||||
font-size: 0.28rem;
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
left: 4rem;
|
||||
top: 0.58667rem;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.page2 .my ul li .nickRight {
|
||||
width: 2.2rem;
|
||||
color: #FF658E;
|
||||
font-size: 0.28rem;
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
left: 4rem;
|
||||
top: 0.98667rem;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.page2 .my ul li .score {
|
||||
float: right;
|
||||
height: 100%;
|
||||
line-height: 1.82667rem;
|
||||
color: #FE5F93;
|
||||
font-size: 0.32rem;
|
||||
margin-right: 1rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.page2 .my ul .null {
|
||||
background: none;
|
||||
text-align: center;
|
||||
line-height: 1.82667rem;
|
||||
color: #FF658E;
|
||||
font-size: 0.4rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.rule {
|
||||
position: fixed;
|
||||
z-index: 99;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background: rgba(0, 0, 0, 0.6);
|
||||
display: none;
|
||||
}
|
||||
|
||||
.rule .rule_in {
|
||||
width: 9.10667rem;
|
||||
height: 13.18667rem;
|
||||
background: url(../images/ruleBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.rule .rule_in .tab {
|
||||
width: 6.64rem;
|
||||
height: 1.22667rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 2.4rem auto 0.25333rem;
|
||||
}
|
||||
|
||||
.rule .rule_in .tab div {
|
||||
width: 3.13333rem;
|
||||
height: 1.22667rem;
|
||||
}
|
||||
|
||||
.rule .rule_in .tab .tab1 {
|
||||
background: url(../images/ruleTab1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.rule .rule_in .tab .tab2 {
|
||||
background: url(../images/ruleTab2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.rule .rule_in .tab .act1 {
|
||||
background: url(../images/ruleTabAct1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.rule .rule_in .tab .act2 {
|
||||
background: url(../images/ruleTabAct2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.rule .rule_in .box {
|
||||
width: 7.81333rem;
|
||||
height: 8.5rem;
|
||||
margin: 0 auto 0;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.rule .rule_in .box::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.rule .rule_in .box img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.rule .rule_in .box .img2 {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.rule .rule_in .box2 {
|
||||
width: 8.29333rem;
|
||||
}
|
||||
|
||||
.end {
|
||||
position: fixed;
|
||||
z-index: 99;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background: rgba(0, 0, 0, 0.6);
|
||||
display: none;
|
||||
}
|
||||
|
||||
.end .end_in {
|
||||
width: 7rem;
|
||||
height: 5.48rem;
|
||||
background: url(../images/endBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.end .but {
|
||||
width: 3.14667rem;
|
||||
height: 1.22667rem;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 0.81333rem;
|
||||
}
|
||||
|
||||
.records {
|
||||
position: fixed;
|
||||
z-index: 99;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background: rgba(0, 0, 0, 0.6);
|
||||
display: none;
|
||||
}
|
||||
|
||||
.records .records_in {
|
||||
width: 9.61333rem;
|
||||
height: 8.48rem;
|
||||
background: url(../images/recordsBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.records .records_in .title {
|
||||
width: 5.4rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
color: #8956AA;
|
||||
font-weight: 500;
|
||||
font-size: 0.36rem;
|
||||
margin: 2.49333rem auto 0.48rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.records .records_in .title div {
|
||||
width: 2.7rem;
|
||||
}
|
||||
|
||||
.records .records_in ul {
|
||||
width: 5.4rem;
|
||||
height: 3.4rem;
|
||||
margin: 0 auto;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.records .records_in ul::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.records .records_in ul li {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
text-align: right;
|
||||
margin-bottom: 0.28rem;
|
||||
}
|
||||
|
||||
.records .records_in ul li div {
|
||||
width: 2.7rem;
|
||||
box-sizing: border-box;
|
||||
padding-right: 0.64rem;
|
||||
color: #8956AA;
|
||||
font-size: 0.26667rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.records .records_in ul li div p {
|
||||
margin-bottom: 0.06667rem;
|
||||
}
|
||||
|
||||
.records .records_in ul li div b {
|
||||
font-size: 0.21333rem;
|
||||
}
|
||||
|
||||
.records .records_in ul li .div2 {
|
||||
text-align: center;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.records .records_in ul .null .nulls {
|
||||
text-align: center;
|
||||
text-indent: 0.6rem;
|
||||
}
|
||||
745
view/molistar/activity/2024-cityLove/css/index.scss
Normal file
745
view/molistar/activity/2024-cityLove/css/index.scss
Normal file
@@ -0,0 +1,745 @@
|
||||
@function px2rem($px) {
|
||||
@return $px / 75+rem;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
background: #F9E4D6;
|
||||
}
|
||||
|
||||
.rabbit {
|
||||
z-index: 999;
|
||||
width: px2rem(60);
|
||||
height: px2rem(60);
|
||||
}
|
||||
|
||||
// 返回按钮
|
||||
.back {
|
||||
position: fixed;
|
||||
top: px2rem(70);
|
||||
left: px2rem(34);
|
||||
z-index: 99;
|
||||
width: px2rem(62);
|
||||
height: px2rem(62);
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
p {
|
||||
color: #fff;
|
||||
font-size: px2rem(32);
|
||||
position: absolute;
|
||||
width: 9rem;
|
||||
left: 0;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
line-height: px2rem(62);
|
||||
}
|
||||
}
|
||||
|
||||
.header {
|
||||
width: px2rem(750);
|
||||
height: px2rem(870);
|
||||
background: url(../images/header.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
margin: 0 auto px2rem(0);
|
||||
|
||||
.rule_icon {
|
||||
position: absolute;
|
||||
width: px2rem(132);
|
||||
height: px2rem(73);
|
||||
right: 0;
|
||||
top: 4.6rem;
|
||||
}
|
||||
|
||||
.tab {
|
||||
width: px2rem(592);
|
||||
height: px2rem(102);
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: px2rem(573);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
div {
|
||||
width: px2rem(260);
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.tab1 {
|
||||
background: url(../images/tab1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.tab2 {
|
||||
background: url(../images/tab2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.act1 {
|
||||
background: url(../images/tabAct1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.act2 {
|
||||
background: url(../images/tabAct2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.page1 {
|
||||
// display: none;
|
||||
|
||||
.page1Box1 {
|
||||
width: px2rem(750);
|
||||
height: px2rem(731);
|
||||
display: block;
|
||||
margin: -2.6rem auto 0rem;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.page1Box2 {
|
||||
width: px2rem(750);
|
||||
height: px2rem(933);
|
||||
display: block;
|
||||
margin: -1.1rem auto 0rem;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.page1Box3 {
|
||||
width: px2rem(750);
|
||||
height: px2rem(921);
|
||||
display: block;
|
||||
margin: -1.1rem auto 0rem;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.page1Box4 {
|
||||
width: px2rem(750);
|
||||
height: px2rem(1125);
|
||||
margin: -1.1rem auto 0rem;
|
||||
position: relative;
|
||||
background: url(../images/page1Box4.png) no-repeat 100% 100%;
|
||||
background-size: 100% 100%;
|
||||
|
||||
.left {
|
||||
width: px2rem(261);
|
||||
height: px2rem(63);
|
||||
line-height: px2rem(61);
|
||||
background: url(../images/page1Box4_left.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #FF5B8D;
|
||||
font-size: px2rem(21);
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: px2rem(202);
|
||||
text-indent: 2.55rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.right {
|
||||
width: px2rem(261);
|
||||
height: px2rem(63);
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: px2rem(202);
|
||||
}
|
||||
|
||||
.dayLimit {
|
||||
width: px2rem(57);
|
||||
height: px2rem(27);
|
||||
line-height: px2rem(27);
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-size: px2rem(12);
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
top: px2rem(308);
|
||||
background: url(../images/dayLimit.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
text-indent: 0.05rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.dayLimit1 {
|
||||
left: px2rem(211);
|
||||
}
|
||||
|
||||
.dayLimit2 {
|
||||
left: px2rem(412);
|
||||
}
|
||||
|
||||
.dayLimit3 {
|
||||
left: px2rem(617);
|
||||
}
|
||||
|
||||
.convert {
|
||||
width: px2rem(130);
|
||||
height: px2rem(46);
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.convert1 {
|
||||
left: px2rem(103);
|
||||
top: px2rem(475);
|
||||
}
|
||||
|
||||
.convert2 {
|
||||
left: px2rem(303);
|
||||
top: px2rem(475);
|
||||
}
|
||||
|
||||
.convert3 {
|
||||
left: px2rem(510);
|
||||
top: px2rem(475);
|
||||
}
|
||||
|
||||
.convert4 {
|
||||
left: px2rem(103);
|
||||
top: px2rem(709);
|
||||
}
|
||||
|
||||
.convert5 {
|
||||
left: px2rem(303);
|
||||
top: px2rem(709);
|
||||
}
|
||||
|
||||
.convert6 {
|
||||
left: px2rem(510);
|
||||
top: px2rem(709);
|
||||
}
|
||||
|
||||
.convert7 {
|
||||
left: px2rem(210);
|
||||
top: px2rem(949);
|
||||
}
|
||||
|
||||
.convert8 {
|
||||
left: px2rem(409);
|
||||
top: px2rem(949);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.page2 {
|
||||
display: none;
|
||||
width: px2rem(750);
|
||||
height: px2rem(1542);
|
||||
background: url(../images/page2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
margin: -2.6rem auto px2rem(100);
|
||||
|
||||
.first {
|
||||
.left_ts {
|
||||
width: px2rem(162);
|
||||
height: px2rem(160);
|
||||
position: absolute;
|
||||
left: px2rem(162);
|
||||
top: px2rem(201);
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.right_ts {
|
||||
width: px2rem(162);
|
||||
height: px2rem(160);
|
||||
position: absolute;
|
||||
right: px2rem(162);
|
||||
top: px2rem(201);
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.left_tx {
|
||||
width: px2rem(132);
|
||||
height: px2rem(132);
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
left: px2rem(175);
|
||||
top: px2rem(217);
|
||||
}
|
||||
|
||||
.right_tx {
|
||||
width: px2rem(132);
|
||||
height: px2rem(132);
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
right: px2rem(175);
|
||||
top: px2rem(217);
|
||||
}
|
||||
|
||||
.score {
|
||||
width: 1.5rem;
|
||||
text-align: center;
|
||||
-webkit-text-stroke: px2rem(1) #FE5A9F;
|
||||
/* Safari */
|
||||
font-size: px2rem(21);
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 3.82667rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.leftNick {
|
||||
width: px2rem(162);
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
position: absolute;
|
||||
left: px2rem(168);
|
||||
top: px2rem(375);
|
||||
color: #B8004E;
|
||||
font-weight: bold;
|
||||
font-size: px2rem(21);
|
||||
}
|
||||
|
||||
.rightNick {
|
||||
width: px2rem(162);
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
position: absolute;
|
||||
right: px2rem(168);
|
||||
top: px2rem(375);
|
||||
color: #B8004E;
|
||||
font-weight: bold;
|
||||
font-size: px2rem(21);
|
||||
}
|
||||
}
|
||||
|
||||
.notFirst {
|
||||
width: px2rem(666);
|
||||
height: 12rem;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: px2rem(535);
|
||||
overflow-y: scroll;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
li {
|
||||
width: px2rem(666);
|
||||
height: px2rem(137);
|
||||
background: url(../images/listBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
|
||||
.num {
|
||||
width: px2rem(50);
|
||||
height: 100%;
|
||||
line-height: px2rem(137);
|
||||
text-align: center;
|
||||
color: #B16B74;
|
||||
font-size: px2rem(23);
|
||||
font-weight: 500;
|
||||
float: left;
|
||||
margin-left: 0.52rem;
|
||||
margin-right: px2rem(15);
|
||||
}
|
||||
|
||||
.left_tx {
|
||||
width: px2rem(82);
|
||||
height: px2rem(82);
|
||||
border-radius: px2rem(82);
|
||||
float: left;
|
||||
margin-top: px2rem(29);
|
||||
border: px2rem(2) solid #FFABC7;
|
||||
margin-right: px2rem(14);
|
||||
}
|
||||
|
||||
.right_tx {
|
||||
width: px2rem(82);
|
||||
height: px2rem(82);
|
||||
border-radius: px2rem(82);
|
||||
float: left;
|
||||
margin-top: px2rem(29);
|
||||
border: px2rem(2) solid #FFABC7;
|
||||
}
|
||||
|
||||
.love {
|
||||
width: px2rem(77);
|
||||
height: px2rem(68);
|
||||
position: absolute;
|
||||
left: px2rem(158);
|
||||
top: px2rem(38);
|
||||
}
|
||||
|
||||
.nickLeft {
|
||||
width: 2.2rem;
|
||||
color: #FF658E;
|
||||
font-size: px2rem(21);
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
left: px2rem(300);
|
||||
top: px2rem(44);
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.nickRight {
|
||||
width: 2.2rem;
|
||||
color: #FF658E;
|
||||
font-size: px2rem(21);
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
left: px2rem(300);
|
||||
top: px2rem(74);
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.score {
|
||||
float: right;
|
||||
height: 100%;
|
||||
line-height: px2rem(137);
|
||||
color: #FE5F93;
|
||||
font-size: px2rem(24);
|
||||
margin-right: px2rem(75);
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.my {
|
||||
width: px2rem(750);
|
||||
height: 3.16rem;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
background: url(../images/my.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
background: url(../images/my2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
transition: all .3s;
|
||||
z-index: 3;
|
||||
|
||||
.more {
|
||||
width: px2rem(93);
|
||||
height: px2rem(93);
|
||||
position: absolute;
|
||||
right: px2rem(7);
|
||||
top: px2rem(-31);
|
||||
}
|
||||
|
||||
ul {
|
||||
width: 8.88rem;
|
||||
height: 1.82667rem;
|
||||
margin: 1.10667rem auto 0;
|
||||
overflow-y: hidden;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
li {
|
||||
width: 100%;
|
||||
height: px2rem(137);
|
||||
background: url(../images/myList.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
margin-bottom: px2rem(8);
|
||||
overflow: hidden;
|
||||
|
||||
.num {
|
||||
width: px2rem(50);
|
||||
height: 100%;
|
||||
line-height: px2rem(137);
|
||||
text-align: center;
|
||||
color: #B16B74;
|
||||
font-size: px2rem(23);
|
||||
font-weight: 500;
|
||||
float: left;
|
||||
margin-left: 0.52rem;
|
||||
margin-right: px2rem(15);
|
||||
}
|
||||
|
||||
.left_tx {
|
||||
width: px2rem(82);
|
||||
height: px2rem(82);
|
||||
border-radius: px2rem(82);
|
||||
float: left;
|
||||
margin-top: px2rem(29);
|
||||
border: px2rem(2) solid #FFABC7;
|
||||
margin-right: px2rem(14);
|
||||
}
|
||||
|
||||
.right_tx {
|
||||
width: px2rem(82);
|
||||
height: px2rem(82);
|
||||
border-radius: px2rem(82);
|
||||
float: left;
|
||||
margin-top: px2rem(29);
|
||||
border: px2rem(2) solid #FFABC7;
|
||||
}
|
||||
|
||||
.love {
|
||||
width: px2rem(77);
|
||||
height: px2rem(68);
|
||||
position: absolute;
|
||||
left: px2rem(158);
|
||||
top: px2rem(38);
|
||||
}
|
||||
|
||||
.nickLeft {
|
||||
width: 2.2rem;
|
||||
color: #FF658E;
|
||||
font-size: px2rem(21);
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
left: px2rem(300);
|
||||
top: px2rem(44);
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.nickRight {
|
||||
width: 2.2rem;
|
||||
color: #FF658E;
|
||||
font-size: px2rem(21);
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
left: px2rem(300);
|
||||
top: px2rem(74);
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.score {
|
||||
float: right;
|
||||
height: 100%;
|
||||
line-height: px2rem(137);
|
||||
color: #FE5F93;
|
||||
font-size: px2rem(24);
|
||||
margin-right: px2rem(75);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.null {
|
||||
background: none;
|
||||
text-align: center;
|
||||
line-height: px2rem(137);
|
||||
color: #FF658E;
|
||||
font-size: px2rem(30);
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.rule {
|
||||
position: fixed;
|
||||
z-index: 99;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background: rgba(0, 0, 0, .6);
|
||||
display: none;
|
||||
|
||||
.rule_in {
|
||||
width: px2rem(683);
|
||||
height: px2rem(989);
|
||||
background: url(../images/ruleBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
overflow: hidden;
|
||||
|
||||
.tab {
|
||||
width: px2rem(498);
|
||||
height: px2rem(92);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: px2rem(180) auto px2rem(19);
|
||||
|
||||
div {
|
||||
width: px2rem(235);
|
||||
height: px2rem(92);
|
||||
}
|
||||
|
||||
.tab1 {
|
||||
background: url(../images/ruleTab1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.tab2 {
|
||||
background: url(../images/ruleTab2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.act1 {
|
||||
background: url(../images/ruleTabAct1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.act2 {
|
||||
background: url(../images/ruleTabAct2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.box {
|
||||
width: px2rem(586);
|
||||
height: 8.5rem;
|
||||
margin: 0 auto 0;
|
||||
overflow-y: scroll;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.img2 {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.box2 {
|
||||
width: px2rem(622);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.end {
|
||||
position: fixed;
|
||||
z-index: 99;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background: rgba(0, 0, 0, .6);
|
||||
display: none;
|
||||
|
||||
.end_in {
|
||||
width: px2rem(525);
|
||||
height: px2rem(411);
|
||||
background: url(../images/endBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.but {
|
||||
width: px2rem(236);
|
||||
height: px2rem(92);
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: px2rem(61);
|
||||
}
|
||||
}
|
||||
|
||||
.records {
|
||||
position: fixed;
|
||||
z-index: 99;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background: rgba(0, 0, 0, .6);
|
||||
display: none;
|
||||
|
||||
.records_in {
|
||||
width: px2rem(721);
|
||||
height: px2rem(636);
|
||||
background: url(../images/recordsBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
overflow: hidden;
|
||||
|
||||
.title {
|
||||
width: 5.4rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
color: #8956AA;
|
||||
font-weight: 500;
|
||||
font-size: px2rem(27);
|
||||
margin: px2rem(187) auto px2rem(36);
|
||||
text-align: center;
|
||||
|
||||
div {
|
||||
width: 2.7rem;
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
width: 5.4rem;
|
||||
height: 3.4rem;
|
||||
margin: 0 auto;
|
||||
overflow-y: scroll;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
li {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
text-align: right;
|
||||
margin-bottom: px2rem(21);
|
||||
|
||||
div {
|
||||
width: 2.7rem;
|
||||
box-sizing: border-box;
|
||||
padding-right: 0.64rem;
|
||||
color: #8956AA;
|
||||
font-size: px2rem(20);
|
||||
font-weight: 400;
|
||||
|
||||
p {
|
||||
margin-bottom: px2rem(5);
|
||||
}
|
||||
|
||||
b {
|
||||
font-size: px2rem(16);
|
||||
}
|
||||
}
|
||||
|
||||
.div2 {
|
||||
text-align: center;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.null {
|
||||
.nulls {
|
||||
text-align: center;
|
||||
text-indent: 0.6rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
BIN
view/molistar/activity/2024-cityLove/images/convert.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/convert.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.9 KiB |
BIN
view/molistar/activity/2024-cityLove/images/convertOut.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/convertOut.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
BIN
view/molistar/activity/2024-cityLove/images/dayLimit.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/dayLimit.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 631 B |
BIN
view/molistar/activity/2024-cityLove/images/endBg.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/endBg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 116 KiB |
BIN
view/molistar/activity/2024-cityLove/images/endBut.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/endBut.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
BIN
view/molistar/activity/2024-cityLove/images/header.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/header.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 819 KiB |
BIN
view/molistar/activity/2024-cityLove/images/left_ts.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/left_ts.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 29 KiB |
BIN
view/molistar/activity/2024-cityLove/images/listBg.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/listBg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 57 KiB |
BIN
view/molistar/activity/2024-cityLove/images/logo.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
BIN
view/molistar/activity/2024-cityLove/images/love.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/love.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.1 KiB |
BIN
view/molistar/activity/2024-cityLove/images/more.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/more.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
BIN
view/molistar/activity/2024-cityLove/images/my.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/my.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 106 KiB |
BIN
view/molistar/activity/2024-cityLove/images/my2.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/my2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 43 KiB |
BIN
view/molistar/activity/2024-cityLove/images/myList.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/myList.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 63 KiB |
BIN
view/molistar/activity/2024-cityLove/images/notConvert.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/notConvert.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.9 KiB |
BIN
view/molistar/activity/2024-cityLove/images/page1Box1.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/page1Box1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 317 KiB |
BIN
view/molistar/activity/2024-cityLove/images/page1Box2.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/page1Box2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 447 KiB |
BIN
view/molistar/activity/2024-cityLove/images/page1Box3.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/page1Box3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 459 KiB |
BIN
view/molistar/activity/2024-cityLove/images/page1Box4.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/page1Box4.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 442 KiB |
BIN
view/molistar/activity/2024-cityLove/images/page1Box4_left.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/page1Box4_left.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
view/molistar/activity/2024-cityLove/images/page1Box4_right.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/page1Box4_right.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
view/molistar/activity/2024-cityLove/images/page2.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/page2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 554 KiB |
BIN
view/molistar/activity/2024-cityLove/images/recordsBg.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/recordsBg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 222 KiB |
BIN
view/molistar/activity/2024-cityLove/images/right_ts.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/right_ts.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
BIN
view/molistar/activity/2024-cityLove/images/rule1.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/rule1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 559 KiB |
BIN
view/molistar/activity/2024-cityLove/images/rule2.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/rule2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 594 KiB |
BIN
view/molistar/activity/2024-cityLove/images/ruleBg.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/ruleBg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 86 KiB |
BIN
view/molistar/activity/2024-cityLove/images/ruleTab1.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/ruleTab1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
BIN
view/molistar/activity/2024-cityLove/images/ruleTab2.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/ruleTab2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
BIN
view/molistar/activity/2024-cityLove/images/ruleTabAct1.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/ruleTabAct1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 22 KiB |
BIN
view/molistar/activity/2024-cityLove/images/ruleTabAct2.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/ruleTabAct2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 22 KiB |
BIN
view/molistar/activity/2024-cityLove/images/rule_icon.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/rule_icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
BIN
view/molistar/activity/2024-cityLove/images/tab1.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/tab1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
BIN
view/molistar/activity/2024-cityLove/images/tab2.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/tab2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
BIN
view/molistar/activity/2024-cityLove/images/tabAct1.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/tabAct1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 29 KiB |
BIN
view/molistar/activity/2024-cityLove/images/tabAct2.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/tabAct2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 29 KiB |
BIN
view/molistar/activity/2024-cityLove/images/travel/back.png
Normal file
BIN
view/molistar/activity/2024-cityLove/images/travel/back.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
163
view/molistar/activity/2024-cityLove/index.html
Normal file
163
view/molistar/activity/2024-cityLove/index.html
Normal file
@@ -0,0 +1,163 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>全城熱戀</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">
|
||||
<!-- 規則Icon -->
|
||||
<img src="./images/rule_icon.png" alt="" class="rule_icon">
|
||||
<!-- tab -->
|
||||
<div class="tab">
|
||||
<div class="tab1 act1"></div>
|
||||
<div class="tab2"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 熱戀攻略 -->
|
||||
<div class="page1">
|
||||
<img src="./images/page1Box1.png" alt="" class="page1Box1">
|
||||
<img src="./images/page1Box2.png" alt="" class="page1Box2">
|
||||
<img src="./images/page1Box3.png" alt="" class="page1Box3">
|
||||
<div class="page1Box4">
|
||||
<div class="left">0</div>
|
||||
<img src="./images/page1Box4_right.png" alt="" class="right">
|
||||
<div class="dayLimit dayLimit1">日限:0</div>
|
||||
<div class="dayLimit dayLimit2">日限:0</div>
|
||||
<div class="dayLimit dayLimit3">日限:0</div>
|
||||
<img src="./images/notConvert.png" alt="" class="convert convert1">
|
||||
<img src="./images/notConvert.png" alt="" class="convert convert2">
|
||||
<img src="./images/notConvert.png" alt="" class="convert convert3">
|
||||
<img src="./images/notConvert.png" alt="" class="convert convert4">
|
||||
<img src="./images/notConvert.png" alt="" class="convert convert5">
|
||||
<img src="./images/notConvert.png" alt="" class="convert convert6">
|
||||
<img src="./images/notConvert.png" alt="" class="convert convert7">
|
||||
<img src="./images/notConvert.png" alt="" class="convert convert8">
|
||||
</div>
|
||||
</div>
|
||||
<!-- 心跳加速 -->
|
||||
<div class="page2">
|
||||
<!-- 第一名 -->
|
||||
<div class="first">
|
||||
<img src="./images/logo.png" alt="" class="left_tx">
|
||||
<img src="./images/logo.png" alt="" class="right_tx">
|
||||
<img src="./images/left_ts.png" alt="" class="left_ts">
|
||||
<img src="./images/right_ts.png" alt="" class="right_ts">
|
||||
<div class="score"></div>
|
||||
<div class="leftNick"></div>
|
||||
<div class="rightNick"></div>
|
||||
</div>
|
||||
<!-- 非第一名 -->
|
||||
<ul class="notFirst">
|
||||
<li>
|
||||
<div class="num">2</div>
|
||||
<img src="./images/logo.png" alt="" class="left_tx">
|
||||
<img src="./images/logo.png" alt="" class="right_tx">
|
||||
<img src="./images/love.png" alt="" class="love">
|
||||
<div class="nickLeft">虛位以待</div>
|
||||
<div class="nickRight">虛位以待</div>
|
||||
<div class="score">0</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="my">
|
||||
<img src="./images/more.png" alt="" class="more">
|
||||
<ul>
|
||||
<li>
|
||||
<div class="num">2</div>
|
||||
<img src="./images/logo.png" alt="" class="left_tx">
|
||||
<img src="./images/logo.png" alt="" class="right_tx">
|
||||
<img src="./images/love.png" alt="" class="love">
|
||||
<div class="nickLeft">虛位以待</div>
|
||||
<div class="nickRight">虛位以待</div>
|
||||
<div class="score">0</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="num">3</div>
|
||||
<img src="./images/logo.png" alt="" class="left_tx">
|
||||
<img src="./images/logo.png" alt="" class="right_tx">
|
||||
<img src="./images/love.png" alt="" class="love">
|
||||
<div class="nickLeft">虛位以待</div>
|
||||
<div class="nickRight">虛位以待</div>
|
||||
<div class="score">0</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="num">4</div>
|
||||
<img src="./images/logo.png" alt="" class="left_tx">
|
||||
<img src="./images/logo.png" alt="" class="right_tx">
|
||||
<img src="./images/love.png" alt="" class="love">
|
||||
<div class="nickLeft">虛位以待</div>
|
||||
<div class="nickRight">虛位以待</div>
|
||||
<div class="score">0</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="num">5</div>
|
||||
<img src="./images/logo.png" alt="" class="left_tx">
|
||||
<img src="./images/logo.png" alt="" class="right_tx">
|
||||
<img src="./images/love.png" alt="" class="love">
|
||||
<div class="nickLeft">虛位以待</div>
|
||||
<div class="nickRight">虛位以待</div>
|
||||
<div class="score">0</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 活動規則彈窗 -->
|
||||
<div class="rule">
|
||||
<div class="rule_in">
|
||||
<div class="tab">
|
||||
<div class="tab1 act1"></div>
|
||||
<div class="tab2"></div>
|
||||
</div>
|
||||
<div class="box">
|
||||
<img src="./images/rule1.png" alt="" class="img1">
|
||||
<img src="./images/rule2.png" alt="" class="img2">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 活動結束彈窗 -->
|
||||
<div class="end">
|
||||
<div class="end_in">
|
||||
<img src="./images/endBut.png" alt="" class="but">
|
||||
</div>
|
||||
</div>
|
||||
<!-- 兌換記錄彈窗 -->
|
||||
<div class="records">
|
||||
<div class="records_in">
|
||||
<div class="title">
|
||||
<div>兌換時間</div>
|
||||
<div>商品</div>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
<div>
|
||||
<p>2024/01/22</p>
|
||||
<b>23:59:59</b>
|
||||
</div>
|
||||
<div class="div2">
|
||||
<p>禮物名稱</p>
|
||||
<b>XX天</b>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</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="./js/index.js"></script>
|
||||
377
view/molistar/activity/2024-cityLove/js/index.js
Normal file
377
view/molistar/activity/2024-cityLove/js/index.js
Normal file
@@ -0,0 +1,377 @@
|
||||
let urlPrefix = getUrlPrefix()
|
||||
let browser = checkVersion()
|
||||
let env = EnvCheck();
|
||||
if (env == 'test') {
|
||||
new VConsole();
|
||||
}
|
||||
var langReplace;
|
||||
var localLang;
|
||||
// 封裝layer消息提醒框
|
||||
let layerIndex
|
||||
const showLoading = (content = '加載中') => {
|
||||
layer.open({
|
||||
type: 2,
|
||||
shadeClose: false,
|
||||
content,
|
||||
success(e) {
|
||||
layerIndex = $(e).attr('index')
|
||||
}
|
||||
})
|
||||
}
|
||||
const hideLoading = (index) => {
|
||||
layer.close(index)
|
||||
}
|
||||
const toastMsg = (content = '操作完成', time = 2) => {
|
||||
layer.open({
|
||||
content,
|
||||
time,
|
||||
skin: 'msg'
|
||||
})
|
||||
}
|
||||
var listMoreBool = true;
|
||||
var taskValue = null;
|
||||
var isLock = true;
|
||||
var page = 1;
|
||||
// 初始化函數
|
||||
$(function () {
|
||||
getInfoFromClient();
|
||||
setTimeout(function () {
|
||||
// 頁面全屏
|
||||
if (browser.app) {
|
||||
if (browser.android) {
|
||||
window.androidJsObj.initShowNav(false)
|
||||
} else {
|
||||
window.webkit.messageHandlers.initShowNav.postMessage(0)
|
||||
}
|
||||
};
|
||||
// 頂部返回事件
|
||||
$('.back').click(() => {
|
||||
if (browser.android) {
|
||||
window.androidJsObj.closeWebView()
|
||||
} else {
|
||||
window.webkit.messageHandlers.closeWebView.postMessage(null)
|
||||
}
|
||||
})
|
||||
getCurrency();
|
||||
activityCodeInfo();
|
||||
}, 100)
|
||||
})
|
||||
|
||||
// 配置接口
|
||||
function getCurrency() {
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'get',
|
||||
url: urlPrefix + '/act/hotLove/currency',
|
||||
data: { redisKey: 'act_user_task_extra_data' },
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
taskValue = res.data;
|
||||
$('.page1 .page1Box4 .left').text(res.data);
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'get',
|
||||
url: urlPrefix + '/act/hotLove/rewardList',
|
||||
data: { activityCode: 'ACT_2024_HOT_LOVE', componentCode: "RE_LIAN_SHANG_DIAN" },
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
res.data.forEach((res, i) => {
|
||||
if (res.stockValue <= 0) {
|
||||
$(`.page1 .page1Box4 .convert${i + 1}`).attr("src", './images/convertOut.png');
|
||||
$(`.page1 .page1Box4 .convert${i + 1}`).attr("click", 0);
|
||||
} else if (taskValue >= res.taskValue) {
|
||||
$(`.page1 .page1Box4 .convert${i + 1}`).attr("src", './images/convert.png');
|
||||
$(`.page1 .page1Box4 .convert${i + 1}`).attr("click", 1);
|
||||
} else {
|
||||
$(`.page1 .page1Box4 .convert${i + 1}`).attr("src", './images/notConvert.png');
|
||||
$(`.page1 .page1Box4 .convert${i + 1}`).attr("click", 0);
|
||||
}
|
||||
$(`.page1 .page1Box4 .convert${i + 1}`).attr('taskCode', res.taskCode);
|
||||
$(`.page1 .page1Box4 .convert${i + 1}`).attr('conditionCode', res.conditionCode);
|
||||
$(`.page1 .page1Box4 .dayLimit${i + 1}`).text(`日限:${res.stockValue}`)
|
||||
})
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
},
|
||||
error(err) {
|
||||
hideLoading(layerIndex)
|
||||
toastMsg('網絡錯誤')
|
||||
}
|
||||
})
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
},
|
||||
error(err) {
|
||||
hideLoading(layerIndex)
|
||||
toastMsg('網絡錯誤')
|
||||
}
|
||||
})
|
||||
}
|
||||
// 获取时间接口
|
||||
function activityCodeInfo() {
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'get',
|
||||
url: urlPrefix + '/activity/info',
|
||||
data: { activityCode: "ACT_2024_HOT_LOVE" },
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
// 判断活动结束时间
|
||||
if (res.timestamp > res.data.endTime) {
|
||||
$('.end').show();
|
||||
}
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
},
|
||||
error(err) {
|
||||
hideLoading(layerIndex)
|
||||
toastMsg('網絡錯誤')
|
||||
}
|
||||
})
|
||||
}
|
||||
// tab切換
|
||||
$('.header .tab div').click(function () {
|
||||
var i = $(this).index() + 1;
|
||||
$('.header .tab div').removeClass('act1').removeClass('act2');
|
||||
$(this).addClass(`act${i}`);
|
||||
$(`.page${i}`).show();
|
||||
i == 1 ? $('.page2').hide() : $('.page1').hide();
|
||||
if (i == 2) {
|
||||
getRank();
|
||||
}
|
||||
})
|
||||
|
||||
// 榜單接口
|
||||
function getRank() {
|
||||
$('.page2 .my ul li').remove();
|
||||
$('.page2 .notFirst li').remove();
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'get',
|
||||
url: urlPrefix + '/act/2024Valentines/cpRank/getRank',
|
||||
data: { pageSize: 30 },
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
var first = res.data.rankList.slice(0, 1);
|
||||
var notFirst = res.data.rankList.slice(1);
|
||||
// 處理第一名
|
||||
if (first.length < 1) {
|
||||
let arr = new Array(3 - first.length).fill({
|
||||
leftAvatar: './images/logo.png',
|
||||
rightAvatar: './images/logo.png',
|
||||
leftNick: '虛位以待',
|
||||
rightNick: '虛位以待',
|
||||
score: "0"
|
||||
})
|
||||
first.push(...arr)
|
||||
}
|
||||
first.forEach(res => {
|
||||
$('.page2 .first .left_tx').attr('src', res.leftAvatar);
|
||||
$('.page2 .first .right_tx').attr('src', res.rightAvatar);
|
||||
$('.page2 .first .leftNick').text(res.leftNick)
|
||||
$('.page2 .first .rightNick').text(res.rightNick)
|
||||
$('.page2 .first .score').text(unitProcessing(res.score, 10000, 1, 'w'))
|
||||
})
|
||||
// 處理非第一名
|
||||
var str = '';
|
||||
notFirst.forEach((res, i) => {
|
||||
str += `
|
||||
<li>
|
||||
<div class="num">${res.ranking}</div>
|
||||
<img src="${res.leftAvatar}" alt="" class="left_tx">
|
||||
<img src="${res.rightAvatar}" alt="" class="right_tx">
|
||||
<img src="./images/love.png" alt="" class="love">
|
||||
<div class="nickLeft">${res.leftNick}</div>
|
||||
<div class="nickRight">${res.rightNick}</div>
|
||||
<div class="score">${unitProcessing(res.score, 10000, 1, 'w')}</div>
|
||||
</li>`
|
||||
})
|
||||
$('.page2 .notFirst').append(str);
|
||||
// 處理自己
|
||||
var strMy = '';
|
||||
if (res.data.meRankList.length <= 0) {
|
||||
$('.page2 .my .more').hide();
|
||||
strMy += `<li class="null">暫無組合~</li>`
|
||||
} else {
|
||||
$('.page2 .my .more').show();
|
||||
res.data.meRankList.forEach((res, i) => {
|
||||
strMy += `
|
||||
<li>
|
||||
<div class="num">${res.ranking == 0 ? '30+' : res.ranking}</div>
|
||||
<img src="${res.leftAvatar}" alt="" class="left_tx">
|
||||
<img src="${res.rightAvatar}" alt="" class="right_tx">
|
||||
<img src="./images/love.png" alt="" class="love">
|
||||
<div class="nickLeft">${res.leftNick}</div>
|
||||
<div class="nickRight">${res.rightNick}</div>
|
||||
<div class="score">${unitProcessing(res.score, 10000, 1, 'w')}</div>
|
||||
</li>
|
||||
`
|
||||
})
|
||||
}
|
||||
$('.page2 .my ul').append(strMy)
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
},
|
||||
error(err) {
|
||||
hideLoading(layerIndex)
|
||||
toastMsg('網絡錯誤')
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
// 榜單查看更多按鈕
|
||||
$('.page2 .my .more').click(function () {
|
||||
if (listMoreBool) {
|
||||
$('.page2 .my').css({ "height": '7.76rem', "background": "url(./images/my2.png) no-repeat", "background-size": "100% 100%" });
|
||||
$('.page2 .my .more').css({ "transform": "rotate(180deg)" });
|
||||
$('.page2 .my ul').css({ "height": "6.4rem", "overflow-y": "scroll" });
|
||||
bodyScroolFun(true);
|
||||
} else {
|
||||
$('.page2 .my').css({ "height": '3.16rem', "background": "url(./images/my.png) no-repeat", "background-size": "100% 100%" });
|
||||
$('.page2 .my .more').css({ "transform": "rotate(0deg)" });
|
||||
$('.page2 .my ul').css({ "height": "1.82667rem", "overflow-y": "hidden" });
|
||||
bodyScroolFun(false);
|
||||
}
|
||||
$('.page2 .my ul').scrollTop(0);
|
||||
listMoreBool = !listMoreBool;
|
||||
})
|
||||
// 活動規則切換
|
||||
$('.rule .rule_in .tab div').click(function () {
|
||||
var i = $(this).index() + 1;
|
||||
$('.rule .rule_in .tab div').removeClass('act1').removeClass('act2');
|
||||
$(this).addClass(`act${i}`);
|
||||
// $(`.rule .rule_in .box img`).attr('src', `./images/rule${i}.png`);
|
||||
$(`.rule .rule_in .box .img1,.rule .rule_in .box .img2`).hide();
|
||||
$(`.rule .rule_in .box .img${i}`).show();
|
||||
i == 1 ? $('.rule .rule_in .box').removeClass('box2') : $('.rule .rule_in .box').addClass('box2');
|
||||
return false;
|
||||
})
|
||||
// 打開活動規則
|
||||
$('.header .rule_icon').click(function () {
|
||||
$('.rule').show();
|
||||
bodyScroolFun(true);
|
||||
})
|
||||
// 關閉活動規則
|
||||
$('.rule').click(function () {
|
||||
$('.rule').hide();
|
||||
bodyScroolFun(false);
|
||||
})
|
||||
// 關閉活動結束
|
||||
$('.end .but').click(function () {
|
||||
$('.end').hide();
|
||||
bodyScroolFun(false);
|
||||
$('.header .tab div').removeClass('act1').removeClass('act2');
|
||||
$('.header .tab .tab2').addClass(`act${2}`);
|
||||
$(`.page${2}`).show();
|
||||
$('.page1').hide();
|
||||
getRank();
|
||||
})
|
||||
// 打開記錄彈窗
|
||||
$('.page1 .page1Box4 .right').click(function () {
|
||||
$('.records .records_in ul li').remove();
|
||||
isLock = true;
|
||||
page = 1;
|
||||
record(page);
|
||||
bodyScroolFun(true);
|
||||
})
|
||||
// 關閉記錄彈窗
|
||||
$('.records').click(function () {
|
||||
$('.records').hide();
|
||||
bodyScroolFun(false);
|
||||
})
|
||||
// 兌換按鈕
|
||||
$('.page1 .page1Box4 .convert').click(function () {
|
||||
var taskcode = $(this).attr('taskcode');
|
||||
var conditionCode = $(this).attr('conditionCode');
|
||||
var bool = $(this).attr('click');
|
||||
if (bool == 1) {
|
||||
exchange(taskcode, conditionCode);
|
||||
}
|
||||
})
|
||||
// 兌換接口
|
||||
function exchange(taskCode, conditionCode) {
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'post',
|
||||
url: urlPrefix + '/act/hotLove/exchange',
|
||||
data: { taskCode, activityCode: 'ACT_2024_HOT_LOVE', conditionCode, },
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
getCurrency();
|
||||
toastMsg('兌換成功')
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
},
|
||||
error(err) {
|
||||
hideLoading(layerIndex)
|
||||
toastMsg('網絡錯誤')
|
||||
}
|
||||
})
|
||||
}
|
||||
// 兌換記錄滾動
|
||||
$('.records .records_in ul').scroll(function () {
|
||||
let scrollTop = $(this).scrollTop()
|
||||
let scrollHeight = $('.records .records_in ul')[0].scrollHeight
|
||||
let ulHeight = $(this).innerHeight()
|
||||
if (scrollTop + ulHeight + 100 >= scrollHeight) {
|
||||
if (isLock) {
|
||||
// 請求下一頁
|
||||
page++;
|
||||
record(page)
|
||||
isLock = false;
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
// 記錄接口
|
||||
function record(pageNum) {
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'get',
|
||||
url: urlPrefix + '/activity/task/user/record/page',
|
||||
data: { activityCode: 'ACT_2024_HOT_LOVE', componentCode: 'RE_LIAN_SHANG_DIAN', pageNum, pageSize: 10 },
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
var str = '';
|
||||
if (res.data.records.length <= 0 && pageNum == 1) {
|
||||
str += `<li class="null"><div class="nulls">暫無</div><div class="nulls">暫無</div></li>`
|
||||
isLock = false;
|
||||
} else {
|
||||
res.data.records.forEach(res => {
|
||||
str += `
|
||||
<li>
|
||||
<div>
|
||||
<p>${dateFormat(res.createTime, "yyyy/MM/dd")}</p>
|
||||
<b>${dateFormat(res.createTime, "hh/mm/ss")}</b>
|
||||
</div>
|
||||
<div class="div2">
|
||||
<p>${res.rewardName}</p>
|
||||
<b>${res.rewardNum}${rewardTypeFun(res.rewardType).unit}</b>
|
||||
</div>
|
||||
</li>
|
||||
`})
|
||||
}
|
||||
$('.records .records_in ul').append(str);
|
||||
$('.records').show();
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
},
|
||||
error(err) {
|
||||
hideLoading(layerIndex)
|
||||
toastMsg('網絡錯誤')
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
@@ -1,7 +1,7 @@
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
background: #FFE1C5;
|
||||
background: #1E1300;
|
||||
}
|
||||
|
||||
.back {
|
||||
@@ -32,7 +32,7 @@ body {
|
||||
|
||||
.header {
|
||||
width: 10rem;
|
||||
height: 8.69333rem;
|
||||
height: 10.02667rem;
|
||||
background: url(../images/header.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: 0 auto 0;
|
||||
@@ -41,19 +41,29 @@ body {
|
||||
|
||||
.header .h3 {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
left: 52%;
|
||||
transform: translateX(-50%);
|
||||
top: 3.25333rem;
|
||||
height: 1.36rem;
|
||||
width: 8.6rem;
|
||||
top: 3.64rem;
|
||||
height: 1.30667rem;
|
||||
width: 6.48rem;
|
||||
}
|
||||
|
||||
.header .rule_rule {
|
||||
width: 0.77333rem;
|
||||
width: 2rem;
|
||||
height: 0.77333rem;
|
||||
line-height: 0.8rem;
|
||||
font-size: 0.34667rem;
|
||||
font-weight: bold;
|
||||
position: absolute;
|
||||
top: 4.77333rem;
|
||||
right: 0.4rem;
|
||||
top: 1rem;
|
||||
right: 0rem;
|
||||
color: #703900;
|
||||
box-sizing: border-box;
|
||||
padding-right: 0.13333rem;
|
||||
font-family: PingFang SC;
|
||||
text-align: center;
|
||||
text-indent: 0.3rem;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.header .text {
|
||||
@@ -61,19 +71,23 @@ body {
|
||||
height: 0.8rem;
|
||||
line-height: 0.8rem;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
left: 52%;
|
||||
transform: translateX(-50%);
|
||||
top: 5.06667rem;
|
||||
background: url(../images/header_text.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
top: 4.95rem;
|
||||
text-align: center;
|
||||
color: #FFF6E5;
|
||||
font-size: 0.37333rem;
|
||||
font-size: 0.34667rem;
|
||||
font-weight: 400;
|
||||
font-family: PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
background: linear-gradient(180deg, #FFFFFF 0%, #FEF6A1 100%);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
|
||||
.header .text b {
|
||||
font-size: 0.56rem;
|
||||
font-size: 0.4rem;
|
||||
font-weight: 600;
|
||||
vertical-align: middle;
|
||||
margin-top: -0.06667rem;
|
||||
@@ -89,16 +103,15 @@ body {
|
||||
|
||||
.bg {
|
||||
width: 100%;
|
||||
background: url(../images/bg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #1E1300;
|
||||
position: relative;
|
||||
margin: -0.56rem auto 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.bg .myInfo {
|
||||
width: 9.2rem;
|
||||
height: 4.06667rem;
|
||||
width: 9.74667rem;
|
||||
height: 4.98667rem;
|
||||
background: url(../images/myInfo.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: 1.12rem auto 0.26667rem;
|
||||
@@ -108,37 +121,37 @@ body {
|
||||
.bg .myInfo .tx {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
border: 0.02667rem solid #F55E3E;
|
||||
border: 0.05333rem solid #FFF6CA;
|
||||
position: absolute;
|
||||
left: 0.53333rem;
|
||||
top: 0.73333rem;
|
||||
left: 0.77333rem;
|
||||
top: 1.44rem;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.bg .myInfo p {
|
||||
color: #FE3312;
|
||||
color: #FFEA7F;
|
||||
font-size: 0.37333rem;
|
||||
position: absolute;
|
||||
top: 1.34667rem;
|
||||
left: 2.37333rem;
|
||||
top: 2.06667rem;
|
||||
left: 2.58667rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.bg .myInfo .invitationCode {
|
||||
position: absolute;
|
||||
right: 0.66667rem;
|
||||
top: 1.18667rem;
|
||||
font-size: 0.64rem;
|
||||
right: 1.68rem;
|
||||
top: 2.04rem;
|
||||
font-size: 0.53333rem;
|
||||
font-weight: normal;
|
||||
color: #FE3312;
|
||||
color: #FFB720;
|
||||
}
|
||||
|
||||
.bg .myInfo .skip {
|
||||
position: absolute;
|
||||
left: 0.53333rem;
|
||||
left: 0.77333rem;
|
||||
bottom: 0.66667rem;
|
||||
width: 3.92rem;
|
||||
height: 0.8rem;
|
||||
height: 0.90667rem;
|
||||
line-height: 0.8rem;
|
||||
text-align: center;
|
||||
color: #FE3312;
|
||||
@@ -157,16 +170,16 @@ body {
|
||||
|
||||
.bg .myInfo .copy {
|
||||
position: absolute;
|
||||
right: 0.53333rem;
|
||||
right: 0.66667rem;
|
||||
bottom: 0.66667rem;
|
||||
width: 3.92rem;
|
||||
height: 0.8rem;
|
||||
height: 0.90667rem;
|
||||
line-height: 0.8rem;
|
||||
text-align: center;
|
||||
color: #FE3312;
|
||||
font-size: 0.24rem;
|
||||
font-weight: 400;
|
||||
background: url(../images/myInfoBut.png) no-repeat;
|
||||
background: url(../images/myInfoBut2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
@@ -178,8 +191,8 @@ body {
|
||||
}
|
||||
|
||||
.bg .myIncome {
|
||||
width: 9.2rem;
|
||||
height: 1.33333rem;
|
||||
width: 9.36rem;
|
||||
height: 1.01333rem;
|
||||
position: relative;
|
||||
margin: 0 auto 0.26667rem;
|
||||
background: url(../images/myIncomeBg.png) no-repeat;
|
||||
@@ -196,13 +209,13 @@ body {
|
||||
}
|
||||
|
||||
.bg .myIncome p {
|
||||
color: #FFFFFF;
|
||||
font-size: 0.48rem;
|
||||
font-size: 0.42667rem;
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
left: 0.26667rem;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
color: #FBFB6E;
|
||||
}
|
||||
|
||||
.bg .myIncome b {
|
||||
@@ -210,132 +223,202 @@ body {
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
right: 1.2rem;
|
||||
color: #FE3312;
|
||||
color: #0C0538;
|
||||
font-size: 0.48rem;
|
||||
}
|
||||
|
||||
.bg .incomeBox {
|
||||
width: 9.2rem;
|
||||
height: 10.66667rem;
|
||||
background: #fff;
|
||||
border-radius: 0.26667rem;
|
||||
border: 0.05333rem solid #FE7835;
|
||||
margin: 0 auto 0.26667rem;
|
||||
position: relative;
|
||||
.bg .ul_pub {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background: rgba(0, 0, 0, 0.6);
|
||||
z-index: 5;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.bg .incomeBox .tab {
|
||||
.bg .ul_pub .incomeBox {
|
||||
width: 9.74667rem;
|
||||
height: 13.05333rem;
|
||||
background: url(../images/incomeBox.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.bg .ul_pub .incomeBox .close {
|
||||
width: 1rem;
|
||||
height: 1rem;
|
||||
position: absolute;
|
||||
right: 0rem;
|
||||
top: 0rem;
|
||||
}
|
||||
|
||||
.bg .ul_pub .incomeBox h3 {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 500;
|
||||
font-size: 0.37333rem;
|
||||
color: #FFBB1D;
|
||||
line-height: 42px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 1.53333rem;
|
||||
}
|
||||
|
||||
.bg .ul_pub .incomeBox .gold {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-family: PingFang SC;
|
||||
font-weight: bold;
|
||||
font-size: 0.53333rem;
|
||||
color: #FFBB1D;
|
||||
line-height: 42px;
|
||||
position: absolute;
|
||||
top: 2.22667rem;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.bg .ul_pub .incomeBox .gold b {
|
||||
vertical-align: middle;
|
||||
margin-right: 0.13333rem;
|
||||
}
|
||||
|
||||
.bg .ul_pub .incomeBox .gold img {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: 0.50667rem;
|
||||
height: 0.50667rem;
|
||||
}
|
||||
|
||||
.bg .ul_pub .incomeBox .tab {
|
||||
width: 8.66667rem;
|
||||
height: 1.92rem;
|
||||
height: 1.78667rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 0.18667rem auto 0.26667rem;
|
||||
margin: 2.98667rem auto 0.26667rem;
|
||||
}
|
||||
|
||||
.bg .incomeBox .tab div {
|
||||
width: 4.21333rem;
|
||||
.bg .ul_pub .incomeBox .tab div {
|
||||
width: 4.06667rem;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
background: url(../images/tab.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.bg .incomeBox .tab div p {
|
||||
color: #FFFFFF;
|
||||
font-size: 0.32rem;
|
||||
.bg .ul_pub .incomeBox .tab div p {
|
||||
color: #EDEDED;
|
||||
font-size: 0.29333rem;
|
||||
font-weight: 500;
|
||||
margin-top: 0.46667rem;
|
||||
margin-bottom: 0.24rem;
|
||||
margin-top: 0.81333rem;
|
||||
margin-bottom: 0rem;
|
||||
}
|
||||
|
||||
.bg .incomeBox .tab div span {
|
||||
.bg .ul_pub .incomeBox .tab div span {
|
||||
color: #fff;
|
||||
font-size: 0.37333rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.bg .incomeBox .tab div span img {
|
||||
.bg .ul_pub .incomeBox .tab div span img {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: 0.58667rem;
|
||||
height: 0.58667rem;
|
||||
width: 0.50667rem;
|
||||
height: 0.50667rem;
|
||||
filter: grayscale(100%);
|
||||
}
|
||||
|
||||
.bg .incomeBox .tab .act {
|
||||
.bg .ul_pub .incomeBox .tab .act {
|
||||
background: url(../images/tabAct.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.bg .incomeBox .tab .act p {
|
||||
margin-top: 0.36rem;
|
||||
.bg .ul_pub .incomeBox .tab .act p {
|
||||
color: #FEFF7B;
|
||||
}
|
||||
|
||||
.bg .incomeBox .sTab {
|
||||
width: 100%;
|
||||
height: 0.8rem;
|
||||
line-height: 0.8rem;
|
||||
.bg .ul_pub .incomeBox .tab .act span {
|
||||
color: #FFDD3D;
|
||||
}
|
||||
|
||||
.bg .ul_pub .incomeBox .tab .act span img {
|
||||
filter: grayscale(0%);
|
||||
}
|
||||
|
||||
.bg .ul_pub .incomeBox .sTab {
|
||||
width: 8.8rem;
|
||||
height: 0.96rem;
|
||||
line-height: 0.96rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 0 auto 0rem;
|
||||
}
|
||||
|
||||
.bg .incomeBox .sTab div {
|
||||
.bg .ul_pub .incomeBox .sTab div {
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
color: #333333;
|
||||
font-size: 0.26667rem;
|
||||
color: #F9FFC1;
|
||||
font-size: 0.28rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.bg .incomeBox .sTab .tab1 {
|
||||
background: url(../images/sTab1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #FE3312;
|
||||
}
|
||||
|
||||
.bg .incomeBox .sTab .tab2 {
|
||||
background: url(../images/sTab2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #FE3312;
|
||||
}
|
||||
|
||||
.bg .incomeBox .tableTitle {
|
||||
width: 99.9%;
|
||||
.bg .ul_pub .incomeBox .sTab .tab1 {
|
||||
background: url(../images/sTab1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #FEFF7B;
|
||||
}
|
||||
|
||||
.bg .ul_pub .incomeBox .sTab .tab2 {
|
||||
background: url(../images/sTab1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #FEFF7B;
|
||||
}
|
||||
|
||||
.bg .ul_pub .incomeBox .tableTitle {
|
||||
width: 8.8rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 0;
|
||||
position: absolute;
|
||||
top: 3.17rem;
|
||||
top: 6.15rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
z-index: 2;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.bg .incomeBox .tableTitle div {
|
||||
.bg .ul_pub .incomeBox .tableTitle div {
|
||||
width: 25%;
|
||||
height: 0.66667rem;
|
||||
line-height: 0.66667rem;
|
||||
text-align: center;
|
||||
color: #333333;
|
||||
font-size: 0.26667rem;
|
||||
color: #FFB920;
|
||||
font-size: 0.29333rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.bg .incomeBox ul {
|
||||
width: 100%;
|
||||
height: 7.4rem;
|
||||
.bg .ul_pub .incomeBox ul {
|
||||
width: 8.8rem;
|
||||
height: 6rem;
|
||||
margin: 0 auto 0;
|
||||
overflow-y: scroll;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.bg .incomeBox ul::-webkit-scrollbar {
|
||||
.bg .ul_pub .incomeBox ul::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.bg .incomeBox ul .top {
|
||||
.bg .ul_pub .incomeBox ul .top {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
@@ -346,7 +429,7 @@ body {
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.bg .incomeBox ul .top div {
|
||||
.bg .ul_pub .incomeBox ul .top div {
|
||||
width: 25%;
|
||||
height: 0.66667rem;
|
||||
line-height: 0.66667rem;
|
||||
@@ -356,7 +439,7 @@ body {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.bg .incomeBox ul li {
|
||||
.bg .ul_pub .incomeBox ul li {
|
||||
width: 100%;
|
||||
height: 0.66667rem;
|
||||
margin-bottom: 0.24rem;
|
||||
@@ -364,15 +447,15 @@ body {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.bg .incomeBox ul li:nth-child(1) {
|
||||
.bg .ul_pub .incomeBox ul li:nth-child(1) {
|
||||
margin-top: 0.66667rem;
|
||||
}
|
||||
|
||||
.bg .incomeBox ul li div {
|
||||
.bg .ul_pub .incomeBox ul li div {
|
||||
overflow: hidden;
|
||||
width: 25%;
|
||||
text-align: center;
|
||||
color: #666666;
|
||||
color: #FFE67C;
|
||||
font-size: 0.24rem;
|
||||
font-weight: 400;
|
||||
line-height: 0.66667rem;
|
||||
@@ -381,30 +464,38 @@ body {
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.bg .incomeBox ul li div img {
|
||||
.bg .ul_pub .incomeBox ul li div img {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: 0.42667rem;
|
||||
height: 0.42667rem;
|
||||
}
|
||||
|
||||
.bg .incomeBox ul li .act {
|
||||
.bg .ul_pub .incomeBox ul li .act {
|
||||
line-height: 0rem;
|
||||
}
|
||||
|
||||
.bg .incomeBox ul li .act p {
|
||||
.bg .ul_pub .incomeBox ul li .act p {
|
||||
margin-top: 0.2rem;
|
||||
margin-bottom: 0.30667rem;
|
||||
}
|
||||
|
||||
.bg .rule {
|
||||
width: 9.2rem;
|
||||
height: 18.90667rem;
|
||||
border-radius: 0.26667rem;
|
||||
border: 0.05333rem solid #FE7835;
|
||||
margin: 0 auto 0.53333rem;
|
||||
width: 9.74667rem;
|
||||
height: 23.74667rem;
|
||||
margin: 0 auto 1.33333rem;
|
||||
position: relative;
|
||||
background: #fff;
|
||||
background: url(../images/ruleBoxBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.bg .rule .ruleInfo {
|
||||
position: absolute;
|
||||
width: 1.9rem;
|
||||
height: 0.9rem;
|
||||
top: 1.9rem;
|
||||
right: 0;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.bg .rule .title {
|
||||
@@ -431,6 +522,7 @@ body {
|
||||
margin: 0 auto 0.26667rem;
|
||||
background: url(../images/rule1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.bg .rule .rule1 h3 {
|
||||
@@ -511,8 +603,6 @@ body {
|
||||
height: 11.74667rem;
|
||||
position: relative;
|
||||
margin: 0 auto 0.4rem;
|
||||
background: url(../images/rule2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.bg .rule .rule2 h3 {
|
||||
@@ -565,7 +655,7 @@ body {
|
||||
|
||||
.bg .rule .rule2 .p1 {
|
||||
width: 100%;
|
||||
color: #FE3312;
|
||||
color: #FFB920;
|
||||
font-size: 0.26667rem;
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
@@ -577,7 +667,7 @@ body {
|
||||
|
||||
.bg .rule .rule2 .p2 {
|
||||
width: 100%;
|
||||
color: #FE3312;
|
||||
color: #FFB920;
|
||||
font-size: 0.26667rem;
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
@@ -614,14 +704,14 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 4.56rem;
|
||||
top: 14.56rem;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.bg .rule .rule2 .table1_1 div {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #FF4627;
|
||||
color: #FFB920;
|
||||
font-size: 0.24rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
@@ -635,14 +725,14 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 5.4rem;
|
||||
top: 15.6rem;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.bg .rule .rule2 .table1_2 div {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #FF4627;
|
||||
color: #FFB920;
|
||||
font-size: 0.24rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
@@ -656,14 +746,14 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 6.2rem;
|
||||
top: 16.4rem;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.bg .rule .rule2 .table1_3 div {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #FF4627;
|
||||
color: #FFB920;
|
||||
font-size: 0.24rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
@@ -677,14 +767,14 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 6.95rem;
|
||||
top: 17.15rem;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.bg .rule .rule2 .table1_4 div {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #FF4627;
|
||||
color: #FFB920;
|
||||
font-size: 0.24rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
@@ -698,14 +788,14 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 8.9rem;
|
||||
top: 19.8rem;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.bg .rule .rule2 .table2_1 div {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #FF4627;
|
||||
color: #FFB920;
|
||||
font-size: 0.24rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
@@ -719,14 +809,14 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 9.8rem;
|
||||
top: 20.8rem;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.bg .rule .rule2 .table2_2 div {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #FF4627;
|
||||
color: #FFB920;
|
||||
font-size: 0.24rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
@@ -740,14 +830,14 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 10.6rem;
|
||||
top: 21.7rem;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.bg .rule .rule2 .table2_3 div {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #FF4627;
|
||||
color: #FFB920;
|
||||
font-size: 0.24rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
@@ -755,17 +845,17 @@ body {
|
||||
.bg .rule .wishingStar {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #333333;
|
||||
font-size: 0.24rem;
|
||||
color: #F1D793;
|
||||
font-size: 0.26667rem;
|
||||
font-weight: 300;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 0.4rem;
|
||||
bottom: -0.6rem;
|
||||
}
|
||||
|
||||
.bg .rule .wishingStar b {
|
||||
color: #FE3312;
|
||||
color: #FFB920;
|
||||
}
|
||||
|
||||
.bg .otherNotes {
|
||||
@@ -803,20 +893,42 @@ body {
|
||||
margin-top: 0.26667rem;
|
||||
}
|
||||
|
||||
.otherRule {
|
||||
display: none;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background: rgba(0, 0, 0, 0.6);
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.otherRule img {
|
||||
position: absolute;
|
||||
width: 9.74667rem;
|
||||
height: 14.08rem;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.openShare {
|
||||
position: fixed;
|
||||
left: 0rem;
|
||||
bottom: 6.2rem;
|
||||
width: 1.6rem;
|
||||
height: 0.45333rem;
|
||||
line-height: 0.45333rem;
|
||||
background: linear-gradient(180deg, #FFAD50 0%, #FE3111 100%);
|
||||
border-radius: 0px 0.22667rem 0.22667rem 0px;
|
||||
width: 2rem;
|
||||
height: 0.6rem;
|
||||
line-height: 0.6rem;
|
||||
background: linear-gradient(180deg, #FFE156 0%, #FF7C06 100%);
|
||||
border-radius: 0px 0.6rem 0.6rem 0px;
|
||||
border: 0.02667rem #FFF8B4 solid;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-size: 0.21333rem;
|
||||
color: #89421A;
|
||||
font-size: 0.26667rem;
|
||||
display: none;
|
||||
z-index: 3;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.code {
|
||||
@@ -826,7 +938,7 @@ body {
|
||||
background: url(../images/codeBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: 2.34667rem;
|
||||
height: 3.16rem;
|
||||
height: 3.33333rem;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
@@ -846,8 +958,8 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-47%);
|
||||
top: 0.24rem;
|
||||
width: 100%;
|
||||
top: 0.4rem;
|
||||
width: 90%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@@ -858,7 +970,7 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-47%);
|
||||
top: 0.66667rem;
|
||||
top: 1rem;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
height: 0.32rem;
|
||||
@@ -883,7 +995,7 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-43%);
|
||||
top: 1.16rem;
|
||||
top: 1.4rem;
|
||||
}
|
||||
|
||||
.code .but {
|
||||
@@ -891,11 +1003,29 @@ body {
|
||||
height: 0.34667rem;
|
||||
line-height: 0.34667rem;
|
||||
border-radius: 0.34667rem;
|
||||
background: #fff;
|
||||
background: url(../images/shareButIcons.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
left: 0.50667rem;
|
||||
bottom: 0.24rem;
|
||||
text-align: center;
|
||||
color: #000;
|
||||
font-size: 0.24rem;
|
||||
color: #89421A;
|
||||
}
|
||||
|
||||
.arabic .bg .ul_pub .incomeBox .sTab div {
|
||||
font-size: 0.24rem;
|
||||
}
|
||||
|
||||
.arabic .header .rule_rule {
|
||||
font-size: 0.26667rem;
|
||||
text-indent: -10px;
|
||||
}
|
||||
|
||||
.arabic .bg .rule .rule2 .table2_2 {
|
||||
width: 9rem;
|
||||
}
|
||||
|
||||
.arabic .bg .rule .rule2 .table1_3_div {
|
||||
font-size: 0.13333rem;
|
||||
}
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
background: #FFE1C5;
|
||||
background: #1E1300;
|
||||
// background: linear-gradient(0deg, #DE3B4F 0%, #FFE4C9 99%);
|
||||
}
|
||||
|
||||
@@ -38,7 +38,7 @@ body {
|
||||
|
||||
.header {
|
||||
width: px2rem(750);
|
||||
height: px2rem(652);
|
||||
height: px2rem(752);
|
||||
background: url(../images/header.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: 0 auto 0;
|
||||
@@ -46,19 +46,29 @@ body {
|
||||
|
||||
.h3 {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
left: 52%;
|
||||
transform: translateX(-50%);
|
||||
top: px2rem(244);
|
||||
height: px2rem(102);
|
||||
width: px2rem(645);
|
||||
top: px2rem(273);
|
||||
height: px2rem(98);
|
||||
width: px2rem(486);
|
||||
}
|
||||
|
||||
.rule_rule {
|
||||
width: px2rem(58);
|
||||
height: px2rem(58);
|
||||
width: 2rem;
|
||||
height: 0.77333rem;
|
||||
line-height: 0.8rem;
|
||||
font-size: px2rem(26);
|
||||
font-weight: bold;
|
||||
position: absolute;
|
||||
top: px2rem(358);
|
||||
right: px2rem(30);
|
||||
top: 1rem;
|
||||
right: 0rem;
|
||||
color: #703900;
|
||||
box-sizing: border-box;
|
||||
padding-right: px2rem(10);
|
||||
font-family: PingFang SC;
|
||||
text-align: center;
|
||||
text-indent: 0.3rem;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.text {
|
||||
@@ -66,18 +76,24 @@ body {
|
||||
height: px2rem(60);
|
||||
line-height: px2rem(60);
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
left: 52%;
|
||||
transform: translateX(-50%);
|
||||
top: px2rem(380);
|
||||
background: url(../images/header_text.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
top: 4.95rem;
|
||||
// background: url(../images/header_text.png) no-repeat;
|
||||
// background-size: 100% 100%;
|
||||
text-align: center;
|
||||
color: #FFF6E5;
|
||||
font-size: px2rem(28);
|
||||
font-size: px2rem(26);
|
||||
font-weight: 400;
|
||||
font-family: PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
background: linear-gradient(180deg, #FFFFFF 0%, #FEF6A1 100%);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
|
||||
b {
|
||||
font-size: px2rem(42);
|
||||
font-size: px2rem(30);
|
||||
font-weight: 600;
|
||||
vertical-align: middle;
|
||||
margin-top: px2rem(-5);
|
||||
@@ -96,15 +112,16 @@ body {
|
||||
.bg {
|
||||
width: 100%;
|
||||
// height: px2rem(3608);
|
||||
background: url(../images/bg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
// background: url(../images/bg.png) no-repeat;
|
||||
// background-size: 100% 100%;
|
||||
color: #1E1300;
|
||||
position: relative;
|
||||
margin: px2rem(-42) auto 0;
|
||||
overflow: hidden;
|
||||
|
||||
.myInfo {
|
||||
width: px2rem(690);
|
||||
height: px2rem(305);
|
||||
width: px2rem(731);
|
||||
height: px2rem(374);
|
||||
background: url(../images/myInfo.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: px2rem(84) auto px2rem(20);
|
||||
@@ -113,37 +130,37 @@ body {
|
||||
.tx {
|
||||
width: px2rem(120);
|
||||
height: px2rem(120);
|
||||
border: px2rem(2) solid #F55E3E;
|
||||
border: px2rem(4) solid #FFF6CA;
|
||||
position: absolute;
|
||||
left: px2rem(40);
|
||||
top: px2rem(55);
|
||||
left: px2rem(58);
|
||||
top: px2rem(108);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
p {
|
||||
color: #FE3312;
|
||||
color: #FFEA7F;
|
||||
font-size: px2rem(28);
|
||||
position: absolute;
|
||||
top: px2rem(101);
|
||||
left: px2rem(178);
|
||||
top: px2rem(155);
|
||||
left: px2rem(194);
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.invitationCode {
|
||||
position: absolute;
|
||||
right: px2rem(50);
|
||||
top: px2rem(89);
|
||||
font-size: px2rem(48);
|
||||
right: px2rem(126);
|
||||
top: px2rem(153);
|
||||
font-size: px2rem(40);
|
||||
font-weight: normal;
|
||||
color: #FE3312;
|
||||
color: #FFB720;
|
||||
}
|
||||
|
||||
.skip {
|
||||
position: absolute;
|
||||
left: px2rem(40);
|
||||
left: px2rem(58);
|
||||
bottom: px2rem(50);
|
||||
width: px2rem(294);
|
||||
height: px2rem(60);
|
||||
height: px2rem(68);
|
||||
line-height: px2rem(60);
|
||||
text-align: center;
|
||||
color: #FE3312;
|
||||
@@ -162,16 +179,16 @@ body {
|
||||
|
||||
.copy {
|
||||
position: absolute;
|
||||
right: px2rem(40);
|
||||
right: px2rem(50);
|
||||
bottom: px2rem(50);
|
||||
width: px2rem(294);
|
||||
height: px2rem(60);
|
||||
height: px2rem(68);
|
||||
line-height: px2rem(60);
|
||||
text-align: center;
|
||||
color: #FE3312;
|
||||
font-size: px2rem(18);
|
||||
font-weight: 400;
|
||||
background: url(../images/myInfoBut.png) no-repeat;
|
||||
background: url(../images/myInfoBut2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
img {
|
||||
@@ -184,8 +201,8 @@ body {
|
||||
}
|
||||
|
||||
.myIncome {
|
||||
width: px2rem(690);
|
||||
height: px2rem(100);
|
||||
width: px2rem(702);
|
||||
height: px2rem(76);
|
||||
position: relative;
|
||||
margin: 0 auto px2rem(20);
|
||||
background: url(../images/myIncomeBg.png) no-repeat;
|
||||
@@ -201,13 +218,13 @@ body {
|
||||
}
|
||||
|
||||
p {
|
||||
color: #FFFFFF;
|
||||
font-size: px2rem(36);
|
||||
font-size: px2rem(32);
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
left: px2rem(20);
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
color: #FBFB6E;
|
||||
}
|
||||
|
||||
b {
|
||||
@@ -215,189 +232,268 @@ body {
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
right: px2rem(90);
|
||||
color: #FE3312;
|
||||
color: #0C0538;
|
||||
font-size: px2rem(36);
|
||||
}
|
||||
}
|
||||
|
||||
.incomeBox {
|
||||
width: px2rem(690);
|
||||
height: px2rem(800);
|
||||
background: #fff;
|
||||
border-radius: px2rem(20);
|
||||
border: px2rem(4) solid #FE7835;
|
||||
margin: 0 auto px2rem(20);
|
||||
position: relative;
|
||||
.ul_pub {
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background: rgba(0, 0, 0, .6);
|
||||
z-index: 5;
|
||||
display: none;
|
||||
|
||||
.tab {
|
||||
width: px2rem(650);
|
||||
height: px2rem(144);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: px2rem(14) auto px2rem(20);
|
||||
.incomeBox {
|
||||
width: px2rem(731);
|
||||
height: px2rem(979);
|
||||
background: url(../images/incomeBox.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
// background: #fff;
|
||||
// border-radius: px2rem(20);
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
|
||||
div {
|
||||
width: px2rem(316);
|
||||
height: 100%;
|
||||
.close {
|
||||
width: 1rem;
|
||||
height: 1rem;
|
||||
position: absolute;
|
||||
right: 0rem;
|
||||
top: 0rem;
|
||||
}
|
||||
|
||||
h3 {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
background: url(../images/tab.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 500;
|
||||
font-size: px2rem(28);
|
||||
color: #FFBB1D;
|
||||
line-height: 42px;
|
||||
// background: linear-gradient(0deg, #FFEB64 0%, #FFBB1D 65.5517578125%);
|
||||
// -webkit-background-clip: text;
|
||||
// -webkit-text-fill-color: transparent;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: px2rem(115);
|
||||
}
|
||||
|
||||
p {
|
||||
color: #FFFFFF;
|
||||
font-size: px2rem(24);
|
||||
font-weight: 500;
|
||||
margin-top: px2rem(35);
|
||||
margin-bottom: px2rem(18);
|
||||
.gold {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-family: PingFang SC;
|
||||
font-weight: bold;
|
||||
font-size: px2rem(40);
|
||||
color: #FFBB1D;
|
||||
line-height: 42px;
|
||||
// background: linear-gradient(0deg, #FFEB64 0%, #FFBB1D 65.5517578125%);
|
||||
// -webkit-background-clip: text;
|
||||
// -webkit-text-fill-color: transparent;
|
||||
position: absolute;
|
||||
top: px2rem(167);
|
||||
left: 0;
|
||||
|
||||
b {
|
||||
vertical-align: middle;
|
||||
margin-right: px2rem(10);
|
||||
}
|
||||
|
||||
span {
|
||||
color: #fff;
|
||||
font-size: px2rem(28);
|
||||
font-weight: 400;
|
||||
img {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: px2rem(38);
|
||||
height: px2rem(38);
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: px2rem(44);
|
||||
height: px2rem(44);
|
||||
.tab {
|
||||
width: px2rem(650);
|
||||
height: px2rem(134);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: px2rem(224) auto px2rem(20);
|
||||
|
||||
div {
|
||||
width: px2rem(305);
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
background: url(../images/tab.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
p {
|
||||
color: #EDEDED;
|
||||
font-size: px2rem(22);
|
||||
font-weight: 500;
|
||||
margin-top: px2rem(61);
|
||||
margin-bottom: px2rem(0);
|
||||
}
|
||||
|
||||
span {
|
||||
color: #fff;
|
||||
font-size: px2rem(28);
|
||||
font-weight: 400;
|
||||
|
||||
img {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: px2rem(38);
|
||||
height: px2rem(38);
|
||||
filter: grayscale(100%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.act {
|
||||
background: url(../images/tabAct.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
p {
|
||||
color: #FEFF7B;
|
||||
}
|
||||
|
||||
span {
|
||||
color: #FFDD3D;
|
||||
|
||||
img {
|
||||
filter: grayscale(0%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.act {
|
||||
background: url(../images/tabAct.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
.sTab {
|
||||
width: px2rem(660);
|
||||
height: px2rem(72);
|
||||
line-height: px2rem(72);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 0 auto px2rem(0);
|
||||
|
||||
p {
|
||||
margin-top: px2rem(27);
|
||||
div {
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
color: #F9FFC1;
|
||||
font-size: px2rem(21);
|
||||
font-weight: 400;
|
||||
background: url(../images/sTab2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.tab1 {
|
||||
background: url(../images/sTab1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #FEFF7B;
|
||||
}
|
||||
|
||||
.tab2 {
|
||||
background: url(../images/sTab1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #FEFF7B;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sTab {
|
||||
width: 100%;
|
||||
height: px2rem(60);
|
||||
line-height: px2rem(60);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 0 auto px2rem(0);
|
||||
|
||||
div {
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
color: #333333;
|
||||
font-size: px2rem(20);
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.tab1 {
|
||||
background: url(../images/sTab1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #FE3312;
|
||||
}
|
||||
|
||||
.tab2 {
|
||||
background: url(../images/sTab2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #FE3312;
|
||||
}
|
||||
}
|
||||
|
||||
.tableTitle {
|
||||
width: 99.9%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 0;
|
||||
position: absolute;
|
||||
top: 3.17rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
z-index: 2;
|
||||
background: #fff;
|
||||
|
||||
div {
|
||||
width: 25%;
|
||||
height: px2rem(50);
|
||||
line-height: px2rem(50);
|
||||
text-align: center;
|
||||
color: #333333;
|
||||
font-size: px2rem(20);
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
width: 100%;
|
||||
height: 7.4rem;
|
||||
margin: 0 auto 0;
|
||||
overflow-y: scroll;
|
||||
position: relative;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.top {
|
||||
width: 100%;
|
||||
.tableTitle {
|
||||
width: px2rem(660);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
top: 6.15rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
z-index: 2;
|
||||
// background: #fff;
|
||||
|
||||
div {
|
||||
width: 25%;
|
||||
height: px2rem(50);
|
||||
line-height: px2rem(50);
|
||||
text-align: center;
|
||||
color: #333333;
|
||||
font-size: px2rem(20);
|
||||
color: #FFB920;
|
||||
font-size: px2rem(22);
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
li {
|
||||
width: 100%;
|
||||
height: px2rem(50);
|
||||
margin-bottom: px2rem(18);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
ul {
|
||||
width: px2rem(660);
|
||||
height: 6rem;
|
||||
margin: 0 auto 0;
|
||||
overflow-y: scroll;
|
||||
position: relative;
|
||||
|
||||
&:nth-child(1) {
|
||||
margin-top: px2rem(50);
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
div {
|
||||
overflow: hidden;
|
||||
width: 25%;
|
||||
text-align: center;
|
||||
color: #666666;
|
||||
font-size: px2rem(18);
|
||||
font-weight: 400;
|
||||
line-height: px2rem(50);
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
.top {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
|
||||
img {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: px2rem(32);
|
||||
height: px2rem(32);
|
||||
div {
|
||||
width: 25%;
|
||||
height: px2rem(50);
|
||||
line-height: px2rem(50);
|
||||
text-align: center;
|
||||
color: #333333;
|
||||
font-size: px2rem(20);
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
li {
|
||||
width: 100%;
|
||||
height: px2rem(50);
|
||||
margin-bottom: px2rem(18);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
&:nth-child(1) {
|
||||
margin-top: px2rem(50);
|
||||
}
|
||||
|
||||
}
|
||||
div {
|
||||
overflow: hidden;
|
||||
width: 25%;
|
||||
text-align: center;
|
||||
color: #FFE67C;
|
||||
font-size: px2rem(18);
|
||||
font-weight: 400;
|
||||
line-height: px2rem(50);
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
.act {
|
||||
line-height: px2rem(0);
|
||||
img {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: px2rem(32);
|
||||
height: px2rem(32);
|
||||
}
|
||||
|
||||
p {
|
||||
margin-top: px2rem(15);
|
||||
margin-bottom: px2rem(23);
|
||||
}
|
||||
|
||||
.act {
|
||||
line-height: px2rem(0);
|
||||
|
||||
p {
|
||||
margin-top: px2rem(15);
|
||||
margin-bottom: px2rem(23);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -405,13 +501,24 @@ body {
|
||||
}
|
||||
|
||||
.rule {
|
||||
width: px2rem(690);
|
||||
height: px2rem(1418);
|
||||
border-radius: px2rem(20);
|
||||
border: px2rem(4) solid #FE7835;
|
||||
margin: 0 auto px2rem(40);
|
||||
width: px2rem(731);
|
||||
height: px2rem(1781);
|
||||
// border-radius: px2rem(20);
|
||||
// border: px2rem(4) solid #FE7835;
|
||||
margin: 0 auto px2rem(100);
|
||||
position: relative;
|
||||
background: #fff;
|
||||
// background: #fff;
|
||||
background: url(../images/ruleBoxBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
.ruleInfo {
|
||||
position: absolute;
|
||||
width: 1.9rem;
|
||||
height: 0.9rem;
|
||||
top: 1.9rem;
|
||||
right: 0;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.title {
|
||||
width: px2rem(320);
|
||||
@@ -437,6 +544,7 @@ body {
|
||||
margin: 0 auto px2rem(20);
|
||||
background: url(../images/rule1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
display: none;
|
||||
|
||||
h3 {
|
||||
width: 100%;
|
||||
@@ -517,8 +625,8 @@ body {
|
||||
height: px2rem(881);
|
||||
position: relative;
|
||||
margin: 0 auto px2rem(30);
|
||||
background: url(../images/rule2.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
// background: url(../images/rule2.png) no-repeat;
|
||||
// background-size: 100% 100%;
|
||||
|
||||
h3 {
|
||||
width: 100%;
|
||||
@@ -570,7 +678,7 @@ body {
|
||||
|
||||
.p1 {
|
||||
width: 100%;
|
||||
color: #FE3312;
|
||||
color: #FFB920;
|
||||
font-size: px2rem(20);
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
@@ -582,7 +690,7 @@ body {
|
||||
|
||||
.p2 {
|
||||
width: 100%;
|
||||
color: #FE3312;
|
||||
color: #FFB920;
|
||||
font-size: px2rem(20);
|
||||
font-weight: 500;
|
||||
position: absolute;
|
||||
@@ -619,13 +727,13 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: px2rem(342);
|
||||
top: 14.56rem;
|
||||
z-index: 2;
|
||||
|
||||
div {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #FF4627;
|
||||
color: #FFB920;
|
||||
font-size: px2rem(18);
|
||||
font-weight: 500;
|
||||
}
|
||||
@@ -640,13 +748,13 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: px2rem(405);
|
||||
top: 15.6rem;
|
||||
z-index: 2;
|
||||
|
||||
div {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #FF4627;
|
||||
color: #FFB920;
|
||||
font-size: px2rem(18);
|
||||
font-weight: 400;
|
||||
}
|
||||
@@ -661,13 +769,13 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 6.2rem;
|
||||
top: 16.4rem;
|
||||
z-index: 2;
|
||||
|
||||
div {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #FF4627;
|
||||
color: #FFB920;
|
||||
font-size: px2rem(18);
|
||||
font-weight: 400;
|
||||
}
|
||||
@@ -682,13 +790,13 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 6.95rem;
|
||||
top: 17.15rem;
|
||||
z-index: 2;
|
||||
|
||||
div {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #FF4627;
|
||||
color: #FFB920;
|
||||
font-size: px2rem(18);
|
||||
font-weight: 400;
|
||||
}
|
||||
@@ -703,13 +811,13 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 8.9rem;
|
||||
top: 19.8rem;
|
||||
z-index: 2;
|
||||
|
||||
div {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #FF4627;
|
||||
color: #FFB920;
|
||||
font-size: px2rem(18);
|
||||
font-weight: 500;
|
||||
}
|
||||
@@ -724,13 +832,13 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 9.8rem;
|
||||
top: 20.8rem;
|
||||
z-index: 2;
|
||||
|
||||
div {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #FF4627;
|
||||
color: #FFB920;
|
||||
font-size: px2rem(18);
|
||||
font-weight: 400;
|
||||
}
|
||||
@@ -745,13 +853,13 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 10.6rem;
|
||||
top: 21.7rem;
|
||||
z-index: 2;
|
||||
|
||||
div {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #FF4627;
|
||||
color: #FFB920;
|
||||
font-size: px2rem(18);
|
||||
font-weight: 400;
|
||||
}
|
||||
@@ -761,16 +869,16 @@ body {
|
||||
.wishingStar {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #333333;
|
||||
font-size: px2rem(18);
|
||||
color: #F1D793;
|
||||
font-size: px2rem(20);
|
||||
font-weight: 300;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: px2rem(30);
|
||||
bottom: -0.6rem;
|
||||
|
||||
b {
|
||||
color: #FE3312;
|
||||
color: #FFB920;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -811,20 +919,43 @@ body {
|
||||
}
|
||||
}
|
||||
|
||||
.otherRule {
|
||||
display: none;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background: rgba(0, 0, 0, .6);
|
||||
z-index: 3;
|
||||
|
||||
img {
|
||||
position: absolute;
|
||||
width: px2rem(731);
|
||||
height: px2rem(1056);
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
}
|
||||
|
||||
.openShare {
|
||||
position: fixed;
|
||||
left: px2rem(0);
|
||||
bottom: 6.2rem;
|
||||
width: px2rem(120);
|
||||
height: px2rem(34);
|
||||
line-height: px2rem(34);
|
||||
background: linear-gradient(180deg, #FFAD50 0%, #FE3111 100%);
|
||||
border-radius: 0px px2rem(17) px2rem(17) 0px;
|
||||
width: px2rem(150);
|
||||
height: px2rem(45);
|
||||
line-height: px2rem(45);
|
||||
background: linear-gradient(180deg, #FFE156 0%, #FF7C06 100%);
|
||||
// background: #FF7C06;
|
||||
border-radius: 0px px2rem(45) px2rem(45) 0px;
|
||||
border: px2rem(2) #FFF8B4 solid;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-size: px2rem(16);
|
||||
color: #89421A;
|
||||
font-size: px2rem(20);
|
||||
display: none;
|
||||
z-index: 3;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.code {
|
||||
@@ -834,7 +965,7 @@ body {
|
||||
background: url(../images/codeBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: px2rem(176);
|
||||
height: px2rem(237);
|
||||
height: px2rem(250);
|
||||
z-index: 3;
|
||||
|
||||
.rule_icon {
|
||||
@@ -853,8 +984,8 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-47%);
|
||||
top: px2rem(18);
|
||||
width: 100%;
|
||||
top: px2rem(30);
|
||||
width: 90%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@@ -865,7 +996,7 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-47%);
|
||||
top: px2rem(50);
|
||||
top: px2rem(75);
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
height: px2rem(24);
|
||||
@@ -890,7 +1021,7 @@ body {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-43%);
|
||||
top: px2rem(87);
|
||||
top: px2rem(105);
|
||||
}
|
||||
|
||||
.but {
|
||||
@@ -898,12 +1029,29 @@ body {
|
||||
height: px2rem(26);
|
||||
line-height: px2rem(26);
|
||||
border-radius: px2rem(26);
|
||||
background: #fff;
|
||||
// background: #fff;
|
||||
background: url(../images/shareButIcons.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
left: px2rem(38);
|
||||
bottom: px2rem(18);
|
||||
text-align: center;
|
||||
color: #000;
|
||||
font-size: px2rem(18);
|
||||
color: #89421A;
|
||||
}
|
||||
}
|
||||
.arabic{
|
||||
.bg .ul_pub .incomeBox .sTab div{
|
||||
font-size: px2rem(18);
|
||||
}
|
||||
.header .rule_rule{
|
||||
font-size: px2rem(20);
|
||||
text-indent: -10px;
|
||||
}
|
||||
.bg .rule .rule2 .table2_2{
|
||||
width: 9rem;
|
||||
}
|
||||
.bg .rule .rule2 .table1_3_div{
|
||||
font-size: px2rem(10);
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 6.1 KiB After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 3.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 67 KiB After Width: | Height: | Size: 3.5 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 46 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 16 KiB After Width: | Height: | Size: 158 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 197 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 142 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 540 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.7 KiB After Width: | Height: | Size: 79 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 75 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 688 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 697 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.9 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 461 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 506 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 499 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.8 KiB After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.8 KiB After Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 5.3 KiB After Width: | Height: | Size: 58 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 7.2 KiB After Width: | Height: | Size: 92 KiB |
@@ -1,6 +1,6 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<!-- dir="rtl" -->
|
||||
<!-- dir="rtl" -->
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
@@ -8,7 +8,7 @@
|
||||
<title id="title"></title>
|
||||
<!-- 邀請得金幣 -->
|
||||
<link rel="stylesheet" href="../../common/css/reset.css">
|
||||
<link rel="stylesheet" href="./css/index.css">
|
||||
<link rel="stylesheet" href="./css/index.css?v=1.0">
|
||||
</head>
|
||||
|
||||
<body id="body" style="display: none;">
|
||||
@@ -19,7 +19,7 @@
|
||||
<!-- 頭部 -->
|
||||
<div class="header">
|
||||
<img id="img1" src="./images/header_h3.png" alt="" class="h3">
|
||||
<a href="#rule"><img id="img2" src="./images/rule_rule.png" alt="" class="rule_rule"></a>
|
||||
<div class="rule_rule text67"></div>
|
||||
<div id="text1" class="text"></div>
|
||||
<!-- <img src="./images/gold.png" alt=""> -->
|
||||
</div>
|
||||
@@ -30,8 +30,12 @@
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<p id="text2"></p>
|
||||
<b class="invitationCode"></b>
|
||||
<div class="skip"><img src="./images/skip.png" alt=""> <b id="text3"></b></div>
|
||||
<div class="copy" id="copy"><img src="./images/copy.png" alt=""> <b id="text4"></b></div>
|
||||
<div class="skip img5" >
|
||||
<!-- <img src="./images/skip.png" alt=""> <b id="text3"></b> -->
|
||||
</div>
|
||||
<div class="copy img6" id="copy">
|
||||
<!-- <img src="./images/copy.png" alt=""> <b id="text4"></b> -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- 我的收益 -->
|
||||
<div class="myIncome">
|
||||
@@ -40,33 +44,39 @@
|
||||
<b>0</b>
|
||||
</div>
|
||||
<!-- 收益tab -->
|
||||
<div class="incomeBox">
|
||||
<!-- 大tab切換 -->
|
||||
<div class="tab">
|
||||
<div class="act directProfit">
|
||||
<p id="text6"></p>
|
||||
<span><img src="./images/gold.png" alt=""> 0</span>
|
||||
|
||||
<div class="ul_pub">
|
||||
<div class="incomeBox">
|
||||
<div class="close"></div>
|
||||
<!-- 我的收益 -->
|
||||
<h3 id="texts5"></h3>
|
||||
<div class="gold"><b>0</b><img src="./images/gold.png" alt=""></div>
|
||||
<!-- 大tab切換 -->
|
||||
<div class="tab">
|
||||
<div class="act directProfit">
|
||||
<p id="text6"></p>
|
||||
<span><img src="./images/gold.png" alt=""> 0</span>
|
||||
</div>
|
||||
<div class="indirectProfit">
|
||||
<p id="text7"></p>
|
||||
<span><img src="./images/gold.png" alt=""> 0</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="indirectProfit">
|
||||
<p id="text7"></p>
|
||||
<span><img src="./images/gold.png" alt=""> 0</span>
|
||||
<!-- 小tab切換 -->
|
||||
<div class="sTab">
|
||||
<div class="tab1" id="text8"></div>
|
||||
<div class="" id="text9"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 小tab切換 -->
|
||||
<div class="sTab">
|
||||
<div class="tab1" id="text8"></div>
|
||||
<div class="" id="text9"></div>
|
||||
</div>
|
||||
<!-- 記錄標題 -->
|
||||
<div class="tableTitle">
|
||||
<div id="text10"></div>
|
||||
<div id="text11"></div>
|
||||
<div id="text12"></div>
|
||||
<div id="text13"></div>
|
||||
</div>
|
||||
<!-- 記錄 -->
|
||||
<ul>
|
||||
<!-- <li class="top">
|
||||
<!-- 記錄標題 -->
|
||||
<div class="tableTitle">
|
||||
<div id="text10"></div>
|
||||
<div id="text11"></div>
|
||||
<div id="text12"></div>
|
||||
<div id="text13"></div>
|
||||
</div>
|
||||
<!-- 記錄 -->
|
||||
<ul>
|
||||
<!-- <li class="top">
|
||||
<div>時間</div>
|
||||
<div>收益</div>
|
||||
<div>收益類型</div>
|
||||
@@ -85,11 +95,13 @@
|
||||
<b>ID:0</b>
|
||||
</div>
|
||||
</li> -->
|
||||
</ul>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 活動規則 -->
|
||||
<div class="rule" id="rule">
|
||||
<div class="title" id="text14"></div>
|
||||
<div class="rule img7" id="rule">
|
||||
<div class="ruleInfo"></div>
|
||||
<!-- <div class="title" id="text14"></div> -->
|
||||
<div class="rule1">
|
||||
<h3 id="text15"></h3>
|
||||
<div class="text1" id="text16"></div>
|
||||
@@ -99,15 +111,15 @@
|
||||
<span class="sp2">+1000 <img src="./images/gold.png" alt="" class="diamond"></span>
|
||||
</div>
|
||||
<div class="rule2">
|
||||
<h3 id="text18"></h3>
|
||||
<div class="text1" id="text19"></div>
|
||||
<!-- <h3 id="text18"></h3> -->
|
||||
<!-- <div class="text1" id="text19"></div>
|
||||
<div class="text2" id="text20"></div>
|
||||
<div class="text3" id="text21"></div>
|
||||
<img id="img4" src="./images/rule_2in.png" alt="" class="rule_2in">
|
||||
<p class="p1" id="text22"></p>
|
||||
<p class="p2" id="text23"></p>
|
||||
<img src="./images/table1.png" alt="" class="table1">
|
||||
<img src="./images/table2.png" alt="" class="table2">
|
||||
<div class="text3" id="text21"></div> -->
|
||||
<!-- <img id="img4" src="./images/rule_2in.png" alt="" class="rule_2in"> -->
|
||||
<!-- <p class="p1" id="text22"></p>
|
||||
<p class="p2" id="text23"></p> -->
|
||||
<!-- <img src="./images/table1.png" alt="" class="table1">
|
||||
<img src="./images/table2.png" alt="" class="table2"> -->
|
||||
<!-- <div class="table1_1">
|
||||
<div id="text24">1</div>
|
||||
<div id="text25">2</div>
|
||||
@@ -170,10 +182,23 @@
|
||||
<div class="wishingStar" id="text28"></b></a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 其他說明 -->
|
||||
<div class="otherNotes" id="text29"></div>
|
||||
<ul id="text30">
|
||||
<!-- <li class="title">關於邀請獎勵結算</li>
|
||||
</div>
|
||||
<!-- 展開分享 -->
|
||||
<div class="openShare" id="text31"></div>
|
||||
<!-- 保存二維碼 -->
|
||||
<div class="code">
|
||||
<div class="rule_icon"></div>
|
||||
<div class="p1" id="text32"></div>
|
||||
<div class="p2" id="text33"></div>
|
||||
<img src="" alt="" class="codeImg">
|
||||
<div class="but" id="text34"></div>
|
||||
</div>
|
||||
<!-- 其他說明 -->
|
||||
<div style="display: none;" class="otherNotes" id="text29"></div>
|
||||
<div class="otherRule">
|
||||
<img class="img8" src="./images/rule_inNew.png" alt="">
|
||||
<!-- <ul style="display: none;" id="text30"> -->
|
||||
<!-- <li class="title">關於邀請獎勵結算</li>
|
||||
<li>1.被邀用戶收益：新用戶填寫邀請碼後繫統自動發放權益至所屬賬號</li>
|
||||
<li>2.邀請用戶收益：被邀新用戶填寫邀請碼後繫統自動發放權益至所屬賬號</li>
|
||||
<li>3.充值獎勵：僅統計直接充值數據；新用戶自填寫邀請碼30日內完成首充，可獲得魔法棒獎勵，魔法棒可用於參與許願之星玩法，獲取珍稀禮物獎勵；完成指定數額充值，邀請人可獲得額外收益，收益實時到賬；</li>
|
||||
@@ -187,17 +212,6 @@
|
||||
<li>2.本活動最終解釋權歸官方所有，並與Apple inc/Google公司無關；</li> -->
|
||||
</ul>
|
||||
</div>
|
||||
<!-- 展開分享 -->
|
||||
<div class="openShare" id="text31"></div>
|
||||
<!-- 保存二維碼 -->
|
||||
<div class="code">
|
||||
<div class="rule_icon"></div>
|
||||
<div class="p1" id="text32"></div>
|
||||
<div class="p2" id="text33"></div>
|
||||
<img src="" alt="" class="codeImg">
|
||||
<div class="but" id="text34"></div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</script>
|
||||
|
||||
@@ -212,5 +226,5 @@
|
||||
<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="./js/index.js?v=1.0"></script>
|
||||
<script src="../../common/local/langHandler.js"></script>
|
||||
@@ -76,6 +76,7 @@ function translateFun() {
|
||||
$('#text3').html(langReplace(localLang.demoModule.text3));
|
||||
$('#text4').html(langReplace(localLang.demoModule.text4));
|
||||
$('#text5').html(langReplace(localLang.demoModule.text5));
|
||||
$('#texts5').html(langReplace(localLang.demoModule.texts5));
|
||||
$('#text6').html(langReplace(localLang.demoModule.text6));
|
||||
$('#text7').html(langReplace(localLang.demoModule.text7));
|
||||
$('#text8').html(langReplace(localLang.demoModule.text8));
|
||||
@@ -106,10 +107,15 @@ function translateFun() {
|
||||
$('#text33').html(langReplace(localLang.demoModule.text33));
|
||||
$('#text34').html(langReplace(localLang.demoModule.text34));
|
||||
$('#text66').html(langReplace(localLang.demoModule.text66));
|
||||
$('.text67').text(langReplace(localLang.demoModule.text67));
|
||||
$('#img1').attr('src', langReplace(localLang.demoModule.img1))
|
||||
$('#img2').attr('src', langReplace(localLang.demoModule.img2))
|
||||
$('#img3').attr('src', langReplace(localLang.demoModule.img3))
|
||||
$('#img4').attr('src', langReplace(localLang.demoModule.img4))
|
||||
$('.img5').attr('style', langReplace(localLang.demoModule.img5))
|
||||
$('.img6').attr('style', langReplace(localLang.demoModule.img6))
|
||||
$('.img7').attr('style', langReplace(localLang.demoModule.img7))
|
||||
$('.img8').attr('src', langReplace(localLang.demoModule.img8))
|
||||
}
|
||||
// 獲取配置接口
|
||||
function getConfig() {
|
||||
@@ -184,6 +190,7 @@ function getMySelf() {
|
||||
});
|
||||
$('.bg .myInfo .invitationCode').text(inviteCode);
|
||||
$('.bg .myIncome b').text(res.data.totalProfit);
|
||||
$('.bg .ul_pub .incomeBox .gold b').text(res.data.totalProfit);
|
||||
$('.bg .incomeBox .tab .directProfit span').html(`<img src="./images/gold.png" alt=""> ${res.data.directProfit}`);
|
||||
$('.bg .incomeBox .tab .indirectProfit span').html(`<img src="./images/gold.png" alt=""> ${res.data.indirectProfit}`);
|
||||
$('.code .codeImg').attr('src', res.data.qRCodeUrl);
|
||||
@@ -441,3 +448,23 @@ function userPage() {
|
||||
}
|
||||
})
|
||||
}
|
||||
// 打开规则弹窗
|
||||
$('.bg .rule .ruleInfo').click(function () {
|
||||
$('.otherRule').show();
|
||||
bodyScroolFun(true);
|
||||
})
|
||||
// 关闭规则弹窗
|
||||
$('.otherRule').click(function () {
|
||||
$('.otherRule').hide();
|
||||
bodyScroolFun(false);
|
||||
})
|
||||
// 打开收益弹窗
|
||||
$('.header .rule_rule').click(function(){
|
||||
$('.bg .ul_pub').show();
|
||||
bodyScroolFun(true);
|
||||
})
|
||||
// 关闭收益弹窗
|
||||
$('.bg .ul_pub .incomeBox .close').click(function(){
|
||||
$('.bg .ul_pub').hide();
|
||||
bodyScroolFun(false);
|
||||
})
|
||||
@@ -122,15 +122,13 @@ function get() {
|
||||
})
|
||||
}
|
||||
$('.box .xz').click(function () {
|
||||
// if (browser.ios) {
|
||||
// window.location.href = `https://cebg.t4m.cn/`
|
||||
// }
|
||||
if (browser.ios) {
|
||||
window.location.href = `https://cebg.t4m.cn/`
|
||||
return
|
||||
} else if (browser.android) {
|
||||
console.log('安卓');
|
||||
timer = setTimeout(() => {
|
||||
// window.location.href = 'https://www.baidu.com/'
|
||||
window.location.href = 'http://play.google.com/store/apps/details?id=com.hhchu.molistar'
|
||||
}, 3000)
|
||||
window.location.href = `molistar://app/invite?code=${inviteCode}`
|
||||
} else {
|
||||
|
||||
@@ -2,16 +2,17 @@
|
||||
langAr = {
|
||||
// 模块
|
||||
demoModule: {
|
||||
img1:`./images/header_h3-ar.png`,
|
||||
img2:`./images/rule_rule-ar.png`,
|
||||
img3:`./images/rule1_in-ar.png`,
|
||||
img4:`./images/rule_2in-ar.png`,
|
||||
img1: `./images/header_h3-ar.png`,
|
||||
img2: `./images/rule_rule-ar.png`,
|
||||
img3: `./images/rule1_in-ar.png`,
|
||||
img4: `./images/rule_2in-ar.png`,
|
||||
title: `دعوة لكسب النقود`,
|
||||
text1: `احصل على <b>1000</b> نقطة لكل دعوة`,
|
||||
text1: ` احصل على <b>1000</b> <img src="./images/gold.png" alt=""> نقطة لكل دعوة`,
|
||||
text2: `رمز الدعوة`,
|
||||
text3: `مشاركة مع الأصدقاء`,
|
||||
text4: `نسخ رمز الدعوة`,
|
||||
text5: `أرباحي`,
|
||||
texts5: `أرباحي`,
|
||||
text6: `أرباح الدعوة المباشرة`,
|
||||
text7: `أرباح الدعوة غير المباشرة`,
|
||||
text8: `سجل أرباح الدعوة المباشرة`,
|
||||
@@ -86,11 +87,11 @@ langAr = {
|
||||
</div>
|
||||
<div class="table1_2">
|
||||
<div>الشحن <10000</div>
|
||||
<div style="line-height: 0.4rem;">المستخدم المدعو مباشرة +2 عصا سحرية، أنت +1 عصا سحرية</div>
|
||||
<div style="line-height: 0.4rem;">سيحصل المدعو المباشر علي ٢ عصا سحرية,وستحصل أنت علي ١ عصا سحرية</div>
|
||||
</div>
|
||||
<div class="table1_3">
|
||||
<div>10000 ≤ الشحن <50000</div>
|
||||
<div style="line-height: 0.4rem;">عن كل 1000 شحن من قبل المستخدم المدعو مباشرة، أنت +30 (3.00%)</div>
|
||||
<div class="table1_3_div" style="line-height: 0.4rem;">في كل مرة سيشحن المدعو المباشر 1000 عملة ذهبية ستحصل انت علي مكافأة 30 عملة أي(3٪)</div>
|
||||
</div>
|
||||
<div class="table1_4">
|
||||
<div>الشحن ≥50000 </div>
|
||||
@@ -102,12 +103,18 @@ langAr = {
|
||||
</div>
|
||||
<div class="table2_2">
|
||||
<div>10000 ≤ الشحن <50000</div>
|
||||
<div style="line-height: 0.4rem;">عن كل 1000 شحن من قبل المستخدم المدعو غير المباشر، أنت +10 (1.00%)</div>
|
||||
<div style="line-height: 0.4rem;" class="table1_3_div">في كل مرة سيشحن المدعو الغير المباشر 1000 عملة ذهبية ستحصل انت علي مكافأة ١٠ عملات ذهبية أي(١٪)</div>
|
||||
</div>
|
||||
<div class="table2_3">
|
||||
<div>الشحن ≥50000</div>
|
||||
<div style="line-height: 0.34rem;">عن كل 1000 شحن من قبل المستخدم المدعو غير المباشر، أنت +20 (2.00%)</div>
|
||||
<div style="line-height: 0.34rem;" class="table1_3_div">في كل مرة سيشحن المدعو الغير المباشر 1000 عملة ذهبية ستحصل انت علي مكافأة ٢٠ عملة ذهبية أي(٢٪)</div>
|
||||
</div>`,
|
||||
|
||||
text67: `تفاصيل الأرباح`,
|
||||
img5: `background: url(./images/myInfoBut-ar.png) no-repeat;background-size: 100% 100%;`,
|
||||
img6: `background: url(./images/myInfoBut2-ar.png) no-repeat;background-size: 100% 100%;`,
|
||||
img7: `background: url(./images/ruleBoxBg-ar.png) no-repeat;background-size: 100% 100%;`,
|
||||
img8: `./images/rule_inNew-ar.png`,
|
||||
},
|
||||
share: {
|
||||
img1: `background: url(./images/share/header-ar.png) no-repeat;background-size: 100% 100%;`,
|
||||
|
||||
@@ -2,16 +2,17 @@
|
||||
langEn = {
|
||||
// 模块
|
||||
demoModule: {
|
||||
img1:`./images/header_h3-en.png`,
|
||||
img2:`./images/rule_rule-en.png`,
|
||||
img3:`./images/rule1_in-en.png`,
|
||||
img4:`./images/rule_2in-en.png`,
|
||||
img1: `./images/header_h3-en.png`,
|
||||
img2: `./images/rule_rule-en.png`,
|
||||
img3: `./images/rule1_in-en.png`,
|
||||
img4: `./images/rule_2in-en.png`,
|
||||
title: `Invite to Earn Coins`,
|
||||
text1: `Get <b>1000</b> coins for each invitation`,
|
||||
text1: `Get <b>1000</b> <img src="./images/gold.png" alt=""> for each invitation `,
|
||||
text2: `My Code`,
|
||||
text3: `Share with Friends`,
|
||||
text4: `Copy Invitation Code`,
|
||||
text5: ` Earnings`,
|
||||
texts5: ` Earnings`,
|
||||
text6: `Direct Invitation Earnings`,
|
||||
text7: `Indirect Invitation Earnings`,
|
||||
text8: `Direct Invitation Earnings Record`,
|
||||
@@ -108,6 +109,11 @@ langEn = {
|
||||
<div>Top-Up ≥50000</div>
|
||||
<div style="line-height: 0.34rem;">For every 1000 top-up by Indirectly Invited User, You +20 (2.00%)</div>
|
||||
</div>`,
|
||||
text67: `Profit `,
|
||||
img5: `background: url(./images/myInfoBut-en.png) no-repeat;background-size: 100% 100%;`,
|
||||
img6: `background: url(./images/myInfoBut2-en.png) no-repeat;background-size: 100% 100%;`,
|
||||
img7: `background: url(./images/ruleBoxBg-en.png) no-repeat;background-size: 100% 100%;`,
|
||||
img8: `./images/rule_inNew-en.png`,
|
||||
},
|
||||
share: {
|
||||
img1: `background: url(./images/share/header-en.png) no-repeat;background-size: 100% 100%;`,
|
||||
|
||||
@@ -7,11 +7,12 @@ langZh = {
|
||||
img3: `./images/rule1_in.png`,
|
||||
img4: `./images/rule_2in.png`,
|
||||
title: `邀請得金幣`,
|
||||
text1: `每邀請一人得 <b>1000</b> `,
|
||||
text1: `每邀請一人得 <b>1000</b>金幣 <img src="./images/gold.png" alt="">`,
|
||||
text2: `我的邀請碼`,
|
||||
text3: `分享邀請好友`,
|
||||
text4: `複製邀請碼`,
|
||||
text5: `我的收益`,
|
||||
texts5: `我的收益`,
|
||||
text6: `直接邀請收益`,
|
||||
text7: `間接邀請收益`,
|
||||
text8: `直接邀請收益記錄`,
|
||||
@@ -111,6 +112,11 @@ langZh = {
|
||||
<div>儲值≥50000</div>
|
||||
<div style="line-height: 0.34rem;">間接邀請對象每儲值1000，妳+20（2.00%）</div>
|
||||
</div>`,
|
||||
text67: `收益明細`,
|
||||
img5: `background: url(./images/myInfoBut.png) no-repeat;background-size: 100% 100%;`,
|
||||
img6: `background: url(./images/myInfoBut2.png) no-repeat;background-size: 100% 100%;`,
|
||||
img7: `background: url./images/ruleBoxBg.png) no-repeat;background-size: 100% 100%;`,
|
||||
img7: `./images/rule_inNew.png`,
|
||||
},
|
||||
share: {
|
||||
img1: `background: url(./images/share/header.png) no-repeat;background-size: 100% 100%;`,
|
||||
|
||||
214
view/molistar/activity/2024-loginGift/css/index.css
Normal file
214
view/molistar/activity/2024-loginGift/css/index.css
Normal file
@@ -0,0 +1,214 @@
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
background: #E1E7FE;
|
||||
}
|
||||
|
||||
.back {
|
||||
position: fixed;
|
||||
top: 0.93333rem;
|
||||
left: 0.45333rem;
|
||||
z-index: 99;
|
||||
width: 0.82667rem;
|
||||
height: 0.82667rem;
|
||||
}
|
||||
|
||||
.back img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.back p {
|
||||
color: #fff;
|
||||
font-size: 0.42667rem;
|
||||
position: absolute;
|
||||
width: 9rem;
|
||||
left: 0;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
line-height: 0.82667rem;
|
||||
}
|
||||
|
||||
.header {
|
||||
width: 10rem;
|
||||
height: 11.70667rem;
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
background: url(../images/header.png) no-repeat 100% 100%;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.header .hader_title {
|
||||
width: 10rem;
|
||||
height: 14rem;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 0.85333rem;
|
||||
}
|
||||
|
||||
.box1 {
|
||||
width: 9.90667rem;
|
||||
height: 17.10667rem;
|
||||
background: url(../images/box1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
margin: -1.2rem auto 0rem;
|
||||
}
|
||||
|
||||
.box1 .signInIcon {
|
||||
width: 2.05333rem;
|
||||
height: 1.64rem;
|
||||
position: absolute;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.box1 .signInIcon1 {
|
||||
left: 0.86667rem;
|
||||
bottom: 10.69333rem;
|
||||
}
|
||||
|
||||
.box1 .signInIcon2 {
|
||||
left: 4.04rem;
|
||||
bottom: 12.42667rem;
|
||||
}
|
||||
|
||||
.box1 .signInIcon3 {
|
||||
left: 6.93333rem;
|
||||
bottom: 10.69333rem;
|
||||
}
|
||||
|
||||
.box1 .signInIcon4 {
|
||||
left: 0.93333rem;
|
||||
bottom: 5.93333rem;
|
||||
}
|
||||
|
||||
.box1 .signInIcon5 {
|
||||
left: 3.92rem;
|
||||
bottom: 8.18667rem;
|
||||
}
|
||||
|
||||
.box1 .signInIcon6 {
|
||||
left: 7rem;
|
||||
bottom: 5.92rem;
|
||||
}
|
||||
|
||||
.box1 .signInIcon7 {
|
||||
left: 3.92rem;
|
||||
bottom: 3.52rem;
|
||||
}
|
||||
|
||||
.box1 .signInIconActive {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.box1 .butBox {
|
||||
width: 7.6rem;
|
||||
height: 1.33333rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 1.33333rem;
|
||||
}
|
||||
|
||||
.box1 .butBox img {
|
||||
width: 3.70667rem;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.box2 {
|
||||
width: 9.77333rem;
|
||||
height: 8.41333rem;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.box3 {
|
||||
width: 9.77333rem;
|
||||
height: 15.45333rem;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.box4 {
|
||||
width: 9.77333rem;
|
||||
height: 5.44rem;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.pub {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background: rgba(0, 0, 0, 0.6);
|
||||
z-index: 999;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.pub .pub_in {
|
||||
width: 9.88rem;
|
||||
height: 10.82667rem;
|
||||
background: url(../images/bg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.pub .pub_in .box {
|
||||
width: 7rem;
|
||||
height: 4rem;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 3.4rem;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.pub .pub_in .box div {
|
||||
width: 1.98667rem;
|
||||
height: 2.26667rem;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.pub .pub_in .box div img {
|
||||
width: 1.98667rem;
|
||||
height: 1.98667rem;
|
||||
display: block;
|
||||
margin-bottom: 0.15rem;
|
||||
}
|
||||
|
||||
.pub .pub_in .box div .CHATBUBBLE {
|
||||
width: 2.2rem;
|
||||
height: 0.9rem;
|
||||
margin-top: .7rem;
|
||||
}
|
||||
|
||||
.pub .pub_in .box div p {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-size: 0.22667rem;
|
||||
position: absolute;
|
||||
bottom: 0rem;
|
||||
}
|
||||
|
||||
.pub .pub_in .but {
|
||||
width: 6rem;
|
||||
height: 1rem;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 2.2rem;
|
||||
}
|
||||
225
view/molistar/activity/2024-loginGift/css/index.scss
Normal file
225
view/molistar/activity/2024-loginGift/css/index.scss
Normal file
@@ -0,0 +1,225 @@
|
||||
@function px2rem($px) {
|
||||
@return $px / 75+rem;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
background: #E1E7FE;
|
||||
}
|
||||
|
||||
.back {
|
||||
position: fixed;
|
||||
top: px2rem(70);
|
||||
left: px2rem(34);
|
||||
z-index: 99;
|
||||
width: px2rem(62);
|
||||
height: px2rem(62);
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
p {
|
||||
color: #fff;
|
||||
font-size: px2rem(32);
|
||||
position: absolute;
|
||||
width: 9rem;
|
||||
left: 0;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
line-height: px2rem(62);
|
||||
}
|
||||
}
|
||||
|
||||
.header {
|
||||
width: px2rem(750);
|
||||
height: px2rem(878);
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
background: url(../images/header.png) no-repeat 100% 100%;
|
||||
background-size: 100% 100%;
|
||||
|
||||
.hader_title {
|
||||
width: px2rem(750);
|
||||
height: px2rem(1050);
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: px2rem(64);
|
||||
}
|
||||
}
|
||||
|
||||
.box1 {
|
||||
width: px2rem(743);
|
||||
height: px2rem(1283);
|
||||
background: url(../images/box1.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
margin: -1.2rem auto px2rem(0);
|
||||
|
||||
.signInIcon {
|
||||
width: px2rem(154);
|
||||
height: px2rem(123);
|
||||
position: absolute;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.signInIcon1 {
|
||||
left: px2rem(65);
|
||||
bottom: px2rem(802);
|
||||
}
|
||||
|
||||
.signInIcon2 {
|
||||
left: px2rem(303);
|
||||
bottom: px2rem(932);
|
||||
}
|
||||
|
||||
.signInIcon3 {
|
||||
left: px2rem(520);
|
||||
bottom: px2rem(802);
|
||||
}
|
||||
|
||||
.signInIcon4 {
|
||||
left: px2rem(70);
|
||||
bottom: px2rem(445);
|
||||
}
|
||||
|
||||
.signInIcon5 {
|
||||
left: px2rem(294);
|
||||
bottom: px2rem(614);
|
||||
}
|
||||
|
||||
.signInIcon6 {
|
||||
left: px2rem(525);
|
||||
bottom: px2rem(444);
|
||||
}
|
||||
|
||||
.signInIcon7 {
|
||||
left: px2rem(294);
|
||||
bottom: px2rem(264);
|
||||
}
|
||||
|
||||
.signInIconActive {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.butBox {
|
||||
width: px2rem(570);
|
||||
height: px2rem(100);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: px2rem(100);
|
||||
|
||||
img {
|
||||
width: px2rem(278);
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.box2 {
|
||||
width: px2rem(733);
|
||||
height: px2rem(631);
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.box3 {
|
||||
width: px2rem(733);
|
||||
height: px2rem(1159);
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.box4 {
|
||||
width: px2rem(733);
|
||||
height: px2rem(408);
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.pub {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background: rgba(0, 0, 0, .6);
|
||||
z-index: 999;
|
||||
display: none;
|
||||
|
||||
.pub_in {
|
||||
width: px2rem(741);
|
||||
height: px2rem(812);
|
||||
background: url(../images/bg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
|
||||
.box {
|
||||
width: 7rem;
|
||||
height: 4rem;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 3.4rem;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
|
||||
div {
|
||||
width: px2rem(149);
|
||||
height: px2rem(170);
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
img {
|
||||
width: px2rem(149);
|
||||
height: px2rem(149);
|
||||
display: block;
|
||||
// border-radius: 50%;
|
||||
margin-bottom: 0.15rem;
|
||||
}
|
||||
|
||||
.HEADWEAR {
|
||||
// width: 2rem;
|
||||
// height: 1rem;
|
||||
}
|
||||
|
||||
.CHATBUBBLE {
|
||||
width: 2.2rem;
|
||||
height: 0.9rem;
|
||||
margin-top: .7rem;
|
||||
}
|
||||
|
||||
p {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-size: px2rem(17);
|
||||
position: absolute;
|
||||
bottom: 0rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.but {
|
||||
width: 6rem;
|
||||
height: 1rem;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 2.2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
BIN
view/molistar/activity/2024-loginGift/images/bg.png
Normal file
BIN
view/molistar/activity/2024-loginGift/images/bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 345 KiB |
BIN
view/molistar/activity/2024-loginGift/images/box1.png
Normal file
BIN
view/molistar/activity/2024-loginGift/images/box1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.0 MiB |
BIN
view/molistar/activity/2024-loginGift/images/box2.png
Normal file
BIN
view/molistar/activity/2024-loginGift/images/box2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 990 KiB |
BIN
view/molistar/activity/2024-loginGift/images/box3.png
Normal file
BIN
view/molistar/activity/2024-loginGift/images/box3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 MiB |
BIN
view/molistar/activity/2024-loginGift/images/box4.png
Normal file
BIN
view/molistar/activity/2024-loginGift/images/box4.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 560 KiB |
BIN
view/molistar/activity/2024-loginGift/images/hader_title.png
Normal file
BIN
view/molistar/activity/2024-loginGift/images/hader_title.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
BIN
view/molistar/activity/2024-loginGift/images/header.png
Normal file
BIN
view/molistar/activity/2024-loginGift/images/header.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.4 MiB |
BIN
view/molistar/activity/2024-loginGift/images/logo.png
Normal file
BIN
view/molistar/activity/2024-loginGift/images/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
BIN
view/molistar/activity/2024-loginGift/images/notSignIn.png
Normal file
BIN
view/molistar/activity/2024-loginGift/images/notSignIn.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 56 KiB |
BIN
view/molistar/activity/2024-loginGift/images/notSignInR.png
Normal file
BIN
view/molistar/activity/2024-loginGift/images/notSignInR.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 49 KiB |
BIN
view/molistar/activity/2024-loginGift/images/signIn.png
Normal file
BIN
view/molistar/activity/2024-loginGift/images/signIn.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 64 KiB |
BIN
view/molistar/activity/2024-loginGift/images/signInImg.png
Normal file
BIN
view/molistar/activity/2024-loginGift/images/signInImg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 68 KiB |
BIN
view/molistar/activity/2024-loginGift/images/signInOut.png
Normal file
BIN
view/molistar/activity/2024-loginGift/images/signInOut.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 62 KiB |
BIN
view/molistar/activity/2024-loginGift/images/signInR.png
Normal file
BIN
view/molistar/activity/2024-loginGift/images/signInR.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 54 KiB |
BIN
view/molistar/activity/2024-loginGift/images/travel/back.png
Normal file
BIN
view/molistar/activity/2024-loginGift/images/travel/back.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
75
view/molistar/activity/2024-loginGift/index.html
Normal file
75
view/molistar/activity/2024-loginGift/index.html
Normal file
@@ -0,0 +1,75 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>百萬福利</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">
|
||||
<img src="./images/hader_title.png" alt="" class="hader_title">
|
||||
</div>
|
||||
<!-- 登入送好禮 -->
|
||||
<div class="box1">
|
||||
<!-- <img src="./images/signInImg.png" alt="" class="signInIcon"> -->
|
||||
<img src="./images/signInOut.png" alt="" class="signInIcon signInIcon1">
|
||||
<img src="./images/signInOut.png" alt="" class="signInIcon signInIcon2">
|
||||
<img src="./images/signInOut.png" alt="" class="signInIcon signInIcon3">
|
||||
<img src="./images/signInOut.png" alt="" class="signInIcon signInIcon4">
|
||||
<img src="./images/signInOut.png" alt="" class="signInIcon signInIcon5">
|
||||
<img src="./images/signInOut.png" alt="" class="signInIcon signInIcon6">
|
||||
<img src="./images/signInOut.png" alt="" class="signInIcon signInIcon7">
|
||||
<div class="butBox">
|
||||
<img src="./images/notSignInR.png" alt="" class="but1">
|
||||
<img src="./images/notSignIn.png" alt="" class="but2">
|
||||
</div>
|
||||
</div>
|
||||
<!-- 瘋狂動物園 -->
|
||||
<img src="./images/box2.png" alt="" class="box2">
|
||||
<!-- 許願之星 -->
|
||||
<img src="./images/box3.png" alt="" class="box3">
|
||||
<!-- 活動說明 -->
|
||||
<img src="./images/box4.png" alt="" class="box4">
|
||||
<!-- 弹窗 -->
|
||||
<div class="pub">
|
||||
<div class="pub_in">
|
||||
<div class="but"></div>
|
||||
<div class="box">
|
||||
<!-- <div>
|
||||
<img src="http://beta.img.pekolive.com/Fkswg1aPvJj8zruZNd0BHLxtFS4R?imageslim" alt="" class="">
|
||||
<p>奖励*x天</p>
|
||||
</div>
|
||||
<div>
|
||||
<img src="http://beta.img.pekolive.com/FldcxQ3WyJ1pcLJlg9McU5TZe1vP?imageslim" alt="" class="CHATBUBBLE">
|
||||
<p>奖励*x天</p>
|
||||
</div>
|
||||
<div>
|
||||
<img src="https://image.hfighting.com/69474adc-728a-4ba8-9a2e-da023ccc90d3" alt="" class="">
|
||||
<p>奖励*x天</p>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</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="./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>
|
||||
175
view/molistar/activity/2024-loginGift/js/index.js
Normal file
175
view/molistar/activity/2024-loginGift/js/index.js
Normal file
@@ -0,0 +1,175 @@
|
||||
let urlPrefix = getUrlPrefix()
|
||||
let browser = checkVersion()
|
||||
let env = EnvCheck();
|
||||
if (env == 'test') {
|
||||
new VConsole();
|
||||
}
|
||||
var langReplace;
|
||||
var localLang;
|
||||
// 封裝layer消息提醒框
|
||||
let layerIndex
|
||||
const showLoading = (content = '加載中...') => {
|
||||
layer.open({
|
||||
type: 2,
|
||||
shadeClose: false,
|
||||
content,
|
||||
success(e) {
|
||||
layerIndex = $(e).attr('index')
|
||||
}
|
||||
})
|
||||
}
|
||||
const hideLoading = (index) => {
|
||||
layer.close(index)
|
||||
}
|
||||
const toastMsg = (content = '操作完成', time = 2) => {
|
||||
layer.open({
|
||||
content,
|
||||
time,
|
||||
skin: 'msg'
|
||||
})
|
||||
}
|
||||
// 初始化函數
|
||||
$(function () {
|
||||
getInfoFromClient()
|
||||
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
|
||||
setTimeout(function () {
|
||||
// 頁面全屏
|
||||
if (browser.app) {
|
||||
if (browser.android) {
|
||||
window.androidJsObj.initShowNav(false)
|
||||
} else {
|
||||
window.webkit.messageHandlers.initShowNav.postMessage(0)
|
||||
}
|
||||
};
|
||||
// 頂部返回事件
|
||||
$('.back').click(() => {
|
||||
if (browser.android) {
|
||||
window.androidJsObj.closeWebView()
|
||||
} else {
|
||||
window.webkit.messageHandlers.closeWebView.postMessage(null)
|
||||
}
|
||||
})
|
||||
getTask();
|
||||
}, 100)
|
||||
})
|
||||
// 獲取任務接口
|
||||
function getTask() {
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'GEt',
|
||||
url: urlPrefix + '/activity/task/user',
|
||||
data: { componentCode: "DENG_LU_SONG_HAO_LI" },
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
res.data[0].children.forEach((val, i) => {
|
||||
// 處理icon簽到狀態
|
||||
if (val.referenceValue) {
|
||||
$(`.box1 .signInIcon${res.data[0].children.length - (i)}`).addClass('signInIconActive');
|
||||
$(`.box1 .signInIcon${res.data[0].children.length - (i)}`).attr('src', './images/signInOut.png');
|
||||
} else {
|
||||
$(`.box1 .signInIcon${res.data[0].children.length - (i)}`).removeClass('signInIconActive');
|
||||
if (val.completed) {
|
||||
$(`.box1 .signInIcon${res.data[0].children.length - (i)}`).addClass('signInIconActive');
|
||||
$(`.box1 .signInIcon${res.data[0].children.length - (i)}`).attr('src', './images/signInOut.png');
|
||||
} else {
|
||||
$(`.box1 .signInIcon${res.data[0].children.length - (i)}`).removeClass('signInIconActive');
|
||||
}
|
||||
}
|
||||
if (res.data[0].children[i].endTime <= res.timestamp && res.data[0].children[i].completed == false) {
|
||||
$(`.box1 .signInIcon${res.data[0].children.length - (i)}`).attr('src', './images/signInImg.png');
|
||||
$(`.box1 .signInIcon${res.data[0].children.length - (i)}`).show()
|
||||
}
|
||||
|
||||
});
|
||||
for (let index = 0; index < res.data[0].children.length; index++) {
|
||||
if (res.timestamp >= res.data[0].children[index].startTime && res.timestamp <= res.data[0].children[index].endTime) {
|
||||
// 处理签到icon
|
||||
if (res.data[0].children[index].completed) {
|
||||
$('.box1 .butBox .but2').attr('click', '0');
|
||||
$('.box1 .butBox .but2').attr('src', './images/notSignIn.png');
|
||||
} else {
|
||||
$('.box1 .butBox .but2').attr('click', '1');
|
||||
$('.box1 .butBox .but2').attr('src', './images/signIn.png');
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
break
|
||||
} else {
|
||||
$('.box1 .butBox .but2').attr('click', '0');
|
||||
$('.box1 .butBox .but2').attr('src', './images/notSignIn.png');
|
||||
}
|
||||
|
||||
}
|
||||
for (let index = 0; index < res.data[0].children.length; index++) {
|
||||
// 处理补签icon
|
||||
if (res.data[0].children[index].endTime <= res.timestamp && res.data[0].children[index].completed == false) {
|
||||
$('.box1 .butBox .but1').attr('click', '1');
|
||||
$('.box1 .butBox .but1').attr('src', './images/signInR.png');
|
||||
break
|
||||
} else {
|
||||
$('.box1 .butBox .but1').attr('click', '0');
|
||||
$('.box1 .butBox .but1').attr('src', './images/notSignInR.png');
|
||||
}
|
||||
}
|
||||
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
},
|
||||
error(err) {
|
||||
hideLoading(layerIndex)
|
||||
toastMsg('網絡錯誤，請退出重進')
|
||||
}
|
||||
})
|
||||
}
|
||||
// 簽到接口
|
||||
function signin() {
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'GEt',
|
||||
url: urlPrefix + '/act/signin/click',
|
||||
data: { activityCode: "ACT_2024_SIGN_IN" },
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
toastMsg('簽到成功');
|
||||
var str = '';
|
||||
res.data.forEach(res => {
|
||||
str += `
|
||||
<div>
|
||||
<img src="${res.rewardIcon}" alt="" class="${res.rewardType}">
|
||||
<p>${res.rewardName}*${res.expireDay}天</p>
|
||||
</div>
|
||||
`
|
||||
})
|
||||
$('.pub .pub_in .box').html(str);
|
||||
$('.pub').show();
|
||||
getTask();
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
},
|
||||
error(err) {
|
||||
hideLoading(layerIndex)
|
||||
toastMsg('網絡錯誤，請退出重進')
|
||||
}
|
||||
})
|
||||
}
|
||||
// 簽到按鈕
|
||||
$('.box1 .butBox .but2').click(function () {
|
||||
var bool = $(this).attr('click') == 1 ? true : false;
|
||||
if (bool) {
|
||||
signin();
|
||||
}
|
||||
})
|
||||
// 补签按鈕
|
||||
$('.box1 .butBox .but1').click(function () {
|
||||
var bool = $(this).attr('click') == 1 ? true : false;
|
||||
if (bool) {
|
||||
toastMsg('任意房間送出【PICK燈牌*1】即可完成補簽');
|
||||
}
|
||||
})
|
||||
// 关闭弹窗按鈕
|
||||
$('.pub .pub_in .but').click(function () {
|
||||
$('.pub').hide();
|
||||
})
|
||||
5
view/molistar/activity/2024-loginGift/local/ar.js
Normal file
5
view/molistar/activity/2024-loginGift/local/ar.js
Normal file
@@ -0,0 +1,5 @@
|
||||
// 阿拉伯
|
||||
langAr = {
|
||||
// 模块
|
||||
demoModule: {}
|
||||
}
|
||||
5
view/molistar/activity/2024-loginGift/local/en.js
Normal file
5
view/molistar/activity/2024-loginGift/local/en.js
Normal file
@@ -0,0 +1,5 @@
|
||||
// 英文
|
||||
langEn = {
|
||||
// 模块
|
||||
demoModule: {}
|
||||
}
|
||||
5
view/molistar/activity/2024-loginGift/local/zh.js
Normal file
5
view/molistar/activity/2024-loginGift/local/zh.js
Normal file
@@ -0,0 +1,5 @@
|
||||
// 中文
|
||||
langZh = {
|
||||
// 模塊
|
||||
demoModule: {}
|
||||
}
|
||||
512
view/molistar/activity/act-nameplate/css/index.css
Normal file
512
view/molistar/activity/act-nameplate/css/index.css
Normal file
@@ -0,0 +1,512 @@
|
||||
@font-face {
|
||||
font-family: 'pingfang-bold';
|
||||
src: url("../../../common/fonts/PingFang Bold.ttf");
|
||||
src: url("../../../common/fonts/PingFang Bold.ttf") format("woff"), url("../../../common/fonts/PingFang Bold.ttf") format("truetype"), url("../../../common/fonts/PingFang Bold.ttf") format("svg");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'pingfang-medium';
|
||||
src: url("../../../common/fonts/PingFang-Medium.ttf");
|
||||
src: url("../../../common/fonts/PingFang-Medium.ttf") format("woff"), url("../../../common/fonts/PingFang-Medium.ttf") format("truetype"), url("../../../common/fonts/PingFang-Medium.ttf") format("svg");
|
||||
}
|
||||
|
||||
.max {
|
||||
width: 10rem;
|
||||
height: 30.84rem;
|
||||
background: url("../images/max.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
font-family: 'pingfang-bold';
|
||||
}
|
||||
|
||||
.max .record {
|
||||
position: absolute;
|
||||
position: absolute;
|
||||
top: 5.9rem;
|
||||
right: 0;
|
||||
width: 1.5rem;
|
||||
height: 1.4rem;
|
||||
}
|
||||
|
||||
.max .record img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.max .btn {
|
||||
position: absolute;
|
||||
top: 15.8rem;
|
||||
left: 1.68rem;
|
||||
width: 2.53333rem;
|
||||
height: 1.01333rem;
|
||||
}
|
||||
|
||||
.max .btn.basics-receive {
|
||||
left: 5.6rem;
|
||||
}
|
||||
|
||||
.max .btn.advance-send {
|
||||
top: 22.34667rem;
|
||||
}
|
||||
|
||||
.max .btn.advance-receive {
|
||||
top: 22.34667rem;
|
||||
left: 5.6rem;
|
||||
}
|
||||
|
||||
.max .btn img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.max .shade-mask,
|
||||
.max .shade-mask-delay,
|
||||
.max .shade-mask-new {
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 9;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
|
||||
.max .shade-mask .shade-content,
|
||||
.max .shade-mask .shade-content-delay,
|
||||
.max .shade-mask .shade-content-new,
|
||||
.max .shade-mask-delay .shade-content,
|
||||
.max .shade-mask-delay .shade-content-delay,
|
||||
.max .shade-mask-delay .shade-content-new,
|
||||
.max .shade-mask-new .shade-content,
|
||||
.max .shade-mask-new .shade-content-delay,
|
||||
.max .shade-mask-new .shade-content-new {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 9.28rem;
|
||||
height: 8.18667rem;
|
||||
background: url("../images/select-bg.png") no-repeat 0 0/100% 100%;
|
||||
}
|
||||
|
||||
.max .shade-mask .shade-content .top,
|
||||
.max .shade-mask .shade-content-delay .top,
|
||||
.max .shade-mask .shade-content-new .top,
|
||||
.max .shade-mask-delay .shade-content .top,
|
||||
.max .shade-mask-delay .shade-content-delay .top,
|
||||
.max .shade-mask-delay .shade-content-new .top,
|
||||
.max .shade-mask-new .shade-content .top,
|
||||
.max .shade-mask-new .shade-content-delay .top,
|
||||
.max .shade-mask-new .shade-content-new .top {
|
||||
position: absolute;
|
||||
top: -0.8rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 8.81333rem;
|
||||
height: 1.14667rem;
|
||||
line-height: 1.14667rem;
|
||||
background: url("../images/top-bg.png") no-repeat 0 0/100% 100%;
|
||||
text-align: center;
|
||||
color: #8525C9;
|
||||
font-size: 0.48rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.max .shade-mask .shade-content ul.select-ul,
|
||||
.max .shade-mask .shade-content-delay ul.select-ul,
|
||||
.max .shade-mask .shade-content-new ul.select-ul,
|
||||
.max .shade-mask-delay .shade-content ul.select-ul,
|
||||
.max .shade-mask-delay .shade-content-delay ul.select-ul,
|
||||
.max .shade-mask-delay .shade-content-new ul.select-ul,
|
||||
.max .shade-mask-new .shade-content ul.select-ul,
|
||||
.max .shade-mask-new .shade-content-delay ul.select-ul,
|
||||
.max .shade-mask-new .shade-content-new ul.select-ul {
|
||||
white-space: nowrap;
|
||||
width: 8rem;
|
||||
max-height: 5.92rem;
|
||||
margin: 1.94667rem auto 0;
|
||||
text-align: center;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.max .shade-mask .shade-content ul.select-ul li,
|
||||
.max .shade-mask .shade-content-delay ul.select-ul li,
|
||||
.max .shade-mask .shade-content-new ul.select-ul li,
|
||||
.max .shade-mask-delay .shade-content ul.select-ul li,
|
||||
.max .shade-mask-delay .shade-content-delay ul.select-ul li,
|
||||
.max .shade-mask-delay .shade-content-new ul.select-ul li,
|
||||
.max .shade-mask-new .shade-content ul.select-ul li,
|
||||
.max .shade-mask-new .shade-content-delay ul.select-ul li,
|
||||
.max .shade-mask-new .shade-content-new ul.select-ul li {
|
||||
position: relative;
|
||||
width: 3.46667rem;
|
||||
height: 2.66667rem;
|
||||
background-color: #D575F0;
|
||||
border-radius: 0.26667rem;
|
||||
display: inline-block;
|
||||
margin: 0 0.24rem;
|
||||
}
|
||||
|
||||
.max .shade-mask .shade-content ul.select-ul li p,
|
||||
.max .shade-mask .shade-content-delay ul.select-ul li p,
|
||||
.max .shade-mask .shade-content-new ul.select-ul li p,
|
||||
.max .shade-mask-delay .shade-content ul.select-ul li p,
|
||||
.max .shade-mask-delay .shade-content-delay ul.select-ul li p,
|
||||
.max .shade-mask-delay .shade-content-new ul.select-ul li p,
|
||||
.max .shade-mask-new .shade-content ul.select-ul li p,
|
||||
.max .shade-mask-new .shade-content-delay ul.select-ul li p,
|
||||
.max .shade-mask-new .shade-content-new ul.select-ul li p {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 0.45333rem;
|
||||
line-height: 0.45333rem;
|
||||
border-radius: 0.16rem 0.05333rem;
|
||||
background-color: #FF729C;
|
||||
color: white;
|
||||
font-size: 0.24rem;
|
||||
font-weight: bold;
|
||||
padding: 0.02667rem 0.21333rem;
|
||||
}
|
||||
|
||||
.max .shade-mask .shade-content ul.select-ul li .nameplate,
|
||||
.max .shade-mask .shade-content-delay ul.select-ul li .nameplate,
|
||||
.max .shade-mask .shade-content-new ul.select-ul li .nameplate,
|
||||
.max .shade-mask-delay .shade-content ul.select-ul li .nameplate,
|
||||
.max .shade-mask-delay .shade-content-delay ul.select-ul li .nameplate,
|
||||
.max .shade-mask-delay .shade-content-new ul.select-ul li .nameplate,
|
||||
.max .shade-mask-new .shade-content ul.select-ul li .nameplate,
|
||||
.max .shade-mask-new .shade-content-delay ul.select-ul li .nameplate,
|
||||
.max .shade-mask-new .shade-content-new ul.select-ul li .nameplate {
|
||||
position: absolute;
|
||||
top: 34%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 2.74667rem;
|
||||
height: 0.69333rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.max .shade-mask .shade-content ul.select-ul li .nameplate img,
|
||||
.max .shade-mask .shade-content-delay ul.select-ul li .nameplate img,
|
||||
.max .shade-mask .shade-content-new ul.select-ul li .nameplate img,
|
||||
.max .shade-mask-delay .shade-content ul.select-ul li .nameplate img,
|
||||
.max .shade-mask-delay .shade-content-delay ul.select-ul li .nameplate img,
|
||||
.max .shade-mask-delay .shade-content-new ul.select-ul li .nameplate img,
|
||||
.max .shade-mask-new .shade-content ul.select-ul li .nameplate img,
|
||||
.max .shade-mask-new .shade-content-delay ul.select-ul li .nameplate img,
|
||||
.max .shade-mask-new .shade-content-new ul.select-ul li .nameplate img {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 2.74667rem;
|
||||
height: 0.69333rem;
|
||||
}
|
||||
|
||||
.max .shade-mask .shade-content ul.select-ul li .nameplate span,
|
||||
.max .shade-mask .shade-content-delay ul.select-ul li .nameplate span,
|
||||
.max .shade-mask .shade-content-new ul.select-ul li .nameplate span,
|
||||
.max .shade-mask-delay .shade-content ul.select-ul li .nameplate span,
|
||||
.max .shade-mask-delay .shade-content-delay ul.select-ul li .nameplate span,
|
||||
.max .shade-mask-delay .shade-content-new ul.select-ul li .nameplate span,
|
||||
.max .shade-mask-new .shade-content ul.select-ul li .nameplate span,
|
||||
.max .shade-mask-new .shade-content-delay ul.select-ul li .nameplate span,
|
||||
.max .shade-mask-new .shade-content-new ul.select-ul li .nameplate span {
|
||||
position: absolute;
|
||||
top: 0.21333rem;
|
||||
left: 1.06667rem;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.max .shade-mask .shade-content ul.select-ul li .delay-btn,
|
||||
.max .shade-mask .shade-content-delay ul.select-ul li .delay-btn,
|
||||
.max .shade-mask .shade-content-new ul.select-ul li .delay-btn,
|
||||
.max .shade-mask-delay .shade-content ul.select-ul li .delay-btn,
|
||||
.max .shade-mask-delay .shade-content-delay ul.select-ul li .delay-btn,
|
||||
.max .shade-mask-delay .shade-content-new ul.select-ul li .delay-btn,
|
||||
.max .shade-mask-new .shade-content ul.select-ul li .delay-btn,
|
||||
.max .shade-mask-new .shade-content-delay ul.select-ul li .delay-btn,
|
||||
.max .shade-mask-new .shade-content-new ul.select-ul li .delay-btn {
|
||||
position: absolute;
|
||||
left: -0.05333rem;
|
||||
bottom: -0.05333rem;
|
||||
width: 3.6rem;
|
||||
height: 0.8rem;
|
||||
}
|
||||
|
||||
.max .shade-mask .shade-content ul.select-ul li .delay-btn img,
|
||||
.max .shade-mask .shade-content-delay ul.select-ul li .delay-btn img,
|
||||
.max .shade-mask .shade-content-new ul.select-ul li .delay-btn img,
|
||||
.max .shade-mask-delay .shade-content ul.select-ul li .delay-btn img,
|
||||
.max .shade-mask-delay .shade-content-delay ul.select-ul li .delay-btn img,
|
||||
.max .shade-mask-delay .shade-content-new ul.select-ul li .delay-btn img,
|
||||
.max .shade-mask-new .shade-content ul.select-ul li .delay-btn img,
|
||||
.max .shade-mask-new .shade-content-delay ul.select-ul li .delay-btn img,
|
||||
.max .shade-mask-new .shade-content-new ul.select-ul li .delay-btn img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.max .shade-mask .shade-content .apply-btn,
|
||||
.max .shade-mask .shade-content-delay .apply-btn,
|
||||
.max .shade-mask .shade-content-new .apply-btn,
|
||||
.max .shade-mask-delay .shade-content .apply-btn,
|
||||
.max .shade-mask-delay .shade-content-delay .apply-btn,
|
||||
.max .shade-mask-delay .shade-content-new .apply-btn,
|
||||
.max .shade-mask-new .shade-content .apply-btn,
|
||||
.max .shade-mask-new .shade-content-delay .apply-btn,
|
||||
.max .shade-mask-new .shade-content-new .apply-btn {
|
||||
width: 4.90667rem;
|
||||
height: 1.2rem;
|
||||
background: url("../images/apply-new.png") no-repeat 0 0/100% 100%;
|
||||
margin: 0.64rem auto 0;
|
||||
}
|
||||
|
||||
.max .shade-mask .shade-content .close,
|
||||
.max .shade-mask .shade-content-delay .close,
|
||||
.max .shade-mask .shade-content-new .close,
|
||||
.max .shade-mask-delay .shade-content .close,
|
||||
.max .shade-mask-delay .shade-content-delay .close,
|
||||
.max .shade-mask-delay .shade-content-new .close,
|
||||
.max .shade-mask-new .shade-content .close,
|
||||
.max .shade-mask-new .shade-content-delay .close,
|
||||
.max .shade-mask-new .shade-content-new .close {
|
||||
position: absolute;
|
||||
bottom: -1.33333rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 1.33333rem;
|
||||
height: 1.33333rem;
|
||||
}
|
||||
|
||||
.max .shade-mask .shade-content .close img,
|
||||
.max .shade-mask .shade-content-delay .close img,
|
||||
.max .shade-mask .shade-content-new .close img,
|
||||
.max .shade-mask-delay .shade-content .close img,
|
||||
.max .shade-mask-delay .shade-content-delay .close img,
|
||||
.max .shade-mask-delay .shade-content-new .close img,
|
||||
.max .shade-mask-new .shade-content .close img,
|
||||
.max .shade-mask-new .shade-content-delay .close img,
|
||||
.max .shade-mask-new .shade-content-new .close img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.max .shade-mask-delay .shade-content-delay {
|
||||
color: #AD0ED8;
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
|
||||
.max .shade-mask-delay .shade-content-delay .nameplate-style {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 2rem 0 0;
|
||||
}
|
||||
|
||||
.max .shade-mask-delay .shade-content-delay .nameplate-style div {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 4.8rem;
|
||||
height: 1.01333rem;
|
||||
background: #D575F0;
|
||||
border-radius: 0.26667rem;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.max .shade-mask-delay .shade-content-delay .nameplate-style div p {
|
||||
width: 2.74667rem;
|
||||
height: 0.68rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.max .shade-mask-delay .shade-content-delay .nameplate-style div p img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.max .shade-mask-delay .shade-content-delay .nameplate-style div p span {
|
||||
position: relative;
|
||||
top: -0.56rem;
|
||||
left: 0.32rem;
|
||||
color: white;
|
||||
font-size: 0.32rem;
|
||||
}
|
||||
|
||||
.max .shade-mask-delay .shade-content-delay .delay-time {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-left: -0.48rem;
|
||||
margin-top: 0.64rem;
|
||||
}
|
||||
|
||||
.max .shade-mask-delay .shade-content-delay .delay-time div {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.max .shade-mask-delay .shade-content-delay .delay-time div .decrease,
|
||||
.max .shade-mask-delay .shade-content-delay .delay-time div .increase {
|
||||
width: 0.8rem;
|
||||
height: 0.8rem;
|
||||
}
|
||||
|
||||
.max .shade-mask-delay .shade-content-delay .delay-time div p {
|
||||
width: 2.13333rem;
|
||||
height: 0.8rem;
|
||||
line-height: 0.8rem;
|
||||
background: #D575F0;
|
||||
border-radius: 0.4rem;
|
||||
margin: 0 0.26667rem;
|
||||
text-align: center;
|
||||
color: white;
|
||||
font-size: 0.48rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.max .shade-mask-delay .shade-content-delay .apply-btn {
|
||||
width: 4.90667rem;
|
||||
height: 1.2rem;
|
||||
background: url("../images/confirm.png") no-repeat 0 0/100% 100%;
|
||||
margin: 0.85333rem auto 0;
|
||||
}
|
||||
|
||||
.max .shade-mask-new .shade-content-new {
|
||||
height: 10.98667rem;
|
||||
background-image: url("../images/new-bg.png");
|
||||
color: #AD0ED8;
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
|
||||
.max .shade-mask-new .shade-content-new .nameplate-style {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin: 1.68rem 0 0;
|
||||
}
|
||||
|
||||
.max .shade-mask-new .shade-content-new .nameplate-style span {
|
||||
margin-top: 0.26667rem;
|
||||
}
|
||||
|
||||
.max .shade-mask-new .shade-content-new .nameplate-style ul.apply-new-ul {
|
||||
max-height: 3.68rem;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.max .shade-mask-new .shade-content-new .nameplate-style ul.apply-new-ul li {
|
||||
width: 4.8rem;
|
||||
height: 1.01333rem;
|
||||
background: #D575F0;
|
||||
border-radius: 0.26667rem;
|
||||
margin-bottom: 0.13333rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border: 0.04rem solid transparent;
|
||||
}
|
||||
|
||||
.max .shade-mask-new .shade-content-new .nameplate-style ul.apply-new-ul li.active {
|
||||
border: 0.04rem solid #9842F3;
|
||||
background: #EEAFFF;
|
||||
}
|
||||
|
||||
.max .shade-mask-new .shade-content-new .nameplate-style ul.apply-new-ul li div {
|
||||
width: 2.74667rem;
|
||||
height: 0.68rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.max .shade-mask-new .shade-content-new .nameplate-style ul.apply-new-ul li div img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.max .shade-mask-new .shade-content-new .nameplate-style ul.apply-new-ul li div span.nameplate-desc {
|
||||
position: relative;
|
||||
top: -0.56rem;
|
||||
left: 0.32rem;
|
||||
color: white;
|
||||
font-size: 0.32rem;
|
||||
}
|
||||
|
||||
.max .shade-mask-new .shade-content-new .new-nameplate-desc-wrap {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin: 0.66667rem auto;
|
||||
}
|
||||
|
||||
.max .shade-mask-new .shade-content-new .new-nameplate-desc-wrap input {
|
||||
width: 4.8rem;
|
||||
background: #E37CFF;
|
||||
outline: none;
|
||||
border-bottom: 0.02667rem solid #D575F0;
|
||||
caret-color: #D9B8F4;
|
||||
color: white;
|
||||
font-size: 0.34667rem;
|
||||
padding-bottom: 0.05333rem;
|
||||
}
|
||||
|
||||
.max .shade-mask-new .shade-content-new .new-nameplate-desc-wrap input::placeholder {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.max .shade-mask-new .shade-content-new .delay-time {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-left: -0.48rem;
|
||||
}
|
||||
|
||||
.max .shade-mask-new .shade-content-new .delay-time div {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.max .shade-mask-new .shade-content-new .delay-time div .decrease,
|
||||
.max .shade-mask-new .shade-content-new .delay-time div .increase {
|
||||
width: 0.8rem;
|
||||
height: 0.8rem;
|
||||
}
|
||||
|
||||
.max .shade-mask-new .shade-content-new .delay-time div p {
|
||||
width: 2.13333rem;
|
||||
height: 0.8rem;
|
||||
line-height: 0.8rem;
|
||||
background: #D575F0;
|
||||
border-radius: 0.4rem;
|
||||
margin: 0 0.26667rem;
|
||||
text-align: center;
|
||||
color: white;
|
||||
font-size: 0.48rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.max .shade-mask-new .shade-content-new .apply-btn {
|
||||
width: 4.90667rem;
|
||||
height: 1.2rem;
|
||||
background: url("../images/confirm.png") no-repeat 0 0/100% 100%;
|
||||
margin: 0.61333rem auto 0;
|
||||
}
|
||||
|
||||
.max .godiamond,
|
||||
.max .gocrystal {
|
||||
position: fixed;
|
||||
width: 2.26667rem;
|
||||
height: 2.24rem;
|
||||
top: 8rem;
|
||||
right: 0.24rem;
|
||||
background: url("../images/godiamond.png") no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.max .gocrystal {
|
||||
top: 10.66667rem;
|
||||
background: url("../images/gocrystal.png") no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
428
view/molistar/activity/act-nameplate/css/index.scss
Normal file
428
view/molistar/activity/act-nameplate/css/index.scss
Normal file
@@ -0,0 +1,428 @@
|
||||
@function px2rem($px) {
|
||||
@return $px / 75+rem;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'pingfang-bold';
|
||||
src: url('../../../common/fonts/PingFang\ Bold.ttf');
|
||||
src: url('../../../common/fonts/PingFang\ Bold.ttf') format('woff'),
|
||||
url('../../../common/fonts/PingFang\ Bold.ttf') format('truetype'),
|
||||
url('../../../common/fonts/PingFang\ Bold.ttf') format('svg');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'pingfang-medium';
|
||||
src: url('../../../common/fonts/PingFang-Medium.ttf');
|
||||
src: url('../../../common/fonts/PingFang-Medium.ttf') format('woff'),
|
||||
url('../../../common/fonts/PingFang-Medium.ttf') format('truetype'),
|
||||
url('../../../common/fonts/PingFang-Medium.ttf') format('svg');
|
||||
}
|
||||
|
||||
// @import '../../../common/css/flex.scss';
|
||||
.max {
|
||||
width: px2rem(750);
|
||||
height: px2rem(2313);
|
||||
background: url('../images/max.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
font-family: 'pingfang-bold';
|
||||
|
||||
.record {
|
||||
position: absolute;
|
||||
position: absolute;
|
||||
top: 5.9rem;
|
||||
right: 0;
|
||||
width: 1.5rem;
|
||||
height: 1.4rem;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
position: absolute;
|
||||
top: 15.8rem;
|
||||
left: px2rem(126);
|
||||
width: px2rem(190);
|
||||
height: px2rem(76);
|
||||
|
||||
&.basics-receive {
|
||||
left: 5.6rem;
|
||||
}
|
||||
|
||||
&.advance-send {
|
||||
top: 22.34667rem;
|
||||
}
|
||||
|
||||
&.advance-receive {
|
||||
top: 22.34667rem;
|
||||
left: 5.6rem;
|
||||
}
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.shade-mask,
|
||||
.shade-mask-delay,
|
||||
.shade-mask-new {
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 9;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background-color: rgba($color: #000000, $alpha: .4);
|
||||
|
||||
.shade-content,
|
||||
.shade-content-delay,
|
||||
.shade-content-new {
|
||||
position: absolute;
|
||||
// top: px2rem(180);
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: px2rem(696);
|
||||
height: px2rem(614);
|
||||
background: url('../images/select-bg.png') no-repeat 0 0/100% 100%;
|
||||
|
||||
// background-color: #FFF1F5;
|
||||
// border-radius: 0 0 px2rem(24) px2rem(24);
|
||||
.top {
|
||||
position: absolute;
|
||||
top: px2rem(-60);
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: px2rem(661);
|
||||
height: px2rem(86);
|
||||
line-height: px2rem(86);
|
||||
background: url('../images/top-bg.png') no-repeat 0 0/100% 100%;
|
||||
text-align: center;
|
||||
color: #8525C9;
|
||||
font-size: px2rem(36);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
ul.select-ul {
|
||||
white-space: nowrap;
|
||||
width: px2rem(600);
|
||||
max-height: px2rem(444);
|
||||
margin: px2rem(146) auto 0;
|
||||
text-align: center;
|
||||
overflow-x: auto;
|
||||
|
||||
li {
|
||||
position: relative;
|
||||
width: px2rem(260);
|
||||
height: px2rem(200);
|
||||
background-color: #D575F0;
|
||||
border-radius: px2rem(20);
|
||||
display: inline-block;
|
||||
margin: 0 px2rem(18);
|
||||
|
||||
p {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: px2rem(34);
|
||||
line-height: px2rem(34);
|
||||
border-radius: px2rem(12) px2rem(4);
|
||||
background-color: #FF729C;
|
||||
color: white;
|
||||
font-size: px2rem(18);
|
||||
font-weight: bold;
|
||||
padding: px2rem(2) px2rem(16);
|
||||
}
|
||||
|
||||
.nameplate {
|
||||
position: absolute;
|
||||
top: 34%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: px2rem(206);
|
||||
height: px2rem(52);
|
||||
text-align: center;
|
||||
|
||||
img {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: px2rem(206);
|
||||
height: px2rem(52);
|
||||
}
|
||||
|
||||
span {
|
||||
position: absolute;
|
||||
top: px2rem(16);
|
||||
left: px2rem(80);
|
||||
color: white;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.delay-btn {
|
||||
position: absolute;
|
||||
left: px2rem(-4);
|
||||
bottom: px2rem(-4);
|
||||
width: px2rem(270);
|
||||
height: px2rem(60);
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.apply-btn {
|
||||
width: px2rem(368);
|
||||
height: px2rem(90);
|
||||
background: url('../images/apply-new.png') no-repeat 0 0/100% 100%;
|
||||
margin: px2rem(48) auto 0;
|
||||
}
|
||||
|
||||
.close {
|
||||
position: absolute;
|
||||
bottom: px2rem(-100);
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: px2rem(100);
|
||||
height: px2rem(100);
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.shade-mask-delay {
|
||||
.shade-content-delay {
|
||||
color: #AD0ED8;
|
||||
font-size: px2rem(30);
|
||||
|
||||
.nameplate-style {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: px2rem(150) 0 0;
|
||||
|
||||
div {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: px2rem(360);
|
||||
height: px2rem(76);
|
||||
background: #D575F0;
|
||||
border-radius: px2rem(20);
|
||||
position: relative;
|
||||
|
||||
p {
|
||||
width: px2rem(206);
|
||||
height: px2rem(51);
|
||||
text-align: center;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
span {
|
||||
position: relative;
|
||||
top: px2rem(-42);
|
||||
left: px2rem(24);
|
||||
color: white;
|
||||
font-size: px2rem(24);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.delay-time {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-left: px2rem(-36);
|
||||
margin-top: px2rem(48);
|
||||
|
||||
div {
|
||||
display: flex;
|
||||
|
||||
.decrease,
|
||||
.increase {
|
||||
width: px2rem(60);
|
||||
height: px2rem(60);
|
||||
}
|
||||
|
||||
p {
|
||||
width: px2rem(160);
|
||||
height: px2rem(60);
|
||||
line-height: px2rem(60);
|
||||
background: #D575F0;
|
||||
border-radius: px2rem(30);
|
||||
margin: 0 px2rem(20);
|
||||
text-align: center;
|
||||
color: white;
|
||||
font-size: px2rem(36);
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.apply-btn {
|
||||
width: px2rem(368);
|
||||
height: px2rem(90);
|
||||
background: url('../images/confirm.png') no-repeat 0 0/100% 100%;
|
||||
margin: px2rem(64) auto 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.shade-mask-new {
|
||||
.shade-content-new {
|
||||
height: px2rem(824);
|
||||
background-image: url('../images/new-bg.png');
|
||||
color: #AD0ED8;
|
||||
font-size: px2rem(30);
|
||||
|
||||
.nameplate-style {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
// padding: 0 px2rem(40);
|
||||
margin: px2rem(126) 0 0;
|
||||
|
||||
span {
|
||||
margin-top: px2rem(20);
|
||||
}
|
||||
|
||||
ul.apply-new-ul {
|
||||
max-height: px2rem(276);
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
|
||||
li {
|
||||
width: px2rem(360);
|
||||
height: px2rem(76);
|
||||
background: #D575F0;
|
||||
border-radius: px2rem(20);
|
||||
margin-bottom: px2rem(10);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border: px2rem(3) solid transparent;
|
||||
|
||||
&.active {
|
||||
border: px2rem(3) solid #9842F3;
|
||||
background: #EEAFFF;
|
||||
}
|
||||
|
||||
div {
|
||||
width: px2rem(206);
|
||||
height: px2rem(51);
|
||||
text-align: center;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
span.nameplate-desc {
|
||||
position: relative;
|
||||
top: px2rem(-42);
|
||||
left: px2rem(24);
|
||||
color: white;
|
||||
font-size: px2rem(24);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.new-nameplate-desc-wrap {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin: px2rem(50) auto;
|
||||
|
||||
input {
|
||||
width: px2rem(360);
|
||||
background: #E37CFF;
|
||||
outline: none;
|
||||
border-bottom: px2rem(2) solid #D575F0;
|
||||
caret-color: #D9B8F4;
|
||||
color: white;
|
||||
font-size: px2rem(26);
|
||||
padding-bottom: px2rem(4);
|
||||
|
||||
&::placeholder {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.delay-time {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-left: px2rem(-36);
|
||||
|
||||
div {
|
||||
display: flex;
|
||||
|
||||
.decrease,
|
||||
.increase {
|
||||
width: px2rem(60);
|
||||
height: px2rem(60);
|
||||
}
|
||||
|
||||
p {
|
||||
width: px2rem(160);
|
||||
height: px2rem(60);
|
||||
line-height: px2rem(60);
|
||||
background: #D575F0;
|
||||
border-radius: px2rem(30);
|
||||
margin: 0 px2rem(20);
|
||||
text-align: center;
|
||||
color: white;
|
||||
font-size: px2rem(36);
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.apply-btn {
|
||||
width: px2rem(368);
|
||||
height: px2rem(90);
|
||||
background: url('../images/confirm.png') no-repeat 0 0/100% 100%;
|
||||
margin: px2rem(46) auto 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.godiamond,
|
||||
.gocrystal {
|
||||
position: fixed;
|
||||
width: px2rem(170);
|
||||
height: px2rem(168);
|
||||
top: px2rem(600);
|
||||
right: px2rem(18);
|
||||
background: url('../images/godiamond.png') no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.gocrystal {
|
||||
top: px2rem(800);
|
||||
background: url('../images/gocrystal.png') no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
261
view/molistar/activity/act-nameplate/css/nobleHighRank.css
Normal file
261
view/molistar/activity/act-nameplate/css/nobleHighRank.css
Normal file
@@ -0,0 +1,261 @@
|
||||
body,
|
||||
html {
|
||||
width: 100%;
|
||||
background: #201009;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.header {
|
||||
width: 10rem;
|
||||
height: 11.37333rem;
|
||||
background: url(../images/noble/header.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.header .applicationRecord {
|
||||
width: 0.74667rem;
|
||||
height: 2.13333rem;
|
||||
background: url(../images/noble/applicationRecord.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 2.81333rem;
|
||||
}
|
||||
|
||||
.header .applicationRecord a {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.header .content {
|
||||
width: 8.8rem;
|
||||
height: 1.86667rem;
|
||||
background: linear-gradient(0deg, #EEB380 15%, #FBE3C7 93%);
|
||||
border-radius: 0.10667rem;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 6.96rem;
|
||||
transform: translateX(-50%);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.header .content b {
|
||||
color: #5C3009;
|
||||
font-weight: bold;
|
||||
margin: 0.45333rem 0 0.25333rem;
|
||||
font-size: 0.4rem;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.header .content p {
|
||||
color: #5C3009;
|
||||
font-size: 0.37333rem;
|
||||
}
|
||||
|
||||
.list {
|
||||
width: 8.8rem;
|
||||
margin: -2rem auto 0;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.list li {
|
||||
width: 8.8rem;
|
||||
height: 7.29333rem;
|
||||
margin-bottom: 1.08rem;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.list li img {
|
||||
width: 3.92rem;
|
||||
height: 1.05333rem;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 2.29333rem;
|
||||
}
|
||||
|
||||
.list li .input_box {
|
||||
width: 6.13333rem;
|
||||
height: 0.85333rem;
|
||||
line-height: 0.85333rem;
|
||||
display: flex;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 2.05333rem;
|
||||
}
|
||||
|
||||
.list li .input_box span {
|
||||
flex: 1;
|
||||
color: #fff;
|
||||
font-size: 0.34667rem;
|
||||
}
|
||||
|
||||
.list li .input_box input {
|
||||
background: #58504B;
|
||||
border-radius: 0.10667rem;
|
||||
padding: 0rem 0.13333rem;
|
||||
box-sizing: border-box;
|
||||
width: 4.26667rem;
|
||||
height: 0.85333rem;
|
||||
color: #fff;
|
||||
font-size: 0.34667rem;
|
||||
}
|
||||
|
||||
.list li .but {
|
||||
width: 4.4rem;
|
||||
height: 0.96rem;
|
||||
background: linear-gradient(0deg, #504C47 0%, #847A72 100%);
|
||||
border-radius: 0.96rem;
|
||||
line-height: 0.96rem;
|
||||
text-align: center;
|
||||
color: #D3CBC3;
|
||||
font-size: 0.4rem;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 0.62667rem;
|
||||
}
|
||||
|
||||
.list li .but_active {
|
||||
background: linear-gradient(0deg, #EDB17C 0%, #FCE7CE 100%);
|
||||
color: #5C3009;
|
||||
}
|
||||
|
||||
.list li:nth-child(1) {
|
||||
background: url(../images/noble/g_bg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.list li:nth-child(2) {
|
||||
background: url(../images/noble/q_bg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.list li:nth-child(3) {
|
||||
background: url(../images/noble/d_bg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.list li:nth-child(4) {
|
||||
background: url(../images/noble/s_bg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
input {
|
||||
background: none;
|
||||
outline: none;
|
||||
border: none;
|
||||
}
|
||||
|
||||
input::-webkit-input-placeholder {
|
||||
color: #9B928D;
|
||||
font-size: 0.34667rem;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'pingfang-bold';
|
||||
src: url("../../../common/fonts/PingFang Bold.ttf");
|
||||
src: url("../../../common/fonts/PingFang Bold.ttf") format("woff"), url("../../../common/fonts/PingFang Bold.ttf") format("truetype"), url("../../../common/fonts/PingFang Bold.ttf") format("svg");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'pingfang-medium';
|
||||
src: url("../../../common/fonts/PingFang-Medium.ttf");
|
||||
src: url("../../../common/fonts/PingFang-Medium.ttf") format("woff"), url("../../../common/fonts/PingFang-Medium.ttf") format("truetype"), url("../../../common/fonts/PingFang-Medium.ttf") format("svg");
|
||||
}
|
||||
|
||||
.max {
|
||||
font-family: 'pingfang-medium';
|
||||
padding: 0.4rem 0.4rem;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.max li {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0.4rem 0.26667rem;
|
||||
background: #2E2B2A;
|
||||
margin-bottom: 0.32rem;
|
||||
border-radius: 0.4rem;
|
||||
}
|
||||
|
||||
.max li .nameplate-style {
|
||||
width: 3.57333rem;
|
||||
height: 1.28rem;
|
||||
background: url(../images/noble/minpai_bg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
border-radius: 0.13333rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.max li .nameplate-style img {
|
||||
width: 3.04rem;
|
||||
height: 0.8rem;
|
||||
}
|
||||
|
||||
.max li .nameplate-desc-wrap {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-left: 0.10667rem;
|
||||
}
|
||||
|
||||
.max li .nameplate-desc-wrap .nameplate-desc {
|
||||
font-size: 0.4rem;
|
||||
color: #FFFFFF;
|
||||
margin-bottom: 0.05333rem;
|
||||
margin-bottom: 0.21333rem;
|
||||
}
|
||||
|
||||
.max li .nameplate-desc-wrap p span {
|
||||
font-size: 0.26667rem;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.max li .isPass {
|
||||
width: 2.66667rem;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.max li .isPass p {
|
||||
font-family: 'pingfang-bold';
|
||||
font-size: 0.4rem;
|
||||
font-weight: bold;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.max li .isPass p.not-pass {
|
||||
color: #FB486A;
|
||||
}
|
||||
|
||||
.max li .isPass .result {
|
||||
font-size: 0.26667rem;
|
||||
color: #999999;
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
|
||||
.no-record-wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.no-record-wrap img {
|
||||
width: 4.98667rem;
|
||||
height: 5.2rem;
|
||||
margin-bottom: -1.33333rem;
|
||||
}
|
||||
|
||||
.no-record-wrap span {
|
||||
color: #666;
|
||||
font-size: 0.42667rem;
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user