Compare commits
4 Commits
act_newyea
...
iteration1
| Author | SHA1 | Date | |
|---|---|---|---|
|
e4faf289a9 | ||
|
|
f1871efd20 | ||
|
|
3f18ee1b3b | ||
|
|
dc18fe1855 |
@@ -52,7 +52,7 @@ body {
|
||||
color: white;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: url("../images/previous-result-bg.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-previous-result-bg.png") no-repeat 0 0/100% 100%;
|
||||
z-index: 9;
|
||||
}
|
||||
.wrap .previous-result span {
|
||||
@@ -67,7 +67,7 @@ body {
|
||||
width: 0.5333333333rem;
|
||||
height: 0.5333333333rem;
|
||||
margin-left: 0.1066666667rem;
|
||||
background: url("../images/little-bubble.png") 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-little-bubble.png") 0 0/100% 100%;
|
||||
}
|
||||
.wrap .previous-result .result-list p img {
|
||||
width: 100%;
|
||||
@@ -97,7 +97,14 @@ body {
|
||||
z-index: 9;
|
||||
width: 100%;
|
||||
height: 14.0533333333rem;
|
||||
background: url("../images/game-area.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-game-area.png") no-repeat 0 0/100% 100%;
|
||||
}
|
||||
.wrap .game-area .roundId {
|
||||
font-size: 0.2666666667rem;
|
||||
color: #701800;
|
||||
position: absolute;
|
||||
top: 0.16rem;
|
||||
left: 0.4666666667rem;
|
||||
}
|
||||
.wrap .game-area .select-time {
|
||||
display: none;
|
||||
@@ -112,7 +119,7 @@ body {
|
||||
width: 4.2933333333rem;
|
||||
height: 0.96rem;
|
||||
line-height: 0.8266666667rem;
|
||||
background: url("../images/count-down.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-count-down.png") no-repeat 0 0/100% 100%;
|
||||
text-align: center;
|
||||
font-size: 0.32rem;
|
||||
font-weight: bold;
|
||||
@@ -123,7 +130,7 @@ body {
|
||||
width: 4.9066666667rem;
|
||||
height: 0.9066666667rem;
|
||||
line-height: 0.9066666667rem;
|
||||
background: url("../images/tip.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-tip.png") no-repeat 0 0/100% 100%;
|
||||
font-size: 0.2933333333rem;
|
||||
color: #F0C799;
|
||||
}
|
||||
@@ -139,7 +146,7 @@ body {
|
||||
height: 1.9733333333rem;
|
||||
margin-top: 1.7333333333rem;
|
||||
margin-right: 0.4266666667rem;
|
||||
background: url("../images/bubble-bg.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-bubble-bg.png") no-repeat 0 0/100% 100%;
|
||||
}
|
||||
.wrap .game-area .select-time ul li:nth-child(-n+4) {
|
||||
margin-top: 1.0666666667rem;
|
||||
@@ -157,7 +164,7 @@ body {
|
||||
height: 0.3733333333rem;
|
||||
line-height: 0.3733333333rem;
|
||||
text-align: center;
|
||||
background: url("../images/multiple-bg.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-multiple-bg.png") no-repeat 0 0/100% 100%;
|
||||
font-size: 0.2666666667rem;
|
||||
font-weight: bold;
|
||||
color: white;
|
||||
@@ -172,7 +179,7 @@ body {
|
||||
box-sizing: border-box;
|
||||
width: 1.8133333333rem;
|
||||
height: 0.7733333333rem;
|
||||
background: url("../images/name-bg.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-name-bg.png") no-repeat 0 0/100% 100%;
|
||||
text-align: center;
|
||||
font-size: 0.2666666667rem;
|
||||
font-weight: bold;
|
||||
@@ -181,7 +188,7 @@ body {
|
||||
.wrap .game-area .select-time ul li .name.general {
|
||||
height: 0.6133333333rem;
|
||||
line-height: 0.4rem;
|
||||
background: url("../images/name-general-bg.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-name-general-bg.png") no-repeat 0 0/100% 100%;
|
||||
}
|
||||
.wrap .game-area .select-time ul li .name .gift-price {
|
||||
font-size: 0.24rem;
|
||||
@@ -194,7 +201,7 @@ body {
|
||||
position: absolute;
|
||||
top: -0.96rem;
|
||||
left: -0.3733333333rem;
|
||||
background: url("../images/qipao-2s.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-qipao-2s.png") no-repeat 0 0/100% 100%;
|
||||
transform: rotate(343deg);
|
||||
text-indent: 0.2133333333rem;
|
||||
}
|
||||
@@ -226,20 +233,20 @@ body {
|
||||
width: 9.4666666667rem;
|
||||
height: 1.68rem;
|
||||
margin: 1.8666666667rem auto 0;
|
||||
background: url("../images/btn-wrap-bg.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-btn-wrap-bg.png") no-repeat 0 0/100% 100%;
|
||||
}
|
||||
.wrap .game-area .select-time .btn-wrap div {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 2.5333333333rem;
|
||||
height: 1.0666666667rem;
|
||||
background: url("../images/fragment-btn.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-fragment-btn.png") no-repeat 0 0/100% 100%;
|
||||
line-height: 1.0666666667rem;
|
||||
font-size: 0.4rem;
|
||||
color: #975B25;
|
||||
}
|
||||
.wrap .game-area .select-time .btn-wrap div.active {
|
||||
background-image: url("../images/fragment-btn-active.png");
|
||||
background-image: url("https://img.pekolive.com/cf-fragment-btn-active.png");
|
||||
color: #B33E17;
|
||||
}
|
||||
.wrap .game-area .select-time .btn-wrap div:first-child {
|
||||
@@ -279,7 +286,7 @@ body {
|
||||
width: 4.2933333333rem;
|
||||
height: 0.96rem;
|
||||
line-height: 0.8266666667rem;
|
||||
background: url("../images/count-down.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-count-down.png") no-repeat 0 0/100% 100%;
|
||||
text-align: center;
|
||||
color: #B82F1A;
|
||||
font-size: 0.32rem;
|
||||
@@ -290,7 +297,7 @@ body {
|
||||
width: 4.9066666667rem;
|
||||
height: 0.9066666667rem;
|
||||
line-height: 0.9066666667rem;
|
||||
background: url("../images/tip.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-tip.png") no-repeat 0 0/100% 100%;
|
||||
text-align: center;
|
||||
font-size: 0.2933333333rem;
|
||||
color: rgba(255, 240, 199, 0.6);
|
||||
@@ -301,7 +308,7 @@ body {
|
||||
width: 2.8rem;
|
||||
height: 2.84rem;
|
||||
margin: 1.2rem auto 0.2rem;
|
||||
background: url(../images/drawBg.png);
|
||||
background: url("https://img.pekolive.com/cf-drawBg.png");
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.wrap .game-area .draw-time .count-down,
|
||||
@@ -314,7 +321,7 @@ body {
|
||||
width: 4.2933333333rem;
|
||||
height: 0.96rem;
|
||||
line-height: 0.8266666667rem;
|
||||
background: url("../images/count-down.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-count-down.png") no-repeat 0 0/100% 100%;
|
||||
text-align: center;
|
||||
font-size: 0.32rem;
|
||||
color: #B82F1A;
|
||||
@@ -325,7 +332,7 @@ body {
|
||||
width: 4.9066666667rem;
|
||||
height: 0.9066666667rem;
|
||||
line-height: 0.9066666667rem;
|
||||
background: url("../images/tip.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-tip.png") no-repeat 0 0/100% 100%;
|
||||
font-size: 0.2933333333rem;
|
||||
color: #F0C799;
|
||||
}
|
||||
@@ -586,7 +593,7 @@ body {
|
||||
.wrap .game-area .draw-time .put-wrap .list .item p {
|
||||
width: 0.8266666667rem;
|
||||
height: 0.8266666667rem;
|
||||
background: url(../images/record_bubble.png) no-repeat;
|
||||
background: url("https://img.pekolive.com/cf-record_bubble.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.wrap .game-area .draw-time .put-wrap .list .item p .gift {
|
||||
@@ -618,7 +625,7 @@ body {
|
||||
z-index: 99;
|
||||
width: 100%;
|
||||
height: 1.7333333333rem;
|
||||
background: url("../images/index-bottom.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-index-bottom.png") no-repeat 0 0/100% 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
@@ -678,7 +685,7 @@ body {
|
||||
transform: translate(-50%, -50%);
|
||||
width: 7.68rem;
|
||||
height: 8.88rem;
|
||||
background: url("../images/rule-bg.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-rule-bg.png") no-repeat 0 0/100% 100%;
|
||||
font-size: 0.3466666667rem;
|
||||
color: #B58147;
|
||||
font-weight: 600;
|
||||
@@ -701,7 +708,7 @@ body {
|
||||
width: 3.36rem;
|
||||
height: 0.6133333333rem;
|
||||
line-height: 0.6133333333rem;
|
||||
background: url("../images/title-bg.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-title-bg.png") no-repeat 0 0/100% 100%;
|
||||
margin: 0 auto 0.2933333333rem;
|
||||
text-align: center;
|
||||
}
|
||||
@@ -795,7 +802,7 @@ body {
|
||||
z-index: 99;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: url("../images/first.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-first.png") no-repeat 0 0/100% 100%;
|
||||
}
|
||||
.wrap .shade-mask-rank .shade-content-rank .rank-top .topthree-wrap .info-wrap .avatar img {
|
||||
position: relative;
|
||||
@@ -989,7 +996,7 @@ body {
|
||||
z-index: 99;
|
||||
width: 100%;
|
||||
height: 1.7333333333rem;
|
||||
background: url("../images/mall/bottom.png") no-repeat 0 0/100% 100%;
|
||||
background: url("https://img.pekolive.com/cf-bottom.png") no-repeat 0 0/100% 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
@@ -1,6 +1,9 @@
|
||||
@function px2rem($px, $rem: 75) {
|
||||
@return $px / $rem+rem;
|
||||
}
|
||||
@function prefixurl() {
|
||||
@return 'https://img.pekolive.com/'
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'pingfang-bold';
|
||||
@@ -71,7 +74,7 @@ body {
|
||||
color: white;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: url('../images/previous-result-bg.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-previous-result-bg.png') no-repeat 0 0/100% 100%;
|
||||
z-index: 9;
|
||||
|
||||
span {
|
||||
@@ -92,7 +95,7 @@ body {
|
||||
width: px2rem(40);
|
||||
height: px2rem(40);
|
||||
margin-left: px2rem(8);
|
||||
background: url('../images/little-bubble.png') 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-little-bubble.png') 0 0/100% 100%;
|
||||
|
||||
// &:nth-child(11){
|
||||
// width: px2rem(40, );
|
||||
@@ -138,7 +141,15 @@ body {
|
||||
z-index: 9;
|
||||
width: 100%;
|
||||
height: px2rem(1054);
|
||||
background: url('../images/game-area.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-game-area.png') no-repeat 0 0/100% 100%;
|
||||
|
||||
.roundId {
|
||||
font-size: px2rem(20, );
|
||||
color: #701800;
|
||||
position: absolute;
|
||||
top: px2rem(12, );
|
||||
left: px2rem(35, );
|
||||
}
|
||||
|
||||
// 等待倒计时30s
|
||||
.select-time {
|
||||
@@ -154,7 +165,7 @@ body {
|
||||
width: px2rem(322);
|
||||
height: px2rem(72);
|
||||
line-height: px2rem(62);
|
||||
background: url('../images/count-down.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-count-down.png') no-repeat 0 0/100% 100%;
|
||||
text-align: center;
|
||||
font-size: px2rem(24);
|
||||
font-weight: bold;
|
||||
@@ -166,7 +177,7 @@ body {
|
||||
width: px2rem(368);
|
||||
height: px2rem(68);
|
||||
line-height: px2rem(68);
|
||||
background: url('../images/tip.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-tip.png') no-repeat 0 0/100% 100%;
|
||||
font-size: px2rem(22);
|
||||
color: #F0C799;
|
||||
}
|
||||
@@ -185,7 +196,7 @@ body {
|
||||
height: px2rem(148);
|
||||
margin-top: px2rem(130);
|
||||
margin-right: px2rem(32);
|
||||
background: url('../images/bubble-bg.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-bubble-bg.png') no-repeat 0 0/100% 100%;
|
||||
|
||||
&:nth-child(-n+4) {
|
||||
margin-top: px2rem(80);
|
||||
@@ -205,7 +216,7 @@ body {
|
||||
height: px2rem(28);
|
||||
line-height: px2rem(28);
|
||||
text-align: center;
|
||||
background: url('../images/multiple-bg.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-multiple-bg.png') no-repeat 0 0/100% 100%;
|
||||
font-size: px2rem(20);
|
||||
font-weight: bold;
|
||||
color: white;
|
||||
@@ -221,7 +232,7 @@ body {
|
||||
box-sizing: border-box;
|
||||
width: px2rem(136);
|
||||
height: px2rem(58);
|
||||
background: url('../images/name-bg.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-name-bg.png') no-repeat 0 0/100% 100%;
|
||||
text-align: center;
|
||||
font-size: px2rem(20);
|
||||
font-weight: bold;
|
||||
@@ -230,7 +241,7 @@ body {
|
||||
&.general {
|
||||
height: px2rem(46);
|
||||
line-height: px2rem(30);
|
||||
background: url('../images/name-general-bg.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-name-general-bg.png') no-repeat 0 0/100% 100%;
|
||||
}
|
||||
|
||||
.gift-price {
|
||||
@@ -248,7 +259,7 @@ body {
|
||||
position: absolute;
|
||||
top: px2rem(-72);
|
||||
left: px2rem(-28);
|
||||
background: url('../images/qipao-2s.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-qipao-2s.png') no-repeat 0 0/100% 100%;
|
||||
transform: rotate(343deg);
|
||||
text-indent: px2rem(16);
|
||||
|
||||
@@ -296,20 +307,20 @@ body {
|
||||
width: px2rem(710);
|
||||
height: px2rem(126);
|
||||
margin: px2rem(140) auto 0;
|
||||
background: url('../images/btn-wrap-bg.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-btn-wrap-bg.png') no-repeat 0 0/100% 100%;
|
||||
|
||||
div {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: px2rem(190);
|
||||
height: px2rem(80);
|
||||
background: url('../images/fragment-btn.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-fragment-btn.png') no-repeat 0 0/100% 100%;
|
||||
line-height: px2rem(80);
|
||||
font-size: px2rem(30);
|
||||
color: #975B25;
|
||||
|
||||
&.active {
|
||||
background-image: url('../images/fragment-btn-active.png');
|
||||
background-image: url(prefixurl()+'cf-fragment-btn-active.png');
|
||||
color: #B33E17;
|
||||
}
|
||||
|
||||
@@ -360,7 +371,7 @@ body {
|
||||
width: px2rem(322);
|
||||
height: px2rem(72);
|
||||
line-height: px2rem(62);
|
||||
background: url('../images/count-down.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-count-down.png') no-repeat 0 0/100% 100%;
|
||||
text-align: center;
|
||||
color: #B82F1A;
|
||||
font-size: px2rem(24);
|
||||
@@ -372,7 +383,7 @@ body {
|
||||
width: px2rem(368);
|
||||
height: px2rem(68);
|
||||
line-height: px2rem(68);
|
||||
background: url('../images/tip.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-tip.png') no-repeat 0 0/100% 100%;
|
||||
text-align: center;
|
||||
font-size: px2rem(22);
|
||||
color: #FFF0C799;
|
||||
@@ -389,7 +400,7 @@ body {
|
||||
width: px2rem(210, );
|
||||
height: px2rem(213, );
|
||||
margin: 1.2rem auto 0.2rem;
|
||||
background: url(../images/drawBg.png);
|
||||
background: url(prefixurl()+'cf-drawBg.png');
|
||||
background-size: 100% 100%;
|
||||
|
||||
.count-down,
|
||||
@@ -402,7 +413,7 @@ body {
|
||||
width: px2rem(322);
|
||||
height: px2rem(72);
|
||||
line-height: px2rem(62);
|
||||
background: url('../images/count-down.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-count-down.png') no-repeat 0 0/100% 100%;
|
||||
text-align: center;
|
||||
font-size: px2rem(24);
|
||||
color: #B82F1A;
|
||||
@@ -414,7 +425,7 @@ body {
|
||||
width: px2rem(368);
|
||||
height: px2rem(68);
|
||||
line-height: px2rem(68);
|
||||
background: url('../images/tip.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-tip.png') no-repeat 0 0/100% 100%;
|
||||
font-size: px2rem(22);
|
||||
color: #F0C799;
|
||||
}
|
||||
@@ -728,7 +739,7 @@ body {
|
||||
p {
|
||||
width: px2rem(62, );
|
||||
height: px2rem(62, );
|
||||
background: url(../images/record_bubble.png) no-repeat;
|
||||
background: url(prefixurl()+'cf-record_bubble.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
.gift {
|
||||
@@ -772,7 +783,7 @@ body {
|
||||
z-index: 99;
|
||||
width: 100%;
|
||||
height: px2rem(130);
|
||||
background: url('../images/index-bottom.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-index-bottom.png') no-repeat 0 0/100% 100%;
|
||||
display: flex;
|
||||
// justify-content: space-evenly;
|
||||
align-items: center;
|
||||
@@ -842,7 +853,7 @@ body {
|
||||
transform: translate(-50%, -50%);
|
||||
width: px2rem(576);
|
||||
height: px2rem(666);
|
||||
background: url('../images/rule-bg.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-rule-bg.png') no-repeat 0 0/100% 100%;
|
||||
// padding: px2rem(56) px2rem(54) px2rem(42) px2rem(40);
|
||||
// box-sizing: border-box;
|
||||
font-size: px2rem(26);
|
||||
@@ -867,7 +878,7 @@ body {
|
||||
width: px2rem(252);
|
||||
height: px2rem(46);
|
||||
line-height: px2rem(46);
|
||||
background: url('../images/title-bg.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-title-bg.png') no-repeat 0 0/100% 100%;
|
||||
margin: 0 auto px2rem(22);
|
||||
text-align: center;
|
||||
}
|
||||
@@ -979,7 +990,7 @@ body {
|
||||
z-index: 99;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: url('../images/first.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-first.png') no-repeat 0 0/100% 100%;
|
||||
}
|
||||
|
||||
img {
|
||||
@@ -1210,7 +1221,7 @@ body {
|
||||
z-index: 99;
|
||||
width: 100%;
|
||||
height: px2rem(130);
|
||||
background: url('../images/mall/bottom.png') no-repeat 0 0/100% 100%;
|
||||
background: url(prefixurl()+'cf-bottom.png') no-repeat 0 0/100% 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
|
||||
@@ -47,7 +47,7 @@ body {
|
||||
.record-list li {
|
||||
width: 100%;
|
||||
height: 6.9733333333rem;
|
||||
background: url(../images/record/record-bg.png) no-repeat;
|
||||
background: url("https://img.pekolive.com/cf-record-bg.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
border-radius: 0.2666666667rem;
|
||||
overflow: hidden;
|
||||
@@ -65,16 +65,21 @@ body {
|
||||
height: 0.5866666667rem;
|
||||
line-height: 0.5866666667rem;
|
||||
background: #F46331;
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
padding: 0 0.2666666667rem;
|
||||
margin: 0.2rem auto 0;
|
||||
}
|
||||
.record-list li .goldBox p {
|
||||
color: #fff;
|
||||
width: 100%;
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
display: none;
|
||||
}
|
||||
.record-list li .goldBox span {
|
||||
color: #FFF773;
|
||||
font-size: 0.2666666667rem;
|
||||
}
|
||||
.record-list li .result-wrap {
|
||||
width: 84%;
|
||||
height: 1.2133333333rem;
|
||||
@@ -97,7 +102,7 @@ body {
|
||||
.record-list li .result-wrap .result .bg {
|
||||
width: 1.2133333333rem;
|
||||
height: 1.2133333333rem;
|
||||
background: url(../images/record_bubble_act.png) no-repeat;
|
||||
background: url("https://img.pekolive.com/cf-record_bubble_act.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
text-align: center;
|
||||
}
|
||||
@@ -154,7 +159,7 @@ body {
|
||||
.record-list li .put-wrap .list .item p {
|
||||
width: 0.8266666667rem;
|
||||
height: 0.8266666667rem;
|
||||
background: url(../images/record_bubble.png) no-repeat;
|
||||
background: url("https://img.pekolive.com/cf-record_bubble.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.record-list li .put-wrap .list .item p .gift {
|
||||
|
||||
@@ -1,6 +1,9 @@
|
||||
@function px2rem($px, $rem: 75) {
|
||||
@return $px / $rem+rem;
|
||||
}
|
||||
@function prefixurl() {
|
||||
@return 'https://img.pekolive.com/'
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'pingfang-bold';
|
||||
@@ -62,7 +65,7 @@ body {
|
||||
width: 100%;
|
||||
height: px2rem(523, );
|
||||
// background: linear-gradient(0deg, #46BBC1 0%, #62DEE4 100%);
|
||||
background: url(../images/record/record-bg.png) no-repeat;
|
||||
background: url(prefixurl()+'cf-record-bg.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
border-radius: px2rem(20, );
|
||||
overflow: hidden;
|
||||
@@ -82,7 +85,7 @@ body {
|
||||
height: px2rem(44, );
|
||||
line-height: px2rem(44, );
|
||||
background: #F46331;
|
||||
// display: flex;
|
||||
display: flex;
|
||||
// justify-content: space-between;
|
||||
box-sizing: border-box;
|
||||
padding: 0 px2rem(20, );
|
||||
@@ -90,15 +93,15 @@ body {
|
||||
|
||||
p {
|
||||
color: #fff;
|
||||
width: 100%;
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
display: none;
|
||||
}
|
||||
|
||||
// span {
|
||||
// color: #fff;
|
||||
// font-size: px2rem(28, );
|
||||
// }
|
||||
span {
|
||||
color: #FFF773;
|
||||
font-size: px2rem(20, );
|
||||
}
|
||||
|
||||
// .gold {
|
||||
// font-size: px2rem(26, );
|
||||
@@ -129,7 +132,7 @@ body {
|
||||
.bg {
|
||||
width: px2rem(91, );
|
||||
height: px2rem(91, );
|
||||
background: url(../images/record_bubble_act.png) no-repeat;
|
||||
background: url(prefixurl()+'cf-record_bubble_act.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
text-align: center;
|
||||
|
||||
@@ -197,7 +200,7 @@ body {
|
||||
p {
|
||||
width: px2rem(62, );
|
||||
height: px2rem(62, );
|
||||
background: url(../images/record_bubble.png) no-repeat;
|
||||
background: url(prefixurl()+'cf-record_bubble.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
.gift {
|
||||
|
||||
@@ -17,7 +17,7 @@ body {
|
||||
.header {
|
||||
width: 10rem;
|
||||
height: 4.2266666667rem;
|
||||
background: url(../images/result_main.png);
|
||||
background: url("https://img.pekolive.com/cf-result_main.png");
|
||||
background-size: 100% 100%;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
@@ -45,7 +45,7 @@ body {
|
||||
.main {
|
||||
width: 10rem;
|
||||
height: 15.6rem;
|
||||
background: url(../images/game-area.png);
|
||||
background: url("https://img.pekolive.com/cf-game-area.png");
|
||||
background-size: 100% 100%;
|
||||
margin: -1.85rem auto 0;
|
||||
position: relative;
|
||||
@@ -55,7 +55,7 @@ body {
|
||||
width: 9.4533333333rem;
|
||||
height: 1.1466666667rem;
|
||||
line-height: 1.1466666667rem;
|
||||
background: url(../images/result_list_bg.png);
|
||||
background: url("https://img.pekolive.com/cf-result_list_bg.png");
|
||||
background-size: 100% 100%;
|
||||
box-sizing: border-box;
|
||||
margin: 0 auto 0.24rem;
|
||||
@@ -86,7 +86,7 @@ body {
|
||||
height: 0.8266666667rem;
|
||||
line-height: 1.1466666667rem;
|
||||
margin-left: 0.4666666667rem;
|
||||
background: url(../images/record_bubble.png);
|
||||
background: url("https://img.pekolive.com/cf-record_bubble.png");
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.main li .list p img {
|
||||
|
||||
@@ -1,6 +1,10 @@
|
||||
@function px2rem($px, $rem: 75) {
|
||||
@return $px / $rem+rem;
|
||||
}
|
||||
@function prefixurl() {
|
||||
@return 'https://img.pekolive.com/'
|
||||
}
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'pingfang-bold';
|
||||
@@ -27,7 +31,7 @@ body {
|
||||
.header {
|
||||
width: px2rem(750, );
|
||||
height: px2rem(317, );
|
||||
background: url(../images/result_main.png);
|
||||
background: url(prefixurl()+'cf-result_main.png');
|
||||
background-size: 100% 100%;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
@@ -57,7 +61,7 @@ body {
|
||||
.main {
|
||||
width: px2rem(750, );
|
||||
height: px2rem(1170, );
|
||||
background: url(../images/game-area.png);
|
||||
background: url(prefixurl()+'cf-game-area.png');
|
||||
background-size: 100% 100%;
|
||||
margin: -1.85rem auto 0;
|
||||
position: relative;
|
||||
@@ -67,7 +71,7 @@ body {
|
||||
width: px2rem(709, );
|
||||
height: px2rem(86, );
|
||||
line-height: px2rem(86, );
|
||||
background: url(../images/result_list_bg.png);
|
||||
background: url(prefixurl()+'cf-result_list_bg.png');
|
||||
background-size: 100% 100%;
|
||||
box-sizing: border-box;
|
||||
margin: 0 auto 0.24rem;
|
||||
@@ -101,7 +105,7 @@ body {
|
||||
height: px2rem(62, );
|
||||
line-height: px2rem(86, );
|
||||
margin-left: px2rem(35, );
|
||||
background: url(../images/record_bubble.png);
|
||||
background: url(prefixurl()+'cf-record_bubble.png');
|
||||
background-size: 100% 100%;
|
||||
|
||||
img {
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 54 KiB After Width: | Height: | Size: 54 KiB |
@@ -14,9 +14,9 @@
|
||||
<body>
|
||||
<div class="wrap no-in-app">
|
||||
<!-- <div class="wrap "> -->
|
||||
<div class="banner"><img src="./images/banner.png" alt=""></div>
|
||||
<div class="rule"><img src="./images/rule.png" alt=""></div>
|
||||
<div class="record"><img src="./images/record.png" alt=""></div>
|
||||
<div class="banner"><img src="https://img.pekolive.com/cf-banner.png" alt=""></div>
|
||||
<div class="rule"><img src="https://img.pekolive.com/cf-rule.png" alt=""></div>
|
||||
<div class="record"><img src="https://img.pekolive.com/cf-record.png" alt=""></div>
|
||||
|
||||
<!-- 特权商城 -->
|
||||
<div class="mall" style="display: none;">
|
||||
@@ -34,6 +34,8 @@
|
||||
</div>
|
||||
<!-- 游戏区域 -->
|
||||
<div class="game-area">
|
||||
<!-- 本轮轮次 -->
|
||||
<div class="roundId"></div>
|
||||
<!-- 选择时间 -->
|
||||
<div class="select-time">
|
||||
<div class="count-down">开奖倒计时：<span class="count-down-num"></span>秒</div>
|
||||
@@ -48,8 +50,8 @@
|
||||
|
||||
</ul>
|
||||
|
||||
<div class="shelf"><img src="./images/shelf.png" alt=""></div>
|
||||
<div class="shelf"><img src="./images/shelf.png" alt=""></div>
|
||||
<div class="shelf"><img src="https://img.pekolive.com/cf-shelf.png" alt=""></div>
|
||||
<div class="shelf"><img src="https://img.pekolive.com/cf-shelf.png" alt=""></div>
|
||||
</div>
|
||||
<!-- 等待结果 -->
|
||||
<div class="wait-time">
|
||||
@@ -71,7 +73,7 @@
|
||||
<!-- <div class="item">
|
||||
<p><img src="" class="gift" alt=""></p>
|
||||
<div>
|
||||
<img src="./images/diamond.png" class="diamond" alt="">
|
||||
<img src="cf-diamond.png" class="diamond" alt="">
|
||||
<span class="in"></span>
|
||||
</div>
|
||||
</div> -->
|
||||
@@ -80,7 +82,7 @@
|
||||
<!-- 用户本轮中奖情况 -->
|
||||
<div class="award-info">
|
||||
<div class="desc">奖励</div>
|
||||
<img src="./images/diamond.png" class="diamond" alt="">
|
||||
<img src="https://img.pekolive.com/cf-diamond.png" class="diamond" alt="">
|
||||
<div class="award-wrap"></div>
|
||||
</div>
|
||||
<!-- 本轮前3名 -->
|
||||
@@ -93,28 +95,28 @@
|
||||
<div class="top-three-list">
|
||||
<div class="no no1">
|
||||
<img src="./images/logo.png" class="tx" alt="">
|
||||
<img src="./images/no1.png" class="txBox" alt="">
|
||||
<img src="https://img.pekolive.com/cf-no1.png" class="txBox" alt="">
|
||||
<div class="nick">虚位以待</div>
|
||||
<div class="num">
|
||||
<img src="./images/diamond.png" class="diamond" alt="">
|
||||
<img src="https://img.pekolive.com/cf-diamond.png" class="diamond" alt="">
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="no no2">
|
||||
<img src="./images/logo.png" class="tx" alt="">
|
||||
<img src="./images/no2.png" class="txBox" alt="">
|
||||
<img src="https://img.pekolive.com/cf-no2.png" class="txBox" alt="">
|
||||
<div class="nick">虚位以待</div>
|
||||
<div class="num">
|
||||
<img src="./images/diamond.png" class="diamond" alt="">
|
||||
<img src="https://img.pekolive.com/cf-diamond.png" class="diamond" alt="">
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="no no3">
|
||||
<img src="./images/logo.png" class="tx" alt="">
|
||||
<img src="./images/no3.png" class="txBox" alt="">
|
||||
<img src="https://img.pekolive.com/cf-no3.png" class="txBox" alt="">
|
||||
<div class="nick">虚位以待</div>
|
||||
<div class="num">
|
||||
<img src="./images/diamond.png" class="diamond" alt="">
|
||||
<img src="https://img.pekolive.com/cf-diamond.png" class="diamond" alt="">
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -139,7 +141,7 @@
|
||||
<p><img src="" alt=""></p>
|
||||
<!-- <p><img src="" alt=""></p> -->
|
||||
</div>
|
||||
<span class="more-result"><img src="./images/btn_result.png" alt=""></span>
|
||||
<span class="more-result"><img src="https://img.pekolive.com/cf-btn_result.png" alt=""></span>
|
||||
</div>
|
||||
|
||||
<!-- 个人信息 -->
|
||||
@@ -149,8 +151,8 @@
|
||||
<div class="diamond-num">我的鉆石：<span>0</span></div>
|
||||
<div class="fragment-num">今日奖励：<span>0</span></div>
|
||||
</div>
|
||||
<div class="add"><img src="./images/add.png" alt=""></div>
|
||||
<div class="rank"><img src="./images/rank.png" alt=""></div>
|
||||
<div class="add"><img src="https://img.pekolive.com/cf-add.png" alt=""></div>
|
||||
<div class="rank"><img src="https://img.pekolive.com/cf-rank.png" alt=""></div>
|
||||
</div>
|
||||
|
||||
<!-- 规则弹窗 -->
|
||||
@@ -160,14 +162,14 @@
|
||||
<div class="cyfs">
|
||||
<p class="title">参与方式</p>
|
||||
用戶可通過花費鉆石參與《星級廚房》遊戲，每次最少消耗100鉆石，每回合時間30秒
|
||||
<p class="jietu"><img src="./images/t1.png" alt=""></p>
|
||||
<p class="jietu"><img src="https://img.pekolive.com/cf-t1.png" alt=""></p>
|
||||
</div>
|
||||
<div class="lwff">
|
||||
<p class="title">礼物发放</p>
|
||||
每次參與遊戲後會獲得一次禮物開獎機會
|
||||
<p class="jietu t2"><img src="./images/t2.png" alt=""></p>
|
||||
<p class="jietu t2"><img src="https://img.pekolive.com/cf-t2.png" alt=""></p>
|
||||
每次隨機從8種食材中選取一個作為中獎物品，中獎後獲得【中獎物品購買碎片數*中獎物品對應倍數*100】的鉆石獎勵，鉆石將直接發放到錢包
|
||||
<p class="jietu t3"><img src="./images/t3.png" alt=""></p>
|
||||
<p class="jietu t3"><img src="https://img.pekolive.com/cf-t3.png" alt=""></p>
|
||||
例如購買1個5倍的番茄，中獎後獲得1*5*100的鉆石
|
||||
</div>
|
||||
<div class="qtsm">
|
||||
|
||||
@@ -137,6 +137,7 @@ const getNewestAct = () => {
|
||||
hideLoading(layerIndex)
|
||||
|
||||
roundId = res.data.roundId
|
||||
$('.game-area .roundId').html(roundId)
|
||||
getListItem(roundId, modelType)
|
||||
|
||||
// 進行下一輪時，arrTime重新置為空數組，不然在下一輪開始的時候也會執行location.reload()
|
||||
@@ -200,6 +201,7 @@ const showView = () => {
|
||||
console.log('進入第一階段');
|
||||
isSelectTab = false
|
||||
$('.select-time').show().siblings().hide()
|
||||
$('.roundId').show()
|
||||
$countDown = $('.select-time .count-down .count-down-num')
|
||||
|
||||
mySelect = sessionStorage.getItem("mySelect")
|
||||
@@ -227,6 +229,7 @@ const showView = () => {
|
||||
sessionStorage.removeItem("mySelect")
|
||||
|
||||
$('.wait-time').show().siblings().hide()
|
||||
$('.roundId').show()
|
||||
$countDown = $('.wait-time .count-down .count-down-num')
|
||||
|
||||
clearTimeout(timer2s) //清除第一階段的2s氣泡定時器
|
||||
@@ -245,7 +248,7 @@ const showView = () => {
|
||||
// 播放5s動畫
|
||||
let player = new SVGA.Player('.wait-time');
|
||||
let parser = new SVGA.Parser('.wait-time');
|
||||
parser.load('./images/wait.svga', function (videoItem) {
|
||||
parser.load('https://img.pekolive.com/cf-wait.svga', function (videoItem) {
|
||||
// player.loops = 2;
|
||||
player.clearsAfterStop = false;
|
||||
player.setVideoItem(videoItem);
|
||||
@@ -256,6 +259,7 @@ const showView = () => {
|
||||
// 第三階段
|
||||
console.log('進入第三階段');
|
||||
$('.draw-time').show().siblings().hide()
|
||||
$('.roundId').show()
|
||||
$countDown = $('.draw-time .count-down .count-down-num')
|
||||
|
||||
isStatus3 = true //處於第三階段的標識
|
||||
@@ -447,7 +451,7 @@ const renderDrawInfo = () => {
|
||||
<div class="item">
|
||||
<p><img src="${res.imgUrl}" class="gift" alt=""></p>
|
||||
<div>
|
||||
<img src="./images/diamond.png" class="diamond" alt="">
|
||||
<img src="https://img.pekolive.com/cf-diamond.png" class="diamond" alt="">
|
||||
<span class="in">${res.costPieceNum}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
let urlPrefix = getUrlPrefix()
|
||||
let browser = checkVersion()
|
||||
// 获取用户的游戏记录
|
||||
let recordList = []
|
||||
// let recordList = []
|
||||
let page = 1
|
||||
let pageSize = 10
|
||||
let canNext = true;
|
||||
|
||||
|
||||
let lisIndexId = 0;
|
||||
var lisIndex = 0;
|
||||
const toastMsg = (content = '', time = 2) => {
|
||||
layer.open({
|
||||
@@ -37,11 +37,13 @@ $(function () {
|
||||
if (res.data.length != 0) {
|
||||
// 能够继续请求下一页
|
||||
canNext = true
|
||||
// recordList.push(...res.data)
|
||||
renderRecord(res.data)
|
||||
} else {
|
||||
canNext = false
|
||||
toastMsg('沒有更多啦~')
|
||||
}
|
||||
recordList.push(...res.data)
|
||||
renderRecord(recordList)
|
||||
|
||||
} else {
|
||||
canNext = true
|
||||
toastMsg(res.message)
|
||||
@@ -60,14 +62,14 @@ $(function () {
|
||||
$('.record-list').hide();
|
||||
$('.img').show();
|
||||
} else {
|
||||
$('.record-list li').remove();
|
||||
// $('.record-list li').remove();
|
||||
$('.record-list').show();
|
||||
$('.img').hide();
|
||||
console.log(recordList, 'recordList')
|
||||
var drawId;
|
||||
var itemUrl;
|
||||
var results = [];
|
||||
let lisIndexId = 0;
|
||||
|
||||
|
||||
let str = '';
|
||||
recordList.forEach((res, index) => {
|
||||
@@ -84,6 +86,7 @@ $(function () {
|
||||
<li style="margin-bottom: 0.8rem;">
|
||||
<h3>${dateFormat(res.drawTime, 'yy-MM-dd hh:mm:ss')}</h3>
|
||||
<div class="goldBox">
|
||||
<span>NO.${res.roundId}</span>
|
||||
<p style="display: ${res.drawStatus == 1 ? 'none' : 'block'};" class="fasle">哎呀~猜錯了 o(╥﹏╥)o</p>
|
||||
<p style="display: ${res.drawStatus == 1 ? 'block' : 'none'};" class="true">厲害~猜對了 ୧(๑•̀◡•́๑)૭</p>
|
||||
</div>
|
||||
@@ -132,17 +135,16 @@ $(function () {
|
||||
|
||||
}
|
||||
|
||||
$(window).scroll(function () {
|
||||
if ($(window).scrollTop() + $(window).height() > $(document).height() - 10) {
|
||||
// 请求下一页
|
||||
if (canNext) {
|
||||
page++
|
||||
getUserRecord()
|
||||
} else {
|
||||
console.log('无数据被锁定');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
})
|
||||
|
||||
$(window).scroll(function () {
|
||||
if ($(window).scrollTop() + $(window).height() > $(document).height() - 10) {
|
||||
// 请求下一页
|
||||
if (canNext) {
|
||||
page++
|
||||
getUserRecord()
|
||||
} else {
|
||||
console.log('无数据被锁定');
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -16,10 +16,10 @@
|
||||
<!-- <li style="margin-bottom: 0.8rem;">
|
||||
<h3>${dateFormat(res.drawTime, 'yy-MM-dd hh:mm:ss')}</h3>
|
||||
<div class="goldBox">
|
||||
<p class="true">厲害~猜對了 ୧(๑•̀◡•́๑)૭</p>
|
||||
<span>NO.2212092000</span>
|
||||
<p class="fasle">哎呀~猜錯了 o(╥﹏╥)o</p>
|
||||
<p class="true">厲害~猜對了 ୧(๑•̀◡•́๑)૭</p>
|
||||
</div>
|
||||
<div class="marine_organism"></div>
|
||||
<div class="result-wrap">
|
||||
<div class="result">
|
||||
<span>本輪結果</span>
|
||||
@@ -34,11 +34,6 @@
|
||||
<div class="put-wrap">
|
||||
<div class="put">投入</div>
|
||||
<div class="list">
|
||||
<div class="item">
|
||||
<p><img src="" class="gift" alt=""></p>
|
||||
<img src="./images/diamond.png" class="diamond" alt="">
|
||||
<span class="in"></span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
<body>
|
||||
<div class="result">
|
||||
<div class="header">
|
||||
<img src="./images/count-down.png" class="title" alt="">
|
||||
<img src="https://img.pekolive.com/cf-count-down.png" class="title" alt="">
|
||||
<span>前50轮中奖结果</span>
|
||||
</div>
|
||||
<ul class="main">
|
||||
|
||||
@@ -1,108 +1,94 @@
|
||||
@font-face {
|
||||
font-family: 'pingfang-bold';
|
||||
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';
|
||||
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");
|
||||
}
|
||||
|
||||
body {
|
||||
width: 100%;
|
||||
font-family: 'pingfang-bold';
|
||||
font-family: "pingfang-bold";
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.wrap {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.wrap .tab_wrap {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 99;
|
||||
width: 100%;
|
||||
height: 2.66667rem;
|
||||
height: 2.6666666667rem;
|
||||
background: url("../images/top.png") no-repeat 0 0/100% 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.wrap .tab_wrap .tab_contain {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 8.53333rem;
|
||||
width: 8.5333333333rem;
|
||||
height: 0.96rem;
|
||||
margin: 0.66667rem auto 0.34667rem;
|
||||
margin: 0.6666666667rem auto 0.3466666667rem;
|
||||
background-color: #9785FA;
|
||||
border-radius: 0.53333rem;
|
||||
border-radius: 0.5333333333rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
|
||||
.wrap .tab_wrap .tab_contain p {
|
||||
width: 4.16rem;
|
||||
height: 0.85333rem;
|
||||
line-height: 0.85333rem;
|
||||
margin: 0 0.05333rem;
|
||||
height: 0.8533333333rem;
|
||||
line-height: 0.8533333333rem;
|
||||
margin: 0 0.0533333333rem;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.wrap .tab_wrap .tab_contain p.active {
|
||||
background-color: #fff;
|
||||
color: #7898F3;
|
||||
border-radius: 0.53333rem;
|
||||
border-radius: 0.5333333333rem;
|
||||
}
|
||||
|
||||
.wrap .tab_wrap .rank_type {
|
||||
display: flex;
|
||||
margin-left: 0.8rem;
|
||||
}
|
||||
|
||||
.wrap .tab_wrap .rank_type p {
|
||||
position: relative;
|
||||
margin-right: 0.42667rem;
|
||||
margin-right: 0.4266666667rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
font-size: 0.32rem;
|
||||
}
|
||||
|
||||
.wrap .tab_wrap .rank_type p.active {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.wrap .tab_wrap .rank_type p.active::after {
|
||||
content: '';
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: -0.21333rem;
|
||||
bottom: -0.2133333333rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 0.26667rem;
|
||||
height: 0.10667rem;
|
||||
border-radius: 0.05333rem;
|
||||
width: 0.2666666667rem;
|
||||
height: 0.1066666667rem;
|
||||
border-radius: 0.0533333333rem;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.wrap .tab_wrap .rank_type p:last-child {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap .top_three_wrap {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 5.33333rem;
|
||||
height: 5.3333333333rem;
|
||||
background: url("../images/topthree-bg.png") no-repeat 0 0/100% 100%;
|
||||
margin-top: 2.66667rem;
|
||||
margin-top: 2.6666666667rem;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap .top_three_wrap .top_three_item {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
@@ -111,42 +97,34 @@ body {
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(2), .wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(3) {
|
||||
left: 0.8rem;
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
.wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(2) .avatar, .wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(3) .avatar {
|
||||
width: 1.89333rem;
|
||||
height: 2.18667rem;
|
||||
margin-top: 1.49333rem;
|
||||
width: 1.8933333333rem;
|
||||
height: 2.1866666667rem;
|
||||
margin-top: 1.4933333333rem;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(2) .avatar p, .wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(3) .avatar p {
|
||||
background-image: url("../images/second.png");
|
||||
}
|
||||
|
||||
.wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(2) .avatar img, .wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(3) .avatar img {
|
||||
top: -1.76rem;
|
||||
width: 1.54667rem;
|
||||
height: 1.54667rem;
|
||||
width: 1.5466666667rem;
|
||||
height: 1.5466666667rem;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(3) {
|
||||
left: 6.88rem;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(3) .avatar p {
|
||||
background-image: url("../images/third.png");
|
||||
}
|
||||
|
||||
.wrap .rank_wrap .top_three_wrap .top_three_item .avatar {
|
||||
width: 2.32rem;
|
||||
height: 2.66667rem;
|
||||
margin: 0.45333rem auto 0.32rem;
|
||||
height: 2.6666666667rem;
|
||||
margin: 0.4533333333rem auto 0.32rem;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap .top_three_wrap .top_three_item .avatar p {
|
||||
position: relative;
|
||||
z-index: 99;
|
||||
@@ -154,99 +132,88 @@ body {
|
||||
height: 100%;
|
||||
background: url("../images/first.png") no-repeat 0 0/100% 100%;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap .top_three_wrap .top_three_item .avatar img {
|
||||
position: relative;
|
||||
top: -2.13333rem;
|
||||
top: -2.1333333333rem;
|
||||
width: 1.92rem;
|
||||
height: 1.92rem;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap .top_three_wrap .top_three_item .nick {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 0.32rem;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap .top_three_wrap .top_three_item .nick img {
|
||||
width: 0.4rem;
|
||||
width: 0.4rem;
|
||||
margin-left: 0.05333rem;
|
||||
margin-left: 0.0533333333rem;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap .top_three_wrap .top_three_item .erbanNo {
|
||||
font-size: 0.26667rem;
|
||||
font-size: 0.2666666667rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
margin: 0.10667rem 0 0.10667rem;
|
||||
margin: 0.1066666667rem 0 0.1066666667rem;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap .top_three_wrap .top_three_item .num {
|
||||
font-size: 0.37333rem;
|
||||
font-size: 0.3733333333rem;
|
||||
color: #FF7979;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap ul {
|
||||
height: 3.73333rem;
|
||||
margin-top: 0.45333rem;
|
||||
height: 3.7333333333rem;
|
||||
margin-top: 0.4533333333rem;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap ul li {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 0.42667rem;
|
||||
margin-bottom: 0.4266666667rem;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap ul li .index {
|
||||
width: 0.4rem;
|
||||
text-align: center;
|
||||
font-size: 0.48rem;
|
||||
font-weight: bold;
|
||||
color: #666;
|
||||
margin: 0 0.53333rem;
|
||||
margin: 0 0.5333333333rem;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap ul li .others_avatar {
|
||||
width: 1.33333rem;
|
||||
height: 1.33333rem;
|
||||
margin-right: 0.42667rem;
|
||||
width: 1.3333333333rem;
|
||||
height: 1.3333333333rem;
|
||||
margin-right: 0.4266666667rem;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap ul li .others_avatar img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap ul li .info_wrap {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
height: 0.93333rem;
|
||||
height: 0.9333333333rem;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap ul li .info_wrap .others_nick {
|
||||
color: #333;
|
||||
font-size: 0.37333rem;
|
||||
font-size: 0.3733333333rem;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap ul li .info_wrap .others_nick img {
|
||||
width: 0.4rem;
|
||||
height: 0.4rem;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
.wrap .rank_wrap ul li .info_wrap .others_erbanNo {
|
||||
color: rgba(102, 102, 102, 0.6);
|
||||
}
|
||||
|
||||
.wrap .rank_wrap ul li .others_num {
|
||||
color: #FF7979;
|
||||
font-size: 0.37333rem;
|
||||
font-size: 0.3733333333rem;
|
||||
font-weight: bold;
|
||||
margin-right: 0.66667rem;
|
||||
margin-right: 0.6666666667rem;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=index.css.map */
|
||||
|
||||
@@ -191,6 +191,8 @@ body{
|
||||
height: px2rem(100, );
|
||||
margin-right: px2rem(32, );
|
||||
img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user