diff --git a/view/molistar/activity/exp/css/DIN-BlackItalic.ttf b/view/molistar/activity/exp/css/DIN-BlackItalic.ttf new file mode 100644 index 00000000..522cc2db Binary files /dev/null and b/view/molistar/activity/exp/css/DIN-BlackItalic.ttf differ diff --git a/view/molistar/activity/exp/css/Source-KeynoteartHans.ttf b/view/molistar/activity/exp/css/Source-KeynoteartHans.ttf new file mode 100644 index 00000000..273aa307 Binary files /dev/null and b/view/molistar/activity/exp/css/Source-KeynoteartHans.ttf differ diff --git a/view/molistar/activity/exp/css/index.css b/view/molistar/activity/exp/css/index.css new file mode 100644 index 00000000..04dd0a77 --- /dev/null +++ b/view/molistar/activity/exp/css/index.css @@ -0,0 +1,1291 @@ +@font-face { + font-family: 'SourceKeynoteartHans'; + src: url("./Source-KeynoteartHans.ttf"); +} + +@font-face { + font-family: 'DINBlackItalic'; + src: url("./DIN-BlackItalic.ttf"); +} + +html, +body { + width: 100%; + background: #0C0538; +} + +.back { + width: 100%; + height: 0.58667rem; + line-height: 0.58667rem; + position: fixed; + left: 0; + top: 0.86667rem; + text-align: center; + color: #FFFFFF; + font-size: 0.50667rem; + font-weight: bold; + z-index: 10; +} + +.back img { + width: 0.58667rem; + height: 0.58667rem; + position: absolute; + left: 0.24rem; + top: 0rem; +} + +.header { + width: 10rem; + height: 9.92rem; + background: url(../images/header.png) no-repeat; + background-size: 100% 100%; + margin: 0 auto 0; + position: relative; +} + +.header .ruleIcon { + width: 1.84rem; + height: 0.69333rem; + line-height: 0.69333rem; + position: absolute; + right: 0; + top: 4.90667rem; + color: #FBA5FF; + font-weight: bold; + font-size: 0.37333rem; + text-align: center; + background: url(../images/rule_iconBg.png) no-repeat; + background-size: 100% 100%; + text-indent: 13px; + text-shadow: 0.02667rem 0rem 0rem #7D0084; + text-align: center; + font-style: normal; +} + +.header .tiem { + width: 100%; + position: absolute; + top: 5.94667rem; + left: 50%; + transform: translateX(-50%); + text-align: center; + color: #fff; + font-weight: 400; + font-size: 0.32rem; + text-shadow: 0rem 0rem 0.08rem #FF7A7A; + -webkit-text-stroke: 0.01333rem #FF7A7A; + font-family: 'SourceKeynoteartHans', sans-serif; +} + +.giftBox { + width: 9.17333rem; + height: 18.08rem; + margin: -0.46667rem auto 1.09333rem; + position: relative; + background: url(../images/giftBg.png) no-repeat; + background-size: 100% 100%; + overflow: hidden; +} + +.giftBox h3 { + width: 100%; + text-align: center; + color: #E0C677; + font-size: 0.42667rem; + font-weight: 500; + margin-top: 3.94667rem; +} + +.giftBox .textBox { + width: 7.89333rem; + height: 2rem; + margin: 0.26667rem auto 0.90667rem; + background: url(../images/textBox.png) no-repeat; + background-size: 100% 100%; + position: relative; + box-sizing: border-box; + padding-top: 0.24rem; +} + +.giftBox .textBox .vip { + width: 2.58667rem; + height: 2.50667rem; + position: absolute; + left: -0.26667rem; + top: 0rem; +} + +.giftBox .textBox .p1 { + width: 100%; + box-sizing: border-box; + text-align: right; + padding-right: 0.69333rem; + color: #E0C677; + font-size: 0.32rem; + font-weight: 400; +} + +.giftBox .textBox .p2 { + width: 100%; + box-sizing: border-box; + text-align: right; + padding-right: 0.93333rem; + color: #E0C677; + margin-top: 0.18667rem; + font-size: 0.69333rem; + font-weight: 400; + font-family: 'DINBlackItalic'; +} + +.giftBox .giftList { + width: 7.89333rem; + height: 8.66667rem; + margin: 0 auto 0; + display: flex; + justify-content: space-between; + flex-wrap: wrap; +} + +.giftBox .giftList div { + width: 3.6rem; + height: 3.6rem; + background: url(../images/giftListBg.png) no-repeat; + background-size: 100% 100%; + position: relative; + margin-bottom: 1.44rem; +} + +.giftBox .giftList div .exp { + width: 2.05333rem; + height: 1.06667rem; + line-height: 0.66667rem; + font-weight: 600; + position: absolute; + left: 0; + top: 0; + text-align: center; + color: #7F5300; + font-size: 0.26667rem; + background: url(../images/expIcon.png) no-repeat; + background-size: 100% 100%; + white-space: nowrap; +} + +.giftBox .giftList div .gift { + width: 2.50667rem; + height: 2.50667rem; + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); +} + +.giftBox .giftList div p { + width: 100%; + text-align: center; + color: #C5C3CF; + font-size: 0.42667rem; + position: absolute; + left: 50%; + transform: translateX(-50%); + bottom: -0.53333rem; + font-weight: 500; + white-space: nowrap; +} + +.giftBox .giftList div span { + width: 100%; + text-align: center; + position: absolute; + left: 50%; + transform: translateX(-50%); + bottom: -1.09333rem; + height: 0.29333rem; + line-height: 0.29333rem; +} + +.giftBox .giftList div span img { + width: 0.4rem; + height: 0.29333rem; + display: inline-block; +} + +.giftBox .giftList div span i { + font-style: normal; + display: inline-block; + color: #EE9E37; + font-size: 0.32rem; +} + +.listBox { + width: 9.14667rem; + height: 25.57333rem; + margin: 0 auto 0.88rem; + background: url(../images/listBox.png) no-repeat; + background-size: 100% 100%; + box-sizing: border-box; + position: relative; + padding-top: 0.85333rem; +} + +.listBox .tab { + position: absolute; + width: 7.46667rem; + height: 0.85333rem; + line-height: 0.85333rem; + top: -0.42667rem; + left: 50%; + transform: translateX(-50%); + display: flex; + justify-content: space-between; + font-weight: 600; +} + +.listBox .tab div { + text-align: center; + width: 3.62667rem; + font-size: 0.37333rem; +} + +.listBox .tab .tab1 { + color: #B37500; + background: url(../images/tab1.png) no-repeat; + background-size: 100% 100%; +} + +.listBox .tab .tab2 { + color: #E0BEFF; + background: url(../images/tab2.png) no-repeat; + background-size: 100% 100%; +} + +.listBox h3 { + width: 100%; + height: 0.4rem; + line-height: 0.4rem; + text-align: center; + margin: 0 auto 0.96rem; + color: #C9C7D3; + font-size: 0.32rem; + font-weight: 400; +} + +.listBox h3 img { + width: 0.4rem; + height: 0.4rem; + display: inline-block; + margin-left: 0.26667rem; +} + +.listBox .expBox { + width: 7.52rem; + height: 22.90667rem; + background: url(../images/boxBg.png) no-repeat; + background-size: 100% 100%; + margin: 0 auto 0; + position: relative; +} + +.listBox .expBox .dam { + position: absolute; + width: 1.81333rem; + height: 1.84rem; + right: -0.34667rem; + top: -1.01333rem; +} + +.listBox .expBox .top { + width: 7.54667rem; + height: 1.6rem; + line-height: 1.6rem; + color: #A897FF; + font-size: 0.42667rem; + font-weight: 600; + display: flex; +} + +.listBox .expBox .top div { + text-align: center; +} + +.listBox .expBox .top .l { + flex: 2.5; +} + +.listBox .expBox .top .r { + flex: 7.5; +} + +.listBox .expBox .bottom { + overflow: hidden; + width: 7.54667rem; + height: 2.42667rem; + line-height: 2.42667rem; + color: #A897FF; + font-size: 0.42667rem; + font-weight: 600; + display: flex; +} + +.listBox .expBox .bottom div { + text-align: center; +} + +.listBox .expBox .bottom .l { + flex: 2.5; +} + +.listBox .expBox .bottom .r { + flex: 7.5; +} + +.listBox .expBox .bottom .r .gift_sbox { + width: 1.52rem; + height: 1.38667rem; + background: url(../images/s-giftBg.png) no-repeat; + background-size: 100% 100%; + position: relative; + float: left; + margin-top: 0.26667rem; + margin-left: 0.26667rem; +} + +.listBox .expBox .bottom .r .gift_sbox .title { + width: 1.12rem; + height: 0.32rem; + line-height: 0.26667rem; + position: absolute; + top: 0.08rem; + left: 50%; + transform: translateX(-50%); + text-align: center; + color: #BE7800; + font-size: 0.24rem; + font-weight: 400; + background: url(../images/title.png) no-repeat; + background-size: 100% 100%; + z-index: 2; +} + +.listBox .expBox .bottom .r .gift_sbox .gift { + width: 1.25333rem; + height: 0.88rem; + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); +} + +.listBox .expBox .bottom .r .gift_sbox .ts { + width: 1.2rem; + height: 1.2rem; + top: 53%; +} + +.listBox .expBox .bottom .r .gift_sbox .xz { + width: 1.2rem; + height: 1.2rem; + top: 55%; +} + +.listBox .expBox .bottom .r .gift_sbox .qp { + width: 1.25333rem; + height: 0.98667rem; + top: 60%; +} + +.listBox .expBox .bottom .r .gift_sbox .zj { + width: 1.52rem; + height: 1.06667rem; + top: 54%; +} + +.listBox .expBox .bottom .r .gift_sbox p { + width: 100%; + height: 0.32rem; + line-height: 0.32rem; + text-align: center; + color: #C9C7D3; + font-size: 0.32rem; + font-weight: 400; + position: absolute; + left: 50%; + transform: translateX(-50%); + bottom: -0.53333rem; + white-space: nowrap; +} + +.listBox .expBox .bottom .r .gift_sbox p img { + display: inline-block; + width: 0.32rem; + height: 0.32rem; +} + +.listBox .expBox .bottom .r .but { + width: 1.46667rem; + height: 0.65333rem; + border-radius: 0.65333rem; + line-height: 0.65333rem; + color: #ECCE91; + font-size: 0.32rem; + font-weight: 400; + background: #857277; + margin-top: 0.93333rem; + margin-left: 0.34667rem; + float: left; +} + +.listBox .expBox .bottom .r .act { + color: #A06C00; + background: #ECCE91; +} + +.listBox .expBox .my { + width: 7.52rem; + height: 1.86667rem; + background: #221A58; + box-shadow: 0px 0px 0.26667rem 0px rgba(195, 183, 255, 0.37); + border-radius: 0px 0px 0.21333rem 0.21333rem; + border: 0.05333rem solid #C3B7FF; + box-sizing: border-box; +} + +.listBox .expBox .my .tx { + float: left; + display: block; + width: 1.12rem; + height: 1.12rem; + border-radius: 50%; + box-sizing: border-box; + margin-top: 0.16rem; + margin-left: 0.58667rem; + margin-right: 0.26667rem; +} + +.listBox .expBox .my .user { + float: left; +} + +.listBox .expBox .my .user p { + width: 4.74667rem; + color: #D4CEFF; + font-size: 0.42667rem; + font-weight: 500; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + margin-top: 0.2rem; + margin-bottom: 0.16rem; +} + +.listBox .expBox .my .user .lineBox { + width: 4.74667rem; + height: 0.32rem; + margin-bottom: 0.10667rem; + background: rgba(195, 183, 255, 0.3); + border-radius: 0.32rem; + border: 0.02667rem solid #C3B7FF; + position: relative; + overflow: hidden; + box-sizing: border-box; +} + +.listBox .expBox .my .user .lineBox .line { + width: 10%; + height: 100%; + position: absolute; + left: 0; + top: 0; +} + +.listBox .expBox .my .user .lineBox .content { + width: 100%; + height: 100%; + position: absolute; + left: 0; + top: 0; + text-align: center; + color: #D3CAFF; + font-size: 0.29333rem; + font-weight: 400; +} + +.listBox .expBox .my .user .exp { + width: 4.74667rem; + display: flex; + justify-content: space-between; + color: #8079B0; + font-size: 0.32rem; + font-weight: 400; +} + +.listBox2 { + width: 9.14667rem; + height: 39.68rem; + margin: 0 auto 0.88rem; + background: url(../images/listBox2.png) no-repeat; + background-size: 100% 100%; + box-sizing: border-box; + position: relative; + padding-top: 13.62667rem; + display: none; +} + +.listBox2 .tab { + position: absolute; + width: 7.46667rem; + height: 0.85333rem; + line-height: 0.85333rem; + top: -0.42667rem; + left: 50%; + transform: translateX(-50%); + display: flex; + justify-content: space-between; + font-weight: 600; +} + +.listBox2 .tab div { + text-align: center; + width: 3.62667rem; + font-size: 0.37333rem; +} + +.listBox2 .tab .tab1 { + color: #B37500; + background: url(../images/tab1.png) no-repeat; + background-size: 100% 100%; +} + +.listBox2 .tab .tab2 { + color: #E0BEFF; + background: url(../images/tab2.png) no-repeat; + background-size: 100% 100%; +} + +.listBox2 .topReward { + width: 9.57333rem; + height: 12.53333rem; + background: url(../images/topReward.png) no-repeat; + background-size: 100% 100%; + position: absolute; + top: 0.96rem; + left: 50%; + transform: translateX(-50%); +} + +.listBox2 .topReward .listRule { + width: 1.6rem; + height: 0.61333rem; + line-height: 0.61333rem; + text-align: center; + color: #725B00; + font-size: 0.26667rem; + position: absolute; + right: 0.69333rem; + top: 1.14667rem; + background: linear-gradient(180deg, #F8BA47 0%, #FFF297 100%); + border-radius: 0.21333rem 0px 0px 0.21333rem; +} + +.listBox2 .content1 { + width: 6.61333rem; + height: 0.90667rem; + text-align: center; + color: #C5C3CF; + font-size: 0.32rem; + font-weight: 500; + margin: 0 auto 0.13333rem; + line-height: 0.45rem; +} + +.listBox2 .content2 { + width: 100%; + text-align: center; + color: #C5C3CF; + font-size: 0.26667rem; + font-weight: 500; + margin: 0 auto 0.13333rem; + line-height: 0.4rem; +} + +.listBox2 .top1 { + width: 4.32rem; + height: 4.32rem; + position: absolute; + top: 16.13333rem; + left: 50%; + transform: translateX(-50%); +} + +.listBox2 .top1 .ts { + width: 100%; + height: 100%; + position: absolute; + left: 0; + top: 0; + z-index: 2; +} + +.listBox2 .top1 .tx { + width: 2.6rem; + height: 2.6rem; + position: absolute; + top: 0.8rem; + left: 50%; + transform: translateX(-51%); + border-radius: 50%; +} + +.listBox2 .top1 .nick { + width: 65%; + height: 0.58667rem; + position: absolute; + left: 50%; + transform: translateX(-50%); + top: 4.53333rem; + color: #FFFA8B; + font-size: 0.42667rem; + text-align: center; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + font-weight: 500; +} + +.listBox2 .top1 .score { + width: 65%; + height: 0.58667rem; + position: absolute; + left: 50%; + transform: translateX(-50%); + top: 5.06667rem; + color: #FFFA8B; + font-size: 0.42667rem; + text-align: center; + font-weight: 400; +} + +.listBox2 .top2 { + width: 4.32rem; + height: 4.32rem; + position: absolute; + top: 21.36rem; + left: 0rem; +} + +.listBox2 .top2 .ts { + width: 100%; + height: 100%; + position: absolute; + left: 0; + top: 0; + z-index: 2; +} + +.listBox2 .top2 .tx { + width: 2.6rem; + height: 2.6rem; + position: absolute; + top: 0.53333rem; + left: 50%; + transform: translateX(-51%); + border-radius: 50%; +} + +.listBox2 .top2 .nick { + width: 65%; + height: 0.58667rem; + position: absolute; + left: 50%; + transform: translateX(-50%); + top: 4.53333rem; + color: #FFFA8B; + font-size: 0.42667rem; + text-align: center; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + font-weight: 500; +} + +.listBox2 .top2 .score { + width: 65%; + height: 0.58667rem; + position: absolute; + left: 50%; + transform: translateX(-50%); + top: 5.06667rem; + color: #FFFA8B; + font-size: 0.42667rem; + text-align: center; + font-weight: 400; +} + +.listBox2 .top3 { + width: 4.32rem; + height: 4.32rem; + position: absolute; + top: 21.36rem; + right: 0rem; +} + +.listBox2 .top3 .ts { + width: 100%; + height: 100%; + position: absolute; + left: 0; + top: 0; + z-index: 2; +} + +.listBox2 .top3 .tx { + width: 3.2rem; + height: 3.2rem; + position: absolute; + top: 0.53333rem; + left: 50%; + transform: translateX(-51%); + border-radius: 50%; +} + +.listBox2 .top3 .nick { + width: 65%; + height: 0.58667rem; + position: absolute; + left: 50%; + transform: translateX(-50%); + top: 4.53333rem; + color: #FFFA8B; + font-size: 0.42667rem; + text-align: center; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + font-weight: 500; +} + +.listBox2 .top3 .score { + width: 65%; + height: 0.58667rem; + position: absolute; + left: 50%; + transform: translateX(-50%); + top: 5.06667rem; + color: #FFFA8B; + font-size: 0.42667rem; + text-align: center; + font-weight: 400; +} + +.listBox2 ul { + width: 9.09333rem; + height: 10.29333rem; + overflow-y: scroll; + background: url(../images/ulBg.png) no-repeat; + background-size: 100% 100%; + margin: 13.46667rem auto 0; + padding-bottom: 2.4rem; +} + +.listBox2 ul::-webkit-scrollbar { + display: none; +} + +.listBox2 ul li { + width: 100%; + height: 1.81333rem; + border-bottom: 0.02667rem solid; + border-image: linear-gradient(225deg, #f8d296, #eccd81, #97561b, #e0ab28) 2 2; + box-sizing: border-box; + overflow: hidden; + padding: 0 0.26667rem 0 0.29333rem; +} + +.listBox2 ul li .num { + float: left; + width: 0.93333rem; + line-height: 1.81333rem; + height: 100%; + color: #FFFA8B; + font-size: 0.32rem; + font-weight: 400; + margin-right: 0.4rem; +} + +.listBox2 ul li .tx { + display: block; + float: left; + margin-top: 0.34667rem; + margin-right: 0.13333rem; + border-radius: 50%; + width: 1.12rem; + height: 1.12rem; +} + +.listBox2 ul li .nick { + width: 3rem; + line-height: 1.81333rem; + height: 100%; + float: left; + color: #FFFA8B; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + font-size: 0.42667rem; + font-weight: 500; +} + +.listBox2 ul li .right { + float: right; + text-align: right; +} + +.listBox2 ul li .right p { + color: #B4B04F; + font-size: 0.32rem; + font-weight: 400; + margin-bottom: 0.26667rem; + margin-top: 0.4rem; +} + +.listBox2 ul li .right span { + color: #FFFA8B; + font-size: 0.42667rem; + font-weight: 400; + display: block; +} + +.listBox2 .my { + position: fixed; + left: 0; + bottom: 0; + width: 100%; + height: 1.81333rem; + box-sizing: border-box; + padding: 0 0.26667rem 0 0.29333rem; + background: #221A58; + border-radius: 0.26667rem 0.26667rem 0 0; + z-index: 8; +} + +.listBox2 .my .rank { + position: absolute; + top: -0.61333rem; + left: 50%; + transform: translateX(-50%); + width: 4.24rem; + height: 1.22667rem; + line-height: 1.22667rem; + background: url(../images/myListBg.png) no-repeat; + background-size: 100% 100%; + text-align: center; + color: #FFFA8B; + font-size: 0.32rem; + font-weight: 500; +} + +.listBox2 .my .num { + float: left; + width: 0.93333rem; + line-height: 1.81333rem; + height: 100%; + color: #FFFA8B; + font-size: 0.32rem; + font-weight: 400; + margin-right: 0.4rem; + white-space: nowrap; +} + +.listBox2 .my .tx { + display: block; + float: left; + margin-top: 0.34667rem; + margin-right: 0.13333rem; + border-radius: 50%; + width: 1.12rem; + height: 1.12rem; +} + +.listBox2 .my .nick { + width: 3rem; + line-height: 1.81333rem; + height: 100%; + float: left; + color: #FFFA8B; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + font-size: 0.42667rem; + font-weight: 500; +} + +.listBox2 .my .right { + float: right; + text-align: right; +} + +.listBox2 .my .right p { + color: #B4B04F; + font-size: 0.32rem; + font-weight: 400; + margin-bottom: 0.26667rem; + margin-top: 0.4rem; +} + +.listBox2 .my .right span { + color: #FFFA8B; + font-size: 0.42667rem; + font-weight: 400; + display: block; + margin-top: 0.75rem; +} + +.exp_pub { + position: fixed; + left: 0; + top: 0; + bottom: 0; + right: 0; + z-index: 9; + background: rgba(0, 0, 0, 0.46); + display: none; +} + +.exp_pub .exp_pub_in { + width: 9.14667rem; + height: 17.14667rem; + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + background: url(../images/expRule.png) no-repeat; + background-size: 100% 100%; + padding-top: 0.93333rem; + box-sizing: border-box; +} + +.exp_pub .exp_pub_in .title { + width: 4.48rem; + height: 1.38667rem; + line-height: 1.38667rem; + text-align: center; + color: #E1D6FF; + font-size: 0.42667rem; + font-weight: 600; + top: -0.69333rem; + position: absolute; + left: 50%; + transform: translateX(-50%); + background: url(../images/expTitle.png) no-repeat; + background-size: 100% 100%; +} + +.exp_pub .exp_pub_in h3 { + width: 100%; + text-align: center; + color: #C9C7D3; + font-size: 0.32rem; + font-weight: 400; + margin-bottom: 0.53333rem; +} + +.exp_pub .exp_pub_in .box { + width: 7.52rem; + height: 14.32rem; + background: linear-gradient(180deg, #473891 0%, #221A58 100%); + border-radius: 0.21333rem; + border: 0.05333rem solid #C3B7FF; + margin: 0 auto; + overflow-y: scroll; +} + +.exp_pub .exp_pub_in .box::-webkit-scrollbar { + display: none; +} + +.exp_pub .exp_pub_in .box .top { + width: 7.52rem; + height: 1.6rem; + line-height: 1.6rem; + color: #A897FF; + font-size: 0.42667rem; + font-weight: 600; + display: flex; +} + +.exp_pub .exp_pub_in .box .top div { + text-align: center; +} + +.exp_pub .exp_pub_in .box .top .l { + flex: 3; + border-right: 0.05333rem solid #C3B7FF; + border-bottom: 0.05333rem solid #C3B7FF; +} + +.exp_pub .exp_pub_in .box .top .r { + flex: 7; + border-bottom: 0.05333rem solid #C3B7FF; +} + +.exp_pub .exp_pub_in .box .bottom { + width: 7.52rem; + height: 1.38667rem; + line-height: 1.38667rem; + color: #C3B7FF; + font-size: 0.42667rem; + font-weight: 600; + display: flex; +} + +.exp_pub .exp_pub_in .box .bottom div { + text-align: center; +} + +.exp_pub .exp_pub_in .box .bottom .l { + flex: 3; + border-right: 0.05333rem solid #C3B7FF; + border-bottom: 0.05333rem solid #C3B7FF; +} + +.exp_pub .exp_pub_in .box .bottom .r { + flex: 7; + border-bottom: 0.05333rem solid #C3B7FF; + color: #C9C7D3; +} + +.rule { + position: fixed; + left: 0; + top: 0; + bottom: 0; + right: 0; + z-index: 9; + background: rgba(0, 0, 0, 0.46); + display: none; +} + +.rule .rule_in { + width: 9.14667rem; + height: 13.68rem; + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + background: url(../images/ruleBg.png) no-repeat; + background-size: 100% 100%; + padding-top: 0.93333rem; + box-sizing: border-box; + overflow: hidden; +} + +.rule .rule_in .tab { + width: 5.44rem; + height: 0.90667rem; + line-height: 0.90667rem; + display: flex; + justify-content: space-between; + margin: 0 auto; +} + +.rule .rule_in .tab div { + text-align: center; + width: 2.45333rem; + font-size: 0.42667rem; + font-weight: 400; + border-radius: 0.21333rem; + white-space: nowrap; +} + +.rule .rule_in .tab .stab1 { + background: #857277; + color: #B9A084; +} + +.rule .rule_in .tab .stab2 { + background: #493D9A; + color: #8377CB; +} + +.rule .rule_in .tab .act1 { + background: linear-gradient(135deg, #F8BA47 0%, #FFF297 100%); + color: #DC7400; + font-weight: 500; +} + +.rule .rule_in .tab .act2 { + background: linear-gradient(135deg, #67309F 0%, #AF7ADC 100%); + color: #BEB4FF; + font-weight: 500; +} + +.rule .rule_in .box { + width: 8.26667rem; + height: 10.6rem; + overflow-y: scroll; + margin: 0.53333rem auto 0; +} + +.rule .rule_in .box::-webkit-scrollbar { + display: none; +} + +.rule .rule_in .box img { + width: 8.26667rem; + display: block; +} + +.rule .rule_in .box .img1 { + height: 31.38667rem; +} + +.rule .rule_in .box .img2 { + height: 43.73333rem; + display: none; +} + +.english .giftBox .textBox .p1 { + width: 70%; + margin-left: 2rem; + padding-right: 0; + line-height: 0.34rem; +} + +.english .giftBox .giftList div .exp { + font-size: 0.26667rem; +} + +.english .giftBox .giftList div p { + font-size: 0.34667rem; +} + +.english .rule .rule_in .tab { + width: 7.44rem; +} + +.english .rule .rule_in .tab div { + width: 3.5rem; + font-size: 0.33333rem; +} + +.english .listBox2 .content1 { + font-size: 0.29333rem; + width: 8rem; +} + +.english .listBox2 .my .num { + margin-right: 0.9rem; +} + +.english .listBox2 .my .rank { + display: none; +} + +.arabic .header .tiem { + top: 6.1rem; +} + +.arabic .header .ruleIcon { + text-indent: -13px; +} + +.arabic .giftBox .textBox .p1 { + width: 75%; + padding-right: 0; + white-space: nowrap; + font-size: 0.21333rem; +} + +.arabic .giftBox .giftList div .exp { + font-size: 0.29333rem; +} + +.arabic .listBox .expBox { + background: url(../images/boxBg2.png) no-repeat; + background-size: 100% 100%; +} + +.arabic .listBox .expBox .bottom .r .but { + float: right; + white-space: nowrap; + font-size: 0.25333rem; + margin-left: 0; + margin-right: 0.2rem; +} + +.arabic .listBox .expBox .bottom .r .gift_sbox { + float: right; +} + +.arabic .listBox .expBox .bottom .l { + margin-right: 0.05rem; + margin-left: 0.1rem; + font-size: 0.32rem; +} + +.arabic .listBox .expBox .my .tx { + float: right; +} + +.arabic .listBox .expBox .my .user { + float: right; +} + +.arabic .listBox .expBox .my .user .lineBox .line { + left: auto; + right: 0; +} + +.arabic .rule .rule_in .tab div { + font-size: 0.33333rem; +} + +.arabic .listBox2 .my .rank { + display: none; +} + +.arabic .listBox2 .my .num { + float: right; + margin-right: 0; + margin-left: 0.6rem; +} + +.arabic .listBox2 .my .tx { + float: right; + margin-right: 0; + margin-left: 0.3rem; +} + +.arabic .listBox2 .my .nick { + float: right; +} + +.arabic .listBox2 .my .right { + float: left; +} + +.arabic .listBox2 ul li .right { + float: left; + text-align: left; +} + +.arabic .listBox2 ul li .nick { + float: right; +} + +.arabic .listBox2 ul li .tx { + float: right; + margin-left: 0.2rem; +} + +.arabic .listBox2 ul li .num { + float: right; + margin-right: 0; + margin-left: 0rem; +} + +.arabic .listBox2 .topReward .listRule { + right: 0.3rem; +} diff --git a/view/molistar/activity/exp/css/index.scss b/view/molistar/activity/exp/css/index.scss new file mode 100644 index 00000000..603eebf6 --- /dev/null +++ b/view/molistar/activity/exp/css/index.scss @@ -0,0 +1,1313 @@ +@function px2rem($px) { + @return $px / 75+rem; +} + +@font-face { + font-family: 'SourceKeynoteartHans'; + src: url('./Source-KeynoteartHans.ttf'); +} + +@font-face { + font-family: 'DINBlackItalic'; + src: url('./DIN-BlackItalic.ttf'); +} + +html, +body { + width: 100%; + background: #0C0538; +} + +.back { + width: 100%; + height: px2rem(44); + line-height: px2rem(44); + position: fixed; + left: 0; + top: px2rem(65); + text-align: center; + color: #FFFFFF; + font-size: px2rem(38); + font-weight: bold; + z-index: 10; + + img { + width: px2rem(44); + height: px2rem(44); + position: absolute; + left: px2rem(18); + top: px2rem(0); + } +} + +.header { + width: px2rem(750); + height: px2rem(744); + background: url(../images/header.png) no-repeat; + background-size: 100% 100%; + margin: 0 auto 0; + position: relative; + + .ruleIcon { + width: px2rem(138); + height: px2rem(52); + line-height: px2rem(52); + position: absolute; + right: 0; + top: px2rem(368); + color: #FBA5FF; + font-weight: bold; + font-size: px2rem(28); + text-align: center; + background: url(../images/rule_iconBg.png) no-repeat; + background-size: 100% 100%; + text-indent: 13px; + text-shadow: px2rem(2) px2rem(0) px2rem(0) #7D0084; + text-align: center; + font-style: normal; + } + + .tiem { + width: 100%; + position: absolute; + top: px2rem(446); + left: 50%; + transform: translateX(-50%); + text-align: center; + color: #fff; + font-weight: 400; + font-size: px2rem(24); + text-shadow: px2rem(0) px2rem(0) px2rem(6) #FF7A7A; + -webkit-text-stroke: px2rem(1) #FF7A7A; + font-family: 'SourceKeynoteartHans', sans-serif; + } +} + +.giftBox { + width: px2rem(688); + height: px2rem(1356); + margin: px2rem(-35) auto px2rem(82); + position: relative; + background: url(../images/giftBg.png) no-repeat; + background-size: 100% 100%; + overflow: hidden; + + h3 { + width: 100%; + text-align: center; + color: #E0C677; + font-size: px2rem(32); + font-weight: 500; + margin-top: px2rem(296); + } + + .textBox { + width: px2rem(592); + height: px2rem(150); + margin: px2rem(20) auto px2rem(68); + background: url(../images/textBox.png) no-repeat; + background-size: 100% 100%; + position: relative; + box-sizing: border-box; + padding-top: px2rem(18); + + .vip { + width: px2rem(194); + height: px2rem(188); + position: absolute; + left: px2rem(-20); + top: px2rem(0); + } + + .p1 { + width: 100%; + box-sizing: border-box; + text-align: right; + padding-right: px2rem(52); + color: #E0C677; + font-size: px2rem(24); + font-weight: 400; + } + + .p2 { + width: 100%; + box-sizing: border-box; + text-align: right; + padding-right: px2rem(70); + color: #E0C677; + margin-top: px2rem(14); + font-size: px2rem(52); + font-weight: 400; + font-family: 'DINBlackItalic'; + } + } + + .giftList { + width: px2rem(592); + height: px2rem(650); + margin: 0 auto 0; + display: flex; + justify-content: space-between; + flex-wrap: wrap; + + div { + width: px2rem(270); + height: px2rem(270); + background: url(../images/giftListBg.png) no-repeat; + background-size: 100% 100%; + position: relative; + margin-bottom: px2rem(108); + + .exp { + width: px2rem(154); + height: px2rem(80); + line-height: px2rem(50); + font-weight: 600; + position: absolute; + left: 0; + top: 0; + text-align: center; + color: #7F5300; + font-size: px2rem(20); + background: url(../images/expIcon.png) no-repeat; + background-size: 100% 100%; + white-space: nowrap; + } + + .gift { + width: px2rem(188); + height: px2rem(188); + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + } + + p { + width: 100%; + text-align: center; + color: #C5C3CF; + font-size: px2rem(32); + position: absolute; + left: 50%; + transform: translateX(-50%); + bottom: px2rem(-40); + font-weight: 500; + white-space: nowrap; + } + + span { + width: 100%; + text-align: center; + position: absolute; + left: 50%; + transform: translateX(-50%); + bottom: px2rem(-82); + height: px2rem(22); + line-height: px2rem(22); + + img { + width: px2rem(30); + height: px2rem(22); + display: inline-block; + } + + i { + font-style: normal; + display: inline-block; + color: #EE9E37; + font-size: px2rem(24); + } + } + } + } +} + +.listBox { + width: px2rem(686); + height: px2rem(1918); + margin: 0 auto px2rem(66); + background: url(../images/listBox.png) no-repeat; + background-size: 100% 100%; + box-sizing: border-box; + position: relative; + padding-top: px2rem(64); + // display: none; + + .tab { + position: absolute; + width: px2rem(560); + height: px2rem(64); + line-height: px2rem(64); + top: px2rem(-32); + left: 50%; + transform: translateX(-50%); + display: flex; + justify-content: space-between; + font-weight: 600; + + div { + text-align: center; + width: px2rem(272); + font-size: px2rem(28); + } + + .tab1 { + color: #B37500; + background: url(../images/tab1.png) no-repeat; + background-size: 100% 100%; + } + + .tab2 { + color: #E0BEFF; + background: url(../images/tab2.png) no-repeat; + background-size: 100% 100%; + } + } + + h3 { + width: 100%; + height: px2rem(30); + line-height: px2rem(30); + text-align: center; + margin: 0 auto px2rem(72); + color: #C9C7D3; + font-size: px2rem(24); + font-weight: 400; + + img { + width: px2rem(30); + height: px2rem(30); + display: inline-block; + margin-left: px2rem(20); + } + } + + .expBox { + width: px2rem(564); + height: px2rem(1718); + background: url(../images/boxBg.png) no-repeat; + background-size: 100% 100%; + margin: 0 auto 0; + position: relative; + + .dam { + position: absolute; + width: px2rem(136); + height: px2rem(138); + right: px2rem(-26); + top: px2rem(-76); + } + + .top { + width: px2rem(566); + height: px2rem(120); + line-height: px2rem(120); + color: #A897FF; + font-size: px2rem(32); + font-weight: 600; + display: flex; + + div { + text-align: center; + } + + .l { + flex: 2.5; + } + + .r { + flex: 7.5; + } + } + + .bottom { + overflow: hidden; + width: px2rem(566); + height: px2rem(182); + line-height: px2rem(182); + color: #A897FF; + font-size: px2rem(32); + font-weight: 600; + display: flex; + + div { + text-align: center; + } + + .l { + flex: 2.5; + } + + .r { + flex: 7.5; + + .gift_sbox { + width: px2rem(114); + height: px2rem(104); + background: url(../images/s-giftBg.png) no-repeat; + background-size: 100% 100%; + position: relative; + float: left; + margin-top: px2rem(20); + margin-left: px2rem(20); + + .title { + width: px2rem(84); + height: px2rem(24); + line-height: px2rem(20); + position: absolute; + top: px2rem(6); + left: 50%; + transform: translateX(-50%); + text-align: center; + color: #BE7800; + font-size: px2rem(18); + font-weight: 400; + background: url(../images/title.png) no-repeat; + background-size: 100% 100%; + z-index: 2; + } + + .gift { + width: px2rem(94); + height: px2rem(66); + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + } + + .ts { + width: px2rem(90); + height: px2rem(90); + top: 53%; + } + + .xz { + width: px2rem(90); + height: px2rem(90); + top: 55%; + } + + .qp { + width: px2rem(94); + height: px2rem(74); + top: 60%; + } + + .zj { + width: px2rem(114); + height: px2rem(80); + top: 54%; + } + + p { + width: 100%; + height: px2rem(24); + line-height: px2rem(24); + text-align: center; + color: #C9C7D3; + font-size: px2rem(24); + font-weight: 400; + position: absolute; + left: 50%; + transform: translateX(-50%); + bottom: px2rem(-40); + white-space: nowrap; + + img { + display: inline-block; + width: px2rem(24); + height: px2rem(24); + } + } + } + + .but { + width: px2rem(110); + height: px2rem(49); + border-radius: px2rem(49); + line-height: px2rem(49); + color: #ECCE91; + font-size: px2rem(24); + font-weight: 400; + background: #857277; + margin-top: px2rem(70); + margin-left: px2rem(26); + float: left; + } + + .act { + color: #A06C00; + background: #ECCE91; + } + } + } + + .my { + width: px2rem(564); + height: px2rem(140); + background: #221A58; + box-shadow: 0px 0px px2rem(20) 0px rgba(195, 183, 255, 0.37); + border-radius: 0px 0px px2rem(16) px2rem(16); + border: px2rem(4) solid #C3B7FF; + box-sizing: border-box; + + .tx { + float: left; + display: block; + width: px2rem(84); + height: px2rem(84); + border-radius: 50%; + box-sizing: border-box; + margin-top: px2rem(12); + margin-left: px2rem(44); + margin-right: px2rem(20); + } + + .user { + float: left; + + p { + width: px2rem(356); + color: #D4CEFF; + font-size: px2rem(32); + font-weight: 500; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + margin-top: px2rem(15); + margin-bottom: px2rem(12); + } + + .lineBox { + width: px2rem(356); + height: px2rem(24); + margin-bottom: px2rem(8); + background: rgba(195, 183, 255, 0.3); + border-radius: px2rem(24); + border: px2rem(2) solid #C3B7FF; + position: relative; + overflow: hidden; + box-sizing: border-box; + + .line { + width: 10%; + height: 100%; + position: absolute; + left: 0; + top: 0; + } + + .content { + width: 100%; + height: 100%; + position: absolute; + left: 0; + top: 0; + text-align: center; + color: #D3CAFF; + font-size: px2rem(22); + font-weight: 400; + } + } + + .exp { + width: px2rem(356); + display: flex; + justify-content: space-between; + color: #8079B0; + font-size: px2rem(24); + font-weight: 400; + } + } + } + + + } +} + +.listBox2 { + width: px2rem(686); + height: px2rem(2976); + margin: 0 auto px2rem(66); + background: url(../images/listBox2.png) no-repeat; + background-size: 100% 100%; + box-sizing: border-box; + position: relative; + padding-top: px2rem(1022); + display: none; + + .tab { + position: absolute; + width: px2rem(560); + height: px2rem(64); + line-height: px2rem(64); + top: px2rem(-32); + left: 50%; + transform: translateX(-50%); + display: flex; + justify-content: space-between; + font-weight: 600; + + div { + text-align: center; + width: px2rem(272); + font-size: px2rem(28); + } + + .tab1 { + color: #B37500; + background: url(../images/tab1.png) no-repeat; + background-size: 100% 100%; + } + + .tab2 { + color: #E0BEFF; + background: url(../images/tab2.png) no-repeat; + background-size: 100% 100%; + } + } + + .topReward { + width: px2rem(718); + height: px2rem(940); + background: url(../images/topReward.png) no-repeat; + background-size: 100% 100%; + position: absolute; + top: px2rem(72); + left: 50%; + transform: translateX(-50%); + + .listRule { + width: px2rem(120); + height: px2rem(46); + line-height: px2rem(46); + text-align: center; + color: #725B00; + font-size: px2rem(20); + position: absolute; + right: px2rem(52); + top: px2rem(86); + background: linear-gradient(180deg, #F8BA47 0%, #FFF297 100%); + border-radius: px2rem(16) 0px 0px px2rem(16); + } + } + + .content1 { + width: px2rem(496); + height: px2rem(68); + text-align: center; + color: #C5C3CF; + font-size: px2rem(24); + font-weight: 500; + margin: 0 auto px2rem(10); + line-height: 0.45rem; + } + + .content2 { + width: 100%; + text-align: center; + color: #C5C3CF; + font-size: px2rem(20); + font-weight: 500; + margin: 0 auto px2rem(10); + line-height: 0.4rem; + } + + .top1 { + width: px2rem(324); + height: px2rem(324); + position: absolute; + top: px2rem(1210); + left: 50%; + transform: translateX(-50%); + + .ts { + width: 100%; + height: 100%; + position: absolute; + left: 0; + top: 0; + z-index: 2; + } + + .tx { + width: px2rem(195); + height: px2rem(195); + position: absolute; + top: px2rem(60); + left: 50%; + transform: translateX(-51%); + border-radius: 50%; + } + + .nick { + width: 65%; + height: px2rem(44); + position: absolute; + left: 50%; + transform: translateX(-50%); + top: px2rem(340); + color: #FFFA8B; + font-size: px2rem(32); + text-align: center; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + font-weight: 500; + + } + + .score { + width: 65%; + height: px2rem(44); + position: absolute; + left: 50%; + transform: translateX(-50%); + top: px2rem(380); + color: #FFFA8B; + font-size: px2rem(32); + text-align: center; + font-weight: 400; + } + } + + .top2 { + width: px2rem(324); + height: px2rem(324); + position: absolute; + top: px2rem(1602); + left: px2rem(-0); + + .ts { + width: 100%; + height: 100%; + position: absolute; + left: 0; + top: 0; + z-index: 2; + } + + .tx { + width: px2rem(195); + height: px2rem(195); + position: absolute; + top: px2rem(40); + left: 50%; + transform: translateX(-51%); + border-radius: 50%; + } + + .nick { + width: 65%; + height: px2rem(44); + position: absolute; + left: 50%; + transform: translateX(-50%); + top: px2rem(340); + color: #FFFA8B; + font-size: px2rem(32); + text-align: center; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + font-weight: 500; + + } + + .score { + width: 65%; + height: px2rem(44); + position: absolute; + left: 50%; + transform: translateX(-50%); + top: px2rem(380); + color: #FFFA8B; + font-size: px2rem(32); + text-align: center; + font-weight: 400; + } + } + + .top3 { + width: px2rem(324); + height: px2rem(324); + position: absolute; + top: px2rem(1602); + right: px2rem(-0); + + .ts { + width: 100%; + height: 100%; + position: absolute; + left: 0; + top: 0; + z-index: 2; + } + + .tx { + width: px2rem(240); + height: px2rem(240); + position: absolute; + top: px2rem(40); + left: 50%; + transform: translateX(-51%); + border-radius: 50%; + } + + .nick { + width: 65%; + height: px2rem(44); + position: absolute; + left: 50%; + transform: translateX(-50%); + top: px2rem(340); + color: #FFFA8B; + font-size: px2rem(32); + text-align: center; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + font-weight: 500; + + } + + .score { + width: 65%; + height: px2rem(44); + position: absolute; + left: 50%; + transform: translateX(-50%); + top: px2rem(380); + color: #FFFA8B; + font-size: px2rem(32); + text-align: center; + font-weight: 400; + } + } + + ul { + width: px2rem(682); + height: px2rem(772); + overflow-y: scroll; + background: url(../images/ulBg.png) no-repeat; + background-size: 100% 100%; + margin: px2rem(1010) auto 0; + padding-bottom: 2.4rem; + + &::-webkit-scrollbar { + display: none; + } + + li { + width: 100%; + height: px2rem(136); + border-bottom: px2rem(2) solid; + border-image: linear-gradient(225deg, rgba(248, 210, 150, 1), rgba(236, 205, 129, 1), rgba(151, 86, 27, 1), rgba(224, 171, 40, 1)) 2 2; + box-sizing: border-box; + overflow: hidden; + padding: 0 px2rem(20) 0 px2rem(22); + + .num { + float: left; + width: px2rem(70); + line-height: px2rem(136); + height: 100%; + color: #FFFA8B; + font-size: px2rem(24); + font-weight: 400; + margin-right: px2rem(30); + } + + .tx { + display: block; + float: left; + margin-top: px2rem(26); + margin-right: px2rem(10); + border-radius: 50%; + width: px2rem(84); + height: px2rem(84); + } + + .nick { + width: 3rem; + line-height: px2rem(136); + height: 100%; + float: left; + color: #FFFA8B; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + font-size: px2rem(32); + font-weight: 500; + } + + .right { + float: right; + text-align: right; + + p { + color: #B4B04F; + font-size: px2rem(24); + font-weight: 400; + margin-bottom: px2rem(20); + margin-top: px2rem(30); + } + + span { + color: #FFFA8B; + font-size: px2rem(32); + font-weight: 400; + display: block; + } + } + } + } + + .my { + position: fixed; + left: 0; + bottom: 0; + width: 100%; + height: px2rem(136); + box-sizing: border-box; + // overflow: hidden; + padding: 0 px2rem(20) 0 px2rem(22); + background: #221A58; + border-radius: px2rem(20) px2rem(20) 0 0; + z-index: 8; + + .rank { + position: absolute; + top: px2rem(-46); + left: 50%; + transform: translateX(-50%); + width: px2rem(318); + height: px2rem(92); + line-height: px2rem(92); + background: url(../images/myListBg.png) no-repeat; + background-size: 100% 100%; + text-align: center; + color: #FFFA8B; + font-size: px2rem(24); + font-weight: 500; + } + + .num { + float: left; + width: px2rem(70); + line-height: px2rem(136); + height: 100%; + color: #FFFA8B; + font-size: px2rem(24); + font-weight: 400; + margin-right: px2rem(30); + white-space: nowrap; + } + + .tx { + display: block; + float: left; + margin-top: px2rem(26); + margin-right: px2rem(10); + border-radius: 50%; + width: px2rem(84); + height: px2rem(84); + } + + .nick { + width: 3rem; + line-height: px2rem(136); + height: 100%; + float: left; + color: #FFFA8B; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + font-size: px2rem(32); + font-weight: 500; + } + + .right { + float: right; + text-align: right; + + p { + color: #B4B04F; + font-size: px2rem(24); + font-weight: 400; + margin-bottom: px2rem(20); + margin-top: px2rem(30); + } + + span { + color: #FFFA8B; + font-size: px2rem(32); + font-weight: 400; + display: block; + margin-top: 0.75rem; + } + } + } +} + +.exp_pub { + position: fixed; + left: 0; + top: 0; + bottom: 0; + right: 0; + z-index: 9; + background: rgba(0, 0, 0, .46); + display: none; + + .exp_pub_in { + width: px2rem(686); + height: px2rem(1286); + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + background: url(../images/expRule.png) no-repeat; + background-size: 100% 100%; + padding-top: px2rem(70); + box-sizing: border-box; + + .title { + width: px2rem(336); + height: px2rem(104); + line-height: px2rem(104); + text-align: center; + color: #E1D6FF; + font-size: px2rem(32); + font-weight: 600; + top: px2rem(-52); + position: absolute; + left: 50%; + transform: translateX(-50%); + background: url(../images/expTitle.png) no-repeat; + background-size: 100% 100%; + } + + h3 { + width: 100%; + text-align: center; + color: #C9C7D3; + font-size: px2rem(24); + font-weight: 400; + margin-bottom: px2rem(40); + } + + .box { + width: px2rem(564); + height: px2rem(1074); + background: linear-gradient(180deg, #473891 0%, #221A58 100%); + border-radius: px2rem(16); + border: px2rem(4) solid #C3B7FF; + margin: 0 auto; + overflow-y: scroll; + + &::-webkit-scrollbar { + display: none; + } + + .top { + width: px2rem(564); + height: px2rem(120); + line-height: px2rem(120); + color: #A897FF; + font-size: px2rem(32); + font-weight: 600; + display: flex; + + div { + text-align: center; + } + + .l { + flex: 3; + border-right: px2rem(4) solid #C3B7FF; + border-bottom: px2rem(4) solid #C3B7FF; + } + + .r { + flex: 7; + border-bottom: px2rem(4) solid #C3B7FF; + } + } + + .bottom { + width: px2rem(564); + height: px2rem(104); + line-height: px2rem(104); + color: #C3B7FF; + font-size: px2rem(32); + font-weight: 600; + display: flex; + + div { + text-align: center; + } + + .l { + flex: 3; + border-right: px2rem(4) solid #C3B7FF; + border-bottom: px2rem(4) solid #C3B7FF; + } + + .r { + flex: 7; + border-bottom: px2rem(4) solid #C3B7FF; + color: #C9C7D3; + } + } + } + } +} + +.rule { + position: fixed; + left: 0; + top: 0; + bottom: 0; + right: 0; + z-index: 9; + background: rgba(0, 0, 0, .46); + display: none; + + .rule_in { + width: px2rem(686); + height: px2rem(1026); + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + background: url(../images/ruleBg.png) no-repeat; + background-size: 100% 100%; + padding-top: px2rem(70); + box-sizing: border-box; + overflow: hidden; + + .tab { + width: px2rem(408); + height: px2rem(68); + line-height: px2rem(68); + display: flex; + justify-content: space-between; + margin: 0 auto; + + div { + text-align: center; + width: px2rem(184); + font-size: px2rem(32); + font-weight: 400; + border-radius: px2rem(16); + white-space: nowrap; + } + + .stab1 { + background: #857277; + color: #B9A084; + } + + .stab2 { + background: #493D9A; + color: #8377CB; + } + + .act1 { + background: linear-gradient(135deg, #F8BA47 0%, #FFF297 100%); + color: #DC7400; + font-weight: 500; + } + + .act2 { + background: linear-gradient(135deg, #67309F 0%, #AF7ADC 100%); + color: #BEB4FF; + font-weight: 500; + } + } + + .box { + width: px2rem(620); + height: 10.6rem; + overflow-y: scroll; + margin: px2rem(40) auto 0; + + &::-webkit-scrollbar { + display: none; + } + + img { + width: px2rem(620); + display: block; + } + + .img1 { + height: px2rem(2354); + } + + .img2 { + height: px2rem(3280); + display: none; + } + } + } +} + +// 英语 +.english { + .giftBox .textBox .p1 { + width: 70%; + margin-left: 2rem; + padding-right: 0; + line-height: 0.34rem; + } + + .giftBox .giftList div .exp { + font-size: px2rem(20); + } + + .giftBox .giftList div p { + font-size: px2rem(26); + } + + .rule .rule_in .tab { + width: 7.44rem; + + div { + width: 3.5rem; + font-size: px2rem(25); + } + } + + .listBox2 .content1 { + font-size: px2rem(22); + width: px2rem(600); + } + + .listBox2 .my .num { + margin-right: 0.9rem; + } + + .listBox2 .my { + .rank { + display: none; + } + } +} + +// 阿拉伯 +.arabic { + .header .tiem { + top: 6.1rem; + } + + .header .ruleIcon { + text-indent: -13px; + } + + .giftBox .textBox .p1 { + width: 75%; + padding-right: 0; + white-space: nowrap; + font-size: px2rem(16); + } + + .giftBox .giftList div .exp { + font-size: px2rem(22); + } + + .listBox .expBox { + background: url(../images/boxBg2.png) no-repeat; + background-size: 100% 100%; + } + + .listBox .expBox .bottom .r .but { + float: right; + white-space: nowrap; + font-size: px2rem(19); + margin-left: 0; + margin-right: 0.2rem; + } + + .listBox .expBox .bottom .r .gift_sbox { + float: right; + } + + .listBox .expBox .bottom .l { + margin-right: 0.05rem; + margin-left: 0.1rem; + font-size: px2rem(24); + } + + .listBox .expBox .my .tx { + float: right; + } + + .listBox .expBox .my .user { + float: right; + } + + .listBox .expBox .my .user .lineBox .line { + left: auto; + right: 0; + } + + .rule .rule_in .tab div { + font-size: px2rem(25); + } + + .listBox2 .my { + .rank { + display: none; + } + + .num { + float: right; + margin-right: 0; + margin-left: 0.6rem; + } + + .tx { + float: right; + margin-right: 0; + margin-left: 0.3rem; + } + + .nick { + float: right; + } + + .right { + float: left; + } + } + + .listBox2 ul li { + .right { + float: left; + text-align: left; + } + + .nick { + float: right; + } + + .tx { + float: right; + margin-left: 0.2rem; + } + + .num { + float: right; + margin-right: 0; + margin-left: 0rem; + } + } + .listBox2 .topReward .listRule{ + right: 0.3rem; + } +} \ No newline at end of file diff --git a/view/molistar/activity/exp/images/VIP.png b/view/molistar/activity/exp/images/VIP.png new file mode 100644 index 00000000..907697c6 Binary files /dev/null and b/view/molistar/activity/exp/images/VIP.png differ diff --git a/view/molistar/activity/exp/images/bigGold.png b/view/molistar/activity/exp/images/bigGold.png new file mode 100644 index 00000000..2a74b41a Binary files /dev/null and b/view/molistar/activity/exp/images/bigGold.png differ diff --git a/view/molistar/activity/exp/images/boxBg.png b/view/molistar/activity/exp/images/boxBg.png new file mode 100644 index 00000000..86532177 Binary files /dev/null and b/view/molistar/activity/exp/images/boxBg.png differ diff --git a/view/molistar/activity/exp/images/boxBg2.png b/view/molistar/activity/exp/images/boxBg2.png new file mode 100644 index 00000000..5610fde3 Binary files /dev/null and b/view/molistar/activity/exp/images/boxBg2.png differ diff --git a/view/molistar/activity/exp/images/dam.png b/view/molistar/activity/exp/images/dam.png new file mode 100644 index 00000000..1b3c9388 Binary files /dev/null and b/view/molistar/activity/exp/images/dam.png differ diff --git a/view/molistar/activity/exp/images/expIcon.png b/view/molistar/activity/exp/images/expIcon.png new file mode 100644 index 00000000..ab73ffb3 Binary files /dev/null and b/view/molistar/activity/exp/images/expIcon.png differ diff --git a/view/molistar/activity/exp/images/expRule.png b/view/molistar/activity/exp/images/expRule.png new file mode 100644 index 00000000..956d1893 Binary files /dev/null and b/view/molistar/activity/exp/images/expRule.png differ diff --git a/view/molistar/activity/exp/images/expTitle.png b/view/molistar/activity/exp/images/expTitle.png new file mode 100644 index 00000000..fcb0a068 Binary files /dev/null and b/view/molistar/activity/exp/images/expTitle.png differ diff --git a/view/molistar/activity/exp/images/giftBg.png b/view/molistar/activity/exp/images/giftBg.png new file mode 100644 index 00000000..ae6b3fda Binary files /dev/null and b/view/molistar/activity/exp/images/giftBg.png differ diff --git a/view/molistar/activity/exp/images/giftBg_ar.png b/view/molistar/activity/exp/images/giftBg_ar.png new file mode 100644 index 00000000..20b73b88 Binary files /dev/null and b/view/molistar/activity/exp/images/giftBg_ar.png differ diff --git a/view/molistar/activity/exp/images/giftBg_en.png b/view/molistar/activity/exp/images/giftBg_en.png new file mode 100644 index 00000000..73fca542 Binary files /dev/null and b/view/molistar/activity/exp/images/giftBg_en.png differ diff --git a/view/molistar/activity/exp/images/giftList1.png b/view/molistar/activity/exp/images/giftList1.png new file mode 100644 index 00000000..5b708e87 Binary files /dev/null and b/view/molistar/activity/exp/images/giftList1.png differ diff --git a/view/molistar/activity/exp/images/giftList1_ar.png b/view/molistar/activity/exp/images/giftList1_ar.png new file mode 100644 index 00000000..c4536906 Binary files /dev/null and b/view/molistar/activity/exp/images/giftList1_ar.png differ diff --git a/view/molistar/activity/exp/images/giftList1_en.png b/view/molistar/activity/exp/images/giftList1_en.png new file mode 100644 index 00000000..c4536906 Binary files /dev/null and b/view/molistar/activity/exp/images/giftList1_en.png differ diff --git a/view/molistar/activity/exp/images/giftList2.png b/view/molistar/activity/exp/images/giftList2.png new file mode 100644 index 00000000..c8abe5bd Binary files /dev/null and b/view/molistar/activity/exp/images/giftList2.png differ diff --git a/view/molistar/activity/exp/images/giftList2_ar.png b/view/molistar/activity/exp/images/giftList2_ar.png new file mode 100644 index 00000000..dba2035e Binary files /dev/null and b/view/molistar/activity/exp/images/giftList2_ar.png differ diff --git a/view/molistar/activity/exp/images/giftList2_en.png b/view/molistar/activity/exp/images/giftList2_en.png new file mode 100644 index 00000000..73c990cf Binary files /dev/null and b/view/molistar/activity/exp/images/giftList2_en.png differ diff --git a/view/molistar/activity/exp/images/giftList3.png b/view/molistar/activity/exp/images/giftList3.png new file mode 100644 index 00000000..f04eb702 Binary files /dev/null and b/view/molistar/activity/exp/images/giftList3.png differ diff --git a/view/molistar/activity/exp/images/giftList3_ar.png b/view/molistar/activity/exp/images/giftList3_ar.png new file mode 100644 index 00000000..71ff3a64 Binary files /dev/null and b/view/molistar/activity/exp/images/giftList3_ar.png differ diff --git a/view/molistar/activity/exp/images/giftList3_en.png b/view/molistar/activity/exp/images/giftList3_en.png new file mode 100644 index 00000000..71ff3a64 Binary files /dev/null and b/view/molistar/activity/exp/images/giftList3_en.png differ diff --git a/view/molistar/activity/exp/images/giftList4.png b/view/molistar/activity/exp/images/giftList4.png new file mode 100644 index 00000000..1a4b1152 Binary files /dev/null and b/view/molistar/activity/exp/images/giftList4.png differ diff --git a/view/molistar/activity/exp/images/giftList4_ar.png b/view/molistar/activity/exp/images/giftList4_ar.png new file mode 100644 index 00000000..a8682152 Binary files /dev/null and b/view/molistar/activity/exp/images/giftList4_ar.png differ diff --git a/view/molistar/activity/exp/images/giftList4_en.png b/view/molistar/activity/exp/images/giftList4_en.png new file mode 100644 index 00000000..a8682152 Binary files /dev/null and b/view/molistar/activity/exp/images/giftList4_en.png differ diff --git a/view/molistar/activity/exp/images/giftListBg.png b/view/molistar/activity/exp/images/giftListBg.png new file mode 100644 index 00000000..5c341ec4 Binary files /dev/null and b/view/molistar/activity/exp/images/giftListBg.png differ diff --git a/view/molistar/activity/exp/images/gold.png b/view/molistar/activity/exp/images/gold.png new file mode 100644 index 00000000..8b6d4717 Binary files /dev/null and b/view/molistar/activity/exp/images/gold.png differ diff --git a/view/molistar/activity/exp/images/header.png b/view/molistar/activity/exp/images/header.png new file mode 100644 index 00000000..a67aa153 Binary files /dev/null and b/view/molistar/activity/exp/images/header.png differ diff --git a/view/molistar/activity/exp/images/header_ar.png b/view/molistar/activity/exp/images/header_ar.png new file mode 100644 index 00000000..a259bef2 Binary files /dev/null and b/view/molistar/activity/exp/images/header_ar.png differ diff --git a/view/molistar/activity/exp/images/header_en.png b/view/molistar/activity/exp/images/header_en.png new file mode 100644 index 00000000..525bcf55 Binary files /dev/null and b/view/molistar/activity/exp/images/header_en.png differ diff --git a/view/molistar/activity/exp/images/line.png b/view/molistar/activity/exp/images/line.png new file mode 100644 index 00000000..7d29d5cd Binary files /dev/null and b/view/molistar/activity/exp/images/line.png differ diff --git a/view/molistar/activity/exp/images/listBox.png b/view/molistar/activity/exp/images/listBox.png new file mode 100644 index 00000000..3fb8490a Binary files /dev/null and b/view/molistar/activity/exp/images/listBox.png differ diff --git a/view/molistar/activity/exp/images/listBox2.png b/view/molistar/activity/exp/images/listBox2.png new file mode 100644 index 00000000..d748ab56 Binary files /dev/null and b/view/molistar/activity/exp/images/listBox2.png differ diff --git a/view/molistar/activity/exp/images/logo.png b/view/molistar/activity/exp/images/logo.png new file mode 100644 index 00000000..c2e895f8 Binary files /dev/null and b/view/molistar/activity/exp/images/logo.png differ diff --git a/view/molistar/activity/exp/images/myListBg.png b/view/molistar/activity/exp/images/myListBg.png new file mode 100644 index 00000000..bb7bd2e7 Binary files /dev/null and b/view/molistar/activity/exp/images/myListBg.png differ diff --git a/view/molistar/activity/exp/images/qp.png b/view/molistar/activity/exp/images/qp.png new file mode 100644 index 00000000..537d1181 Binary files /dev/null and b/view/molistar/activity/exp/images/qp.png differ diff --git a/view/molistar/activity/exp/images/rule1.png b/view/molistar/activity/exp/images/rule1.png new file mode 100644 index 00000000..a302df6d Binary files /dev/null and b/view/molistar/activity/exp/images/rule1.png differ diff --git a/view/molistar/activity/exp/images/rule1_ar.png b/view/molistar/activity/exp/images/rule1_ar.png new file mode 100644 index 00000000..340fdb2f Binary files /dev/null and b/view/molistar/activity/exp/images/rule1_ar.png differ diff --git a/view/molistar/activity/exp/images/rule1_en.png b/view/molistar/activity/exp/images/rule1_en.png new file mode 100644 index 00000000..c9407d93 Binary files /dev/null and b/view/molistar/activity/exp/images/rule1_en.png differ diff --git a/view/molistar/activity/exp/images/rule2.png b/view/molistar/activity/exp/images/rule2.png new file mode 100644 index 00000000..6c7718de Binary files /dev/null and b/view/molistar/activity/exp/images/rule2.png differ diff --git a/view/molistar/activity/exp/images/rule2_ar.png b/view/molistar/activity/exp/images/rule2_ar.png new file mode 100644 index 00000000..0f075879 Binary files /dev/null and b/view/molistar/activity/exp/images/rule2_ar.png differ diff --git a/view/molistar/activity/exp/images/rule2_en.png b/view/molistar/activity/exp/images/rule2_en.png new file mode 100644 index 00000000..404b672b Binary files /dev/null and b/view/molistar/activity/exp/images/rule2_en.png differ diff --git a/view/molistar/activity/exp/images/ruleBg.png b/view/molistar/activity/exp/images/ruleBg.png new file mode 100644 index 00000000..c4a9c359 Binary files /dev/null and b/view/molistar/activity/exp/images/ruleBg.png differ diff --git a/view/molistar/activity/exp/images/rule_iconBg.png b/view/molistar/activity/exp/images/rule_iconBg.png new file mode 100644 index 00000000..45f36cc5 Binary files /dev/null and b/view/molistar/activity/exp/images/rule_iconBg.png differ diff --git a/view/molistar/activity/exp/images/s-giftBg.png b/view/molistar/activity/exp/images/s-giftBg.png new file mode 100644 index 00000000..e4871695 Binary files /dev/null and b/view/molistar/activity/exp/images/s-giftBg.png differ diff --git a/view/molistar/activity/exp/images/tab1.png b/view/molistar/activity/exp/images/tab1.png new file mode 100644 index 00000000..1d39cb9d Binary files /dev/null and b/view/molistar/activity/exp/images/tab1.png differ diff --git a/view/molistar/activity/exp/images/tab2.png b/view/molistar/activity/exp/images/tab2.png new file mode 100644 index 00000000..9994c6ba Binary files /dev/null and b/view/molistar/activity/exp/images/tab2.png differ diff --git a/view/molistar/activity/exp/images/textBox.png b/view/molistar/activity/exp/images/textBox.png new file mode 100644 index 00000000..2ebe7aa0 Binary files /dev/null and b/view/molistar/activity/exp/images/textBox.png differ diff --git a/view/molistar/activity/exp/images/title.png b/view/molistar/activity/exp/images/title.png new file mode 100644 index 00000000..68c68cfe Binary files /dev/null and b/view/molistar/activity/exp/images/title.png differ diff --git a/view/molistar/activity/exp/images/top1.png b/view/molistar/activity/exp/images/top1.png new file mode 100644 index 00000000..358001dd Binary files /dev/null and b/view/molistar/activity/exp/images/top1.png differ diff --git a/view/molistar/activity/exp/images/top2.png b/view/molistar/activity/exp/images/top2.png new file mode 100644 index 00000000..9a36e20b Binary files /dev/null and b/view/molistar/activity/exp/images/top2.png differ diff --git a/view/molistar/activity/exp/images/top3.png b/view/molistar/activity/exp/images/top3.png new file mode 100644 index 00000000..c8ac2015 Binary files /dev/null and b/view/molistar/activity/exp/images/top3.png differ diff --git a/view/molistar/activity/exp/images/topReward.png b/view/molistar/activity/exp/images/topReward.png new file mode 100644 index 00000000..9b128e85 Binary files /dev/null and b/view/molistar/activity/exp/images/topReward.png differ diff --git a/view/molistar/activity/exp/images/topReward_ar.png b/view/molistar/activity/exp/images/topReward_ar.png new file mode 100644 index 00000000..8b23c542 Binary files /dev/null and b/view/molistar/activity/exp/images/topReward_ar.png differ diff --git a/view/molistar/activity/exp/images/topReward_en.png b/view/molistar/activity/exp/images/topReward_en.png new file mode 100644 index 00000000..bc411f00 Binary files /dev/null and b/view/molistar/activity/exp/images/topReward_en.png differ diff --git a/view/molistar/activity/exp/images/travel/back.png b/view/molistar/activity/exp/images/travel/back.png new file mode 100644 index 00000000..2b3812da Binary files /dev/null and b/view/molistar/activity/exp/images/travel/back.png differ diff --git a/view/molistar/activity/exp/images/travel/backB.png b/view/molistar/activity/exp/images/travel/backB.png new file mode 100644 index 00000000..92e190c7 Binary files /dev/null and b/view/molistar/activity/exp/images/travel/backB.png differ diff --git a/view/molistar/activity/exp/images/ts.png b/view/molistar/activity/exp/images/ts.png new file mode 100644 index 00000000..d8c2c876 Binary files /dev/null and b/view/molistar/activity/exp/images/ts.png differ diff --git a/view/molistar/activity/exp/images/ulBg.png b/view/molistar/activity/exp/images/ulBg.png new file mode 100644 index 00000000..d6cf7082 Binary files /dev/null and b/view/molistar/activity/exp/images/ulBg.png differ diff --git a/view/molistar/activity/exp/images/why.png b/view/molistar/activity/exp/images/why.png new file mode 100644 index 00000000..06e5d48b Binary files /dev/null and b/view/molistar/activity/exp/images/why.png differ diff --git a/view/molistar/activity/exp/images/xz.png b/view/molistar/activity/exp/images/xz.png new file mode 100644 index 00000000..542ec1d6 Binary files /dev/null and b/view/molistar/activity/exp/images/xz.png differ diff --git a/view/molistar/activity/exp/images/zj.png b/view/molistar/activity/exp/images/zj.png new file mode 100644 index 00000000..5466fb78 Binary files /dev/null and b/view/molistar/activity/exp/images/zj.png differ diff --git a/view/molistar/activity/exp/index.html b/view/molistar/activity/exp/index.html new file mode 100644 index 00000000..87ff61af --- /dev/null +++ b/view/molistar/activity/exp/index.html @@ -0,0 +1,334 @@ + + + + + + + + + + + + + +
+ +
+ +
+
+
+
+ +
+

+
+ +
+
+
+
+
+
+ +

+ + + + +
+
+
+ +

+ + + + +
+
+
+ +

+ + + + +
+
+
+ +

+ + + + +
+
+
+ +
+
+
+
+
+

+
+ +
+
+
+
+ +
+
15
+
+
+
7
+ +

头饰

+
+
+
7
+ +

气泡

+
+
+
+
+ +
+
20
+
+
+
7
+ +

头饰

+
+
+ + +

*50

+
+
已领取
+
+
+ +
+
25
+
+
+
7
+ +

座駕

+
+
+ + +

*100

+
+
已领取
+
+
+ +
+
30
+
+
+
7
+ +

勳章

+
+
+ + +

*300

+
+
已领取
+
+
+ +
+
35
+
+
+
7
+ +

氣泡

+
+
+ + +

*500

+
+
已领取
+
+
+ +
+
40
+
+
+
7
+ +

頭飾

+
+
+ + +

*1000

+
+
已领取
+
+
+ +
+
45
+
+
+
7
+ +

+
+
+ + +

*1500

+
+
已领取
+
+
+ +
+
50
+
+
+
7
+ +

勳章

+
+
+ + +

*2000

+
+
已领取
+
+
+
+ +
+

+
+ +
70%
+
+
+
0
+
LV.0
+
+
+
+
+
+ +
+ +
+
+
+
+ +
+
+
+ +
+
+ +
+ + +
+
EXP:0
+
+
+ + +
+
EXP:0
+
+
+ + +
+
EXP:0
+
+ + + +
+
+
+ +
+
+

+ 0 +
+
+
+ +
+
+
+

+
+
+
等级
+
+
+ +
+
+
+ +
+
+
+
+
+
+
+ + +
+
+
+ + + + + + + + + + + + + + \ No newline at end of file diff --git a/view/molistar/activity/exp/js/index.js b/view/molistar/activity/exp/js/index.js new file mode 100644 index 00000000..5d538814 --- /dev/null +++ b/view/molistar/activity/exp/js/index.js @@ -0,0 +1,363 @@ +let urlPrefix = getUrlPrefix() +let browser = checkVersion() +let env = EnvCheck(); +if (env == 'test') { + new VConsole(); +} +// 封裝layer消息提醒框 +let layerIndex +var langReplace; +var localLang; +const showLoading = (content = langReplace(localLang.demoModule.layerIndex1)) => { + layer.open({ + type: 2, + shadeClose: false, + content, + success(e) { + layerIndex = $(e).attr('index') + } + }) +} +const hideLoading = (index) => { + layer.close(index) +} +const toastMsg = (content = langReplace(localLang.demoModule.layerIndex2), time = 2) => { + layer.open({ + content, + time, + skin: 'msg' + }) +} +var countupTime;//倒计时容器 +var isLock = true; +var page = 1; +// 初始化函數 +$(function () { + getInfoFromClient(); + fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言 + setTimeout(function () { + // 頁面全屏 + if (browser.app) { + if (browser.android) { + window.androidJsObj.initShowNav(false) + } else { + window.webkit.messageHandlers.initShowNav.postMessage(0) + } + }; + // 頂部返回事件 + $('.back img').click(() => { + if (browser.android) { + window.androidJsObj.closeWebView() + } else { + window.webkit.messageHandlers.closeWebView.postMessage(null) + } + }) + fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言 + langReplace = window.lang.replace; + localLang = window.lang; + translateFun(); + getConfig(); + }, 100) +}) +function translateFun() { + var langReplace = window.lang.replace; + var localLang = window.lang; + $('.text1').text(langReplace(localLang.demoModule.text1)); + $('.text2').text(langReplace(localLang.demoModule.text2)); + $('.text3').text(langReplace(localLang.demoModule.text3)); + $('.text4').text(langReplace(localLang.demoModule.text4)); + $('.text5').text(langReplace(localLang.demoModule.text5)); + $('.text6').text(langReplace(localLang.demoModule.text6)); + $('.text7').text(langReplace(localLang.demoModule.text7)); + $('.text8').text(langReplace(localLang.demoModule.text8)); + $('.text9').text(langReplace(localLang.demoModule.text9)); + $('.text10').text(langReplace(localLang.demoModule.text10)); + $('.text11').text(langReplace(localLang.demoModule.text11)); + $('.text12').text(langReplace(localLang.demoModule.text12)); + $('.text13').text(langReplace(localLang.demoModule.text13)); + $('.text14').text(langReplace(localLang.demoModule.text14)); + $('.text15').text(langReplace(localLang.demoModule.text15)); + $('.text16').text(langReplace(localLang.demoModule.text16)); + $('.text17').text(langReplace(localLang.demoModule.text17)); + $('.text18').text(langReplace(localLang.demoModule.text18)); + $('.text19').text(langReplace(localLang.demoModule.text19)); + $('.text20').text(langReplace(localLang.demoModule.text20)); + $('.text21').text(langReplace(localLang.demoModule.text21)); + $('.text22').text(langReplace(localLang.demoModule.text22)); + $('.text23').text(langReplace(localLang.demoModule.text23)); + $('.text24').text(langReplace(localLang.demoModule.text24)); + $('.text25').text(langReplace(localLang.demoModule.text25)); + $('.text26').text(langReplace(localLang.demoModule.text26)); + $('.text27').text(langReplace(localLang.demoModule.text27)); + $('.text28').text(langReplace(localLang.demoModule.text28)); + $('.text29').text(langReplace(localLang.demoModule.text29)); + $('.text30').text(langReplace(localLang.demoModule.text30)); + $('.text31').text(langReplace(localLang.demoModule.text31)); + $('.text32').text(langReplace(localLang.demoModule.text32)); + $('.text43').text(langReplace(localLang.demoModule.text43)); + $('.text44').text(langReplace(localLang.demoModule.text44)); + $('.text45').text(langReplace(localLang.demoModule.text45)); + $('.text46').text(langReplace(localLang.demoModule.text46)); + $('.text47').text(langReplace(localLang.demoModule.text47)); + $('.text48').text(langReplace(localLang.demoModule.text48)); + $('.text49').text(langReplace(localLang.demoModule.text49)); + $('.text50').text(langReplace(localLang.demoModule.text50)); + $('.text51').text(langReplace(localLang.demoModule.text51)); + $('.newtext1').text(langReplace(localLang.demoModule.newtext1)); + $('.newtexts1').text(langReplace(localLang.demoModule.newtexts1)); + $('.newtext2').text(langReplace(localLang.demoModule.newtext2)); + $('.newtext3').text(langReplace(localLang.demoModule.newtext3)); + $('.newtext4').text(langReplace(localLang.demoModule.newtext4)); + $('.newtext5').text(langReplace(localLang.demoModule.newtext5)); + $('.newtext6').text(langReplace(localLang.demoModule.newtext6)); + $('.newtext7').text(langReplace(localLang.demoModule.newtext7)); + $('.newtext8').text(langReplace(localLang.demoModule.newtext8)); + $('.newText11').text(langReplace(localLang.demoModule.newText11)); + $('.newText22').text(langReplace(localLang.demoModule.newText22)); + $('.newText33').text(langReplace(localLang.demoModule.newText33)); + $('.newText44').text(langReplace(localLang.demoModule.newText44)); + $('.newText55').text(langReplace(localLang.demoModule.newText55)); + $('.newText66').text(langReplace(localLang.demoModule.newText66)); + $('.newText77').text(langReplace(localLang.demoModule.newText77)); + $('.header').attr('style', langReplace(localLang.demoModule.img1)) + $('.giftBox').attr('style', langReplace(localLang.demoModule.img2)) + $('.listBox2 .topReward').attr('style', langReplace(localLang.demoModule.img5)) + $('.rule .rule_in .box .img1').attr('src', langReplace(localLang.demoModule.img3)) + $('.rule .rule_in .box .img2').attr('src', langReplace(localLang.demoModule.img4)) + $('.newIMg1').attr('src', langReplace(localLang.demoModule.newIMg1)) + $('.newIMg2').attr('src', langReplace(localLang.demoModule.newIMg2)) + $('.newIMg3').attr('src', langReplace(localLang.demoModule.newIMg3)) + $('.newIMg4').attr('src', langReplace(localLang.demoModule.newIMg4)) +} +// 配置接口 +function getConfig() { + showLoading() + networkRequest({ + type: 'get', + url: urlPrefix + '/act/expBattle/getConfig', + success(res) { + if (res.code === 200) { + // 活动结束 + if ((res.data.endTime - res.timestamp) <= 0) { + $('.header .tiem').text(langReplace(localLang.demoModule.text33)); + } + var me = res.data.me + // 处理自己 + $('.listBox .expBox .my .tx').attr('src', me.avatar); + $('.listBox .expBox .my .user p').text(me.nick); + $('.listBox .expBox .my .user .exp .b1').text(me.level); + $('.listBox .expBox .my .user .exp .b2').text(me.level + 1); + if (me.level >= 50) { + $('.listBox .expBox .my .user .exp .b2').text(me.level); + } + // 处理任务状态 + var levelTaskStatusMap = res.data.levelTaskStatusMap; + const sortedKeys = Object.keys(levelTaskStatusMap).sort((a, b) => Number(a) - Number(b)); + const sortedObj = {}; + sortedKeys.forEach(key => { + sortedObj[key] = levelTaskStatusMap[key]; + }); + Object.getOwnPropertyNames(sortedObj).forEach((res, i) => { + if (sortedObj[res] == 0) { + $(`.listBox .expBox .bottom`).eq(i).children('.r').children('.but').removeClass('act'); + $(`.listBox .expBox .bottom`).eq(i).children('.r').children('.but').text(langReplace(localLang.demoModule.text34)); + } else if (sortedObj[res] == 1) { + $(`.listBox .expBox .bottom`).eq(i).children('.r').children('.but').addClass('act'); + $(`.listBox .expBox .bottom`).eq(i).children('.r').children('.but').text(langReplace(localLang.demoModule.text34)); + $(`.listBox .expBox .bottom`).eq(i).children('.r').children('.but').attr("status", sortedObj[res]); + $(`.listBox .expBox .bottom`).eq(i).children('.r').children('.but').attr("leve", Object.keys(sortedObj)[i]); + } else { + $(`.listBox .expBox .bottom`).eq(i).children('.r').children('.but').removeClass('act'); + $(`.listBox .expBox .bottom`).eq(i).children('.r').children('.but').text(langReplace(localLang.demoModule.text35)); + } + }) + // 处理等级 + var expLevelMap = res.data.expLevelMap; + const sortedKeys1 = Object.keys(expLevelMap).sort((a, b) => Number(a) - Number(b)); + const sortedObj1 = {}; + sortedKeys1.forEach(key => { + sortedObj1[key] = expLevelMap[key]; + }); + var str = ''; + $('.exp_pub .exp_pub_in .box .bottom').remove(); + for (const key in sortedObj1) { + if (sortedObj1.hasOwnProperty(key)) { // 仅遍历对象自身的属性,不包括继承的属性 + const value = sortedObj1[key]; + str += ` +
+
${value}${langReplace(localLang.demoModule.text13)}
+
${key}
+
+ ` + } + } + $('.exp_pub .exp_pub_in .box').append(str) + console.log(sortedKeys1); + $(`.listBox .expBox .my .user .lineBox .content b`).text(`(${me.score}/${sortedKeys1[me.level]})`) + $('.listBox .expBox .my .user .lineBox .line').css('width', `${(me.score / sortedKeys1[me.level] * 100) > 100 ? 100 : me.score / sortedKeys1[me.level] * 100}%`) + if (me.level >= 50) { + $(`.listBox .expBox .my .user .lineBox .content b`).text(me.score); + $('.listBox .expBox .my .user .lineBox .line').css('width', `${100}%`) + } + } else { + toastMsg(res.message) + } + hideLoading(layerIndex) + }, + error(err) { + hideLoading(layerIndex) + toastMsg(langReplace(localLang.demoModule.layerIndex3)) + } + }) +} +// 打开EXP疑问弹窗 +$('.listBox h3 img').click(function () { + $('.exp_pub').show(); + bodyScroolFun(true); +}) +// 关闭EXP疑问弹窗 +$('.exp_pub').click(function () { + $('.exp_pub').hide(); + bodyScroolFun(false); +}) +// 榜单接口 +function getRank() { + showLoading() + networkRequest({ + type: 'get', + url: urlPrefix + '/act/expBattle/getRank', + success(res) { + if (res.code === 200) { + var my = res.data.meRank; + var listTo3 = res.data.rankList.slice(0, 3); + var notListTo3 = res.data.rankList.slice(3); + if (listTo3.length < 3) { + let arr = new Array(3 - listTo3.length).fill({ + avatar: './images/logo.png', + nick: langReplace(localLang.demoModule.text36), + score: 0 + }) + listTo3.push(...arr) + } + // 处理前三 + listTo3.forEach((res, i) => { + $(`.listBox2 .top${i + 1} .tx`).attr('src', res.avatar); + $(`.listBox2 .top${i + 1} .nick`).text(res.nick); + $(`.listBox2 .top${i + 1} .score b`).text(unitProcessingAr(res.score, 1)); + }) + // 非前三 + $('.listBox2 ul li').remove(); + var str = ''; + notListTo3.forEach(res => { + str += ` +
  • +
    TOP${res.ranking}
    + +
    ${res.nick}
    +
    +

    ${langReplace(localLang.demoModule.text37)}

    + ${unitProcessingAr(res.score, 1)} +
    +
  • + ` + }) + $('.listBox2 ul').append(str); + // 处理自己 + if (my.ranking == 0) { + if (res.data.rankList.length == 0) { + $('.listBox2 .my .rank').text(`${langReplace(localLang.demoModule.text38)}0EXP`); + } else { + $('.listBox2 .my .rank').text(`${langReplace(localLang.demoModule.text39)}${unitProcessingAr(res.data.rankList[res.data.rankList.length - 1].score - my.score)}EXP`); + } + } else { + if (my.ranking == 1) { + $('.listBox2 .my .rank').text(`${langReplace(localLang.demoModule.text40)}${unitProcessingAr(my.score - res.data.rankList[1].score, 1)}EXP`); + } else { + $('.listBox2 .my .rank').text(`${langReplace(localLang.demoModule.text41)}${unitProcessingAr(res.data.rankList[my.ranking - 2].score - my.score)}EXP`); + } + + } + $('.listBox2 .my .num').text(my.ranking == 0 ? langReplace(localLang.demoModule.text42) : `TOP${my.ranking}`) + $('.listBox2 .my .tx').attr('src', my.avatar); + $('.listBox2 .my .nick').text(my.nick) + $('.listBox2 .my .score').text(unitProcessingAr(my.score, 1)) + } else { + toastMsg(res.message) + } + hideLoading(layerIndex) + }, + error(err) { + hideLoading(layerIndex) + toastMsg(langReplace(localLang.demoModule.layerIndex3)) + } + }) +} +// 切换等级和榜单 +$('.listBox .tab div,.listBox2 .tab div').click(function () { + var i = $(this).index() + 1; + $('.listBox2,.listBox1').hide() + $(`.listBox${i}`).show(); + if (i == 2) { + getRank(); + } +}) +// 领取奖励按钮 +$('.listBox .expBox .bottom .r .but').click(function () { + var status = $(this).attr('status'); + var leve = $(this).attr('leve'); + if (status == 1) { + getReward(leve); + } +}) +// 领取接口 +function getReward(level) { + showLoading() + networkRequest({ + type: 'post', + url: urlPrefix + '/act/expBattle/getReward', + data: { level }, + success(res) { + if (res.code === 200) { + getConfig(); + toastMsg(langReplace(localLang.demoModule.text43)); + } else { + toastMsg(res.message) + } + hideLoading(layerIndex) + }, + error(err) { + hideLoading(layerIndex) + toastMsg(langReplace(localLang.demoModule.layerIndex3)) + } + }) +} +// 打开活动规则 +$('.header .ruleIcon').click(function () { + $('.rule .rule_in .tab div').removeClass('act1').removeClass('act2'); + $('.rule .rule_in .tab .stab1 ').addClass(`act1`); + $(`.rule .rule_in .box .img1`).show().siblings().hide(); + $('.rule').show(); + bodyScroolFun(true); +}) +// 打开榜单规则 +$('.listBox2 .topReward .listRule').click(function () { + $('.rule .rule_in .tab div').removeClass('act1').removeClass('act2'); + $('.rule .rule_in .tab .stab2 ').addClass(`act2`); + $(`.rule .rule_in .box .img2`).show().siblings().hide(); + $('.rule').show(); + bodyScroolFun(true); +}) +// 关闭活动规则 +$('.rule').click(function () { + $('.rule').hide(); + bodyScroolFun(false); + return false +}) +// 切换规则 +$('.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${i}`).show().siblings().hide(); + return false +}) \ No newline at end of file diff --git a/view/molistar/activity/exp/local/ar.js b/view/molistar/activity/exp/local/ar.js new file mode 100644 index 00000000..40ebb84a --- /dev/null +++ b/view/molistar/activity/exp/local/ar.js @@ -0,0 +1,86 @@ +// 阿拉伯 +langAr = { + // 模块 + demoModule: { + layerIndex1: `جار التحميل...`, + layerIndex2: `تم العملية بنجاح`, + layerIndex3: `خطأ في الشبكة`, + img1: `background: url(./images/header_ar.png) no-repeat;background-size: 100% 100%;`, + img2: `background: url(./images/giftBg_ar.png) no-repeat;background-size: 100% 100%;`, + img5: `background: url(./images/topReward_ar.png) no-repeat;background-size: 100% 100%;`, + img3: `./images/rule1_ar.png`, + img4: `./images/rule2_ar.png`, + newIMg1:`./images/giftList1_ar.png`, + newIMg2:`./images/giftList2_ar.png`, + newIMg3:`./images/giftList3_ar.png`, + newIMg4:`./images/giftList4_ar.png`, + text1: `تحدى زيادة المستوى`, + text2: `قاعدة`, + text3: `توقيت الحدث :2024.08.22-2024.08.13`, + text4: `ارسال هديا ،لزيادة المستوى`, + text5: `مستخدم vip:يمكنه ارسال هديا الحدث والحصول على اعلي نقاط`, + text6: `509564EXP!`, + text7: `خاتم القمر`, + text8: `نجوم الفضاء `, + text9: `الفضائى`, + text10: `ملك الفضاء`, + text11: `مستوى`, + text12: `مكافئات`, + text13: `مستوى`, + text14: `اطارات`, + text15: `فقاعة محادثة`, + text16: `دخولية`, + text17: `وسام`, + text18: `فقاعة محادثة`, + text19: `مكافئة الحدث`, + text20: `ترتيب `, + text21: `(الوصول للمستوايات التالية يمكنك الحصول علي مكافئة)`, + text22: `سماء`, + // text23: `باقى على المستوى القادم`, + text23: ` `, + text24: `الحالي:LV.`, + text25: `قراءة المزيد`, + text26: `تبعا لهدايا الحدث المرسلة هيكون هناك ترتيب للحدث`, + text27: `(اول 50 مستخدم في قائمة الحدث يمكنهم الحصول علي جوائز)`, + text28: `نقاط المستوى `, + text29: `(ارسال هدايا وازداد فى نقاط المستوى)`, + text30: `جميع النقاط`, + text31: `قواعد الحدث`, + text32: `مكافئات الترتيب`, + text33: `انتهاء الحدث`, + text34: `احصل على `, + text35: `تم الحصول `, + text36: ` `, + text37: `قيمة الخبرة`, + text38: `باقى على الظهور في الترتيب :`, + text39: `باقى على الظهور في الترتيب :`, + text40: `لازالت تحتاج الى : لتظهر بقائمة الترتيب`, + text41: `باقى على الظهور في الترتيب :`, + text42: `غير مدرج`, + text43: `لقد حصلت علي المكافئة بنجاح`, + text44: `30`, + text45: `150`, + text46: `1200`, + text47: `13999`, + text48: `300 EXP`, + text49: `2250 EXP`, + text50: `26400 EXP`, + text51: `391972 EXP`, + newtext1:`7`, + newtexts1:`7`, + newtext2:`7`, + newtext3:`14`, + newtext4:`14`, + newtext5:`30`, + newtext6:`30`, + newtext7:`30`, + newtext8:`30`, + newText11:`*50`, + newText22:`*100`, + newText33:`*300`, + newText44:`*500`, + newText55:`*1000`, + newText66:`*1500`, + newText77:`*2000`, + } +} \ No newline at end of file diff --git a/view/molistar/activity/exp/local/en.js b/view/molistar/activity/exp/local/en.js new file mode 100644 index 00000000..a9fd51a4 --- /dev/null +++ b/view/molistar/activity/exp/local/en.js @@ -0,0 +1,84 @@ +langEn = { + demoModule: { + layerIndex1: `Loading...`, + layerIndex2: `Success`, + layerIndex3: `Network error`, + img1: `background: url(./images/header_en.png) no-repeat;background-size: 100% 100%;`, + img2: `background: url(./images/giftBg_en.png) no-repeat;background-size: 100% 100%;`, + img5: `background: url(./images/topReward_en.png) no-repeat;background-size: 100% 100%;`, + img3: `./images/rule1_en.png`, + img4: `./images/rule2_en.png`, + newIMg1:`./images/giftList1_en.png`, + newIMg2:`./images/giftList2_en.png`, + newIMg3:`./images/giftList3_en.png`, + newIMg4:`./images/giftList4_en.png`, + text1: `level event`, + text2: `rule`, + text3: `the time of event :2024.08.13-2024.08.22`, + text4: `send gifts and increase ur level`, + text5: `vip users can get more exp ,when they send gifts`, + text6: `1001000EXP!`, + text7: `Moon ring`, + text8: `Holy Demon Staff`, + text9: `Interstellar`, + text10: `Interstellar Overlord`, + text11: `level`, + text12: `reward`, + text13: `Level`, + text14: `Headwear`, + text15: `Chat bubble`, + text16: `Entry`, + text17: `Medal`, + text18: `Chat bubble`, + text19: `Level's rewards`, + text20: `Ranking`, + text21: `(When u reach these levels ,u can get these gifts)`, + text22: `days`, + // text23: `u still need ....exp to reach the next level`, + text23: ` `, + text24: `Current:LV.`, + text25: `more detalis`, + text26: `Ranked according to the EXP increased by sending event gifts, EXP The higher the rank, the higher the rank`, + text27: `(The top 50 users with the most EXP will receive event awards)`, + text28: `EXP Points`, + text29: `(Send gifts and increase ur level ,and get rewards)`, + text30: `The all expx points`, + text31: `The event rules`, + text32: `Leaderboard rewards`, + text33: `End of event`, + text34: `get it`, + text35: `Received`, + text36: ` `, + text37: `EXP value`, + text38: `u still need points to surpass the next user:`, + text39: `u still need points to surpass the next user:`, + text40: `u are Ahead of second place by points `, + text41: `u still need points to be in the ranking list:`, + text42: `not ranked`, + text43: `You've successfully claimed your reward!`, + text44: `1333`, + text45: `5000`, + text46: `12000`, + text47: `27500`, + text48: `13330 EXP`, + text49: `75000 EXP`, + text50: `264000 EXP`, + text51: `770000 EXP`, + newtext1:`7`, + newtexts1:`7`, + newtext2:`7`, + newtext3:`14`, + newtext4:`14`, + newtext5:`30`, + newtext6:`30`, + newtext7:`30`, + newtext8:`30`, + newText11:`*50`, + newText22:`*100`, + newText33:`*300`, + newText44:`*500`, + newText55:`*1000`, + newText66:`*1500`, + newText77:`*2000`, + } +} diff --git a/view/molistar/activity/exp/local/zh.js b/view/molistar/activity/exp/local/zh.js new file mode 100644 index 00000000..f28cc235 --- /dev/null +++ b/view/molistar/activity/exp/local/zh.js @@ -0,0 +1,86 @@ +// 中文 +langZh = { + // 模塊 + demoModule: { + layerIndex1: `加載中...`, + layerIndex2: `操作成功`, + layerIndex3: `網絡錯誤`, + img1: `background: url(./images/header.png) no-repeat;background-size: 100% 100%;`, + img2: `background: url(./images/giftBg.png) no-repeat;background-size: 100% 100%;`, + img5: `background: url(./images/topReward.png) no-repeat;background-size: 100% 100%;`, + img3: `./images/rule1.png`, + img4: `./images/rule2.png`, + newIMg1: `./images/giftList1.png`, + newIMg2: `./images/giftList2.png`, + newIMg3: `./images/giftList3.png`, + newIMg4: `./images/giftList4.png`, + text1: `加速之戰`, + text2: `規則`, + text3: `活動時間:2024.08.13-08.22`, + text4: `送禮物,增加EXP`, + text5: `VIP用戶送出活動禮物最高可獲得`, + text6: `1892800EXP!`, + text7: `星芒石`, + text8: `聖魔權杖`, + text9: `浩瀚星河`, + text10: `星辰之力`, + text11: `等級`, + text12: `獎勵`, + text13: `級`, + text14: `頭飾`, + text15: `氣泡`, + text16: `座駕`, + text17: `勳章`, + text18: `氣泡`, + text19: `等級獎勵`, + text20: `榜單`, + text21: `(達到以下等級即可領取獎勵)`, + text22: `天`, + // text23: `距離下一等級還差`, + text23: ` `, + text24: `當前:LV.`, + text25: `查看更多`, + text26: `根據送出活動禮物增加的EXP進行排名,EXP越高排序越靠前`, + text27: `(EXP最多的前TOP50名用戶將會獲得活動獎勵)`, + text28: `EXP等級`, + text29: `(送禮物增加EXP,達到等級領取獎勵)`, + text30: `需要的EXP`, + text31: `活動規則`, + text32: `榜單獎勵`, + text33: `活動結束`, + text34: `領取`, + text35: `已領取`, + text36: `虛位以待`, + text37: `EXP值`, + text38: `距離上榜還差:`, + text39: `距離上榜還差:`, + text40: `領先第二名:`, + text41: `距上一名還差:`, + text42: `未上榜`, + text43: `您已成功領取獎勵`, + text44: `990`, + text45: `5200`, + text46: `13140`, + text47: `52000`, + text48: `9900 EXP`, + text49: `78000 EXP`, + text50: `289080 EXP`, + text51: `1456000 EXP`, + newtext1: `7`, + newtexts1: `7`, + newtext2: `7`, + newtext3: `14`, + newtext4: `14`, + newtext5: `30`, + newtext6: `30`, + newtext7: `30`, + newtext8: `30`, + newText11: `*100`, + newText22: `*500`, + newText33: `*1000`, + newText44: `*5000`, + newText55: `*10000`, + newText66: `*15000`, + newText77: `*20000`, + }, +} \ No newline at end of file